Can you detect attribute changes to googleAutoComplete results via a mutationObserver?2019 Community Moderator ElectionHow can you encode a string to Base64 in JavaScript?How can you check for a #hash in a URL using JavaScript?How can I know which radio button is selected via jQuery?Detect changes in the DOMjQuery autocomplete box disappears on scroll?Google Maps: Distinguishing Enter Click SourceWhy does MutationObserver fire twice for childList but never for characterData?Javascript: Registering *every* DOM Element on creation/appending to DOMWhy does MutationObserver not recognize the xlink:href attribute in the attributeFilter array?Detect scrollHeight change with MutationObserver?
Are small insurances worth it?
Finding the minimum value of a function without using Calculus
(Codewars) Linked Lists-Sorted Insert
Automaton recognizing ambiguously accepted words of another automaton
Having the player face themselves after the mid-game
Is it possible to clone a polymorphic object without manually adding overridden clone method into each derived class in C++?
When an outsider describes family relationships, which point of view are they using?
Trocar background-image com delay via jQuery
Why is there an extra space when I type "ls" on the Desktop?
Can the Witch Sight warlock invocation see through the Mirror Image spell?
Is "cogitate" used appropriately in "I cogitate that success relies on hard work"?
How do I raise a figure (placed with wrapfig) to be flush with the top of a paragraph?
What should I do when a paper is published similar to my PhD thesis without citation?
Either of .... (Plural/Singular)
Did Amazon pay $0 in taxes last year?
How to copy the rest of lines of a file to another file
Would those living in a "perfect society" not understand satire
Has a sovereign Communist government ever run, and conceded loss, on a fair election?
-1 to the power of a irrational number
What was so special about The Piano that Ada was willing to do anything to have it?
What is the purpose of a disclaimer like "this is not legal advice"?
Should we avoid writing fiction about historical events without extensive research?
If sound is a longitudinal wave, why can we hear it if our ears aren't aligned with the propagation direction?
PTIJ: Sport in the Torah
Can you detect attribute changes to googleAutoComplete results via a mutationObserver?
2019 Community Moderator ElectionHow can you encode a string to Base64 in JavaScript?How can you check for a #hash in a URL using JavaScript?How can I know which radio button is selected via jQuery?Detect changes in the DOMjQuery autocomplete box disappears on scroll?Google Maps: Distinguishing Enter Click SourceWhy does MutationObserver fire twice for childList but never for characterData?Javascript: Registering *every* DOM Element on creation/appending to DOMWhy does MutationObserver not recognize the xlink:href attribute in the attributeFilter array?Detect scrollHeight change with MutationObserver?
I'm using a mutationObserver to watch for changes to a google autoComplete search result. I'm wondering if it's possible to watch for on the fly changes that occur when the user is using the arrow keys to navigate through the results.
This is the function that gets called when the input value changes:
_getSearchResults()
this.MutationObserver = new MutationObserver(mutations =>
mutations.map(mutation =>
const childElementCount = mutation.target.childElementCount;
this.props.searchResultCallback(childElementCount);
this.MutationObserver.disconnect();
);
);
if (this.googleSearchContainer)
this.MutationObserver.observe(this.googleSearchContainer,
childList: true,
subtree: true
);
This works great for when the length of the childNodes changes - but can you cause the mutationObserver to fire when a style or class changes on the highlighted search result?
Is what causes a search result to have a grey background the results of a class change? If so, what is the name of that class?
It's difficult to detect since the autoComplete disappears when you inspect the browser.
javascript google-maps autocomplete mutation-observers
add a comment |
I'm using a mutationObserver to watch for changes to a google autoComplete search result. I'm wondering if it's possible to watch for on the fly changes that occur when the user is using the arrow keys to navigate through the results.
This is the function that gets called when the input value changes:
_getSearchResults()
this.MutationObserver = new MutationObserver(mutations =>
mutations.map(mutation =>
const childElementCount = mutation.target.childElementCount;
this.props.searchResultCallback(childElementCount);
this.MutationObserver.disconnect();
);
);
if (this.googleSearchContainer)
this.MutationObserver.observe(this.googleSearchContainer,
childList: true,
subtree: true
);
This works great for when the length of the childNodes changes - but can you cause the mutationObserver to fire when a style or class changes on the highlighted search result?
Is what causes a search result to have a grey background the results of a class change? If so, what is the name of that class?
It's difficult to detect since the autoComplete disappears when you inspect the browser.
javascript google-maps autocomplete mutation-observers
please describe why there's a downvote - will help us both - thanks :)
– zero_cool
Mar 6 at 22:34
1
Inspect the difference between the states you need to detect in devtools. It could be an attribute e.g.classorstyle, in which case you can add another observer with attributes: true, attributeFilter: ['class', 'style'] and check the target's attributes in the callback.
– wOxxOm
2 days ago
I'll give that a shot - thank you :)
– zero_cool
2 days ago
add a comment |
I'm using a mutationObserver to watch for changes to a google autoComplete search result. I'm wondering if it's possible to watch for on the fly changes that occur when the user is using the arrow keys to navigate through the results.
This is the function that gets called when the input value changes:
_getSearchResults()
this.MutationObserver = new MutationObserver(mutations =>
mutations.map(mutation =>
const childElementCount = mutation.target.childElementCount;
this.props.searchResultCallback(childElementCount);
this.MutationObserver.disconnect();
);
);
if (this.googleSearchContainer)
this.MutationObserver.observe(this.googleSearchContainer,
childList: true,
subtree: true
);
This works great for when the length of the childNodes changes - but can you cause the mutationObserver to fire when a style or class changes on the highlighted search result?
Is what causes a search result to have a grey background the results of a class change? If so, what is the name of that class?
It's difficult to detect since the autoComplete disappears when you inspect the browser.
javascript google-maps autocomplete mutation-observers
I'm using a mutationObserver to watch for changes to a google autoComplete search result. I'm wondering if it's possible to watch for on the fly changes that occur when the user is using the arrow keys to navigate through the results.
This is the function that gets called when the input value changes:
_getSearchResults()
this.MutationObserver = new MutationObserver(mutations =>
mutations.map(mutation =>
const childElementCount = mutation.target.childElementCount;
this.props.searchResultCallback(childElementCount);
this.MutationObserver.disconnect();
);
);
if (this.googleSearchContainer)
this.MutationObserver.observe(this.googleSearchContainer,
childList: true,
subtree: true
);
This works great for when the length of the childNodes changes - but can you cause the mutationObserver to fire when a style or class changes on the highlighted search result?
Is what causes a search result to have a grey background the results of a class change? If so, what is the name of that class?
It's difficult to detect since the autoComplete disappears when you inspect the browser.
javascript google-maps autocomplete mutation-observers
javascript google-maps autocomplete mutation-observers
edited Mar 6 at 23:33
zero_cool
asked Mar 6 at 22:23
zero_coolzero_cool
1,53911925
1,53911925
please describe why there's a downvote - will help us both - thanks :)
– zero_cool
Mar 6 at 22:34
1
Inspect the difference between the states you need to detect in devtools. It could be an attribute e.g.classorstyle, in which case you can add another observer with attributes: true, attributeFilter: ['class', 'style'] and check the target's attributes in the callback.
– wOxxOm
2 days ago
I'll give that a shot - thank you :)
– zero_cool
2 days ago
add a comment |
please describe why there's a downvote - will help us both - thanks :)
– zero_cool
Mar 6 at 22:34
1
Inspect the difference between the states you need to detect in devtools. It could be an attribute e.g.classorstyle, in which case you can add another observer with attributes: true, attributeFilter: ['class', 'style'] and check the target's attributes in the callback.
– wOxxOm
2 days ago
I'll give that a shot - thank you :)
– zero_cool
2 days ago
please describe why there's a downvote - will help us both - thanks :)
– zero_cool
Mar 6 at 22:34
please describe why there's a downvote - will help us both - thanks :)
– zero_cool
Mar 6 at 22:34
1
1
Inspect the difference between the states you need to detect in devtools. It could be an attribute e.g.
class or style, in which case you can add another observer with attributes: true, attributeFilter: ['class', 'style'] and check the target's attributes in the callback.– wOxxOm
2 days ago
Inspect the difference between the states you need to detect in devtools. It could be an attribute e.g.
class or style, in which case you can add another observer with attributes: true, attributeFilter: ['class', 'style'] and check the target's attributes in the callback.– wOxxOm
2 days ago
I'll give that a shot - thank you :)
– zero_cool
2 days ago
I'll give that a shot - thank you :)
– zero_cool
2 days ago
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55033134%2fcan-you-detect-attribute-changes-to-googleautocomplete-results-via-a-mutationobs%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55033134%2fcan-you-detect-attribute-changes-to-googleautocomplete-results-via-a-mutationobs%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
please describe why there's a downvote - will help us both - thanks :)
– zero_cool
Mar 6 at 22:34
1
Inspect the difference between the states you need to detect in devtools. It could be an attribute e.g.
classorstyle, in which case you can add another observer with attributes: true, attributeFilter: ['class', 'style'] and check the target's attributes in the callback.– wOxxOm
2 days ago
I'll give that a shot - thank you :)
– zero_cool
2 days ago