Use scrollToView to go to a newly created paper card element in a dom-repeat
I have a paper card in a dom-repeat.
I have a button that adds a new person using an Ajax call. In the response I use this.push to add it to the person array. This then triggers the dom-repeat to add a new paper-card.
The paper-cards have an id= "person_+[index]. In my Ajax response; after this.push, I attempt to get the newly added person paper-card element with the id using queryselector but it's does no exist and returns null, so I am unable to call scrollToView(). It's like the paper-card isn't stamped and the added person index does not exist. How can I add a person, trigger the dom-repeat, get the new ID and use scrollToView to go to the newly created paper-card. Thanks
javascript polymer polymer-2.x
edited Jan 1 at 7:55
PrakashG
1,100720
asked Jan 1 at 7:49
JBenz788JBenz788
53
add a comment |
I have a paper card in a dom-repeat.
I have a button that adds a new person using an Ajax call. In the response I use this.push to add it to the person array. This then triggers the dom-repeat to add a new paper-card.
The paper-cards have an id= "person_+[index]. In my Ajax response; after this.push, I attempt to get the newly added person paper-card element with the id using queryselector but it's does no exist and returns null, so I am unable to call scrollToView(). It's like the paper-card isn't stamped and the added person index does not exist. How can I add a person, trigger the dom-repeat, get the new ID and use scrollToView to go to the newly created paper-card. Thanks
javascript polymer polymer-2.x
edited Jan 1 at 7:55
PrakashG
1,100720
asked Jan 1 at 7:49
JBenz788JBenz788
53
Could you please add your code in order to inspect whether exist an error or not. I think giving Id seam not correct.
– HakanC
Jan 6 at 9:01
add a comment |
I have a paper card in a dom-repeat.
I have a button that adds a new person using an Ajax call. In the response I use this.push to add it to the person array. This then triggers the dom-repeat to add a new paper-card.
The paper-cards have an id= "person_+[index]. In my Ajax response; after this.push, I attempt to get the newly added person paper-card element with the id using queryselector but it's does no exist and returns null, so I am unable to call scrollToView(). It's like the paper-card isn't stamped and the added person index does not exist. How can I add a person, trigger the dom-repeat, get the new ID and use scrollToView to go to the newly created paper-card. Thanks
javascript polymer polymer-2.x
edited Jan 1 at 7:55
PrakashG
1,100720
asked Jan 1 at 7:49
JBenz788JBenz788
53
I have a paper card in a dom-repeat.
I have a button that adds a new person using an Ajax call. In the response I use this.push to add it to the person array. This then triggers the dom-repeat to add a new paper-card.
The paper-cards have an id= "person_+[index]. In my Ajax response; after this.push, I attempt to get the newly added person paper-card element with the id using queryselector but it's does no exist and returns null, so I am unable to call scrollToView(). It's like the paper-card isn't stamped and the added person index does not exist. How can I add a person, trigger the dom-repeat, get the new ID and use scrollToView to go to the newly created paper-card. Thanks
javascript polymer polymer-2.x
javascript polymer polymer-2.x
edited Jan 1 at 7:55
PrakashG
1,100720
asked Jan 1 at 7:49
JBenz788JBenz788
53
edited Jan 1 at 7:55
PrakashG
1,100720
asked Jan 1 at 7:49
JBenz788JBenz788
53
edited Jan 1 at 7:55
PrakashG
1,100720
edited Jan 1 at 7:55
PrakashG
1,100720
edited Jan 1 at 7:55
PrakashG
1,100720
1,100720
asked Jan 1 at 7:49
JBenz788JBenz788
53
asked Jan 1 at 7:49
JBenz788JBenz788
53
asked Jan 1 at 7:49
JBenz788JBenz788
53
53
Could you please add your code in order to inspect whether exist an error or not. I think giving Id seam not correct.
– HakanC
Jan 6 at 9:01
add a comment |
Could you please add your code in order to inspect whether exist an error or not. I think giving Id seam not correct.
– HakanC
Jan 6 at 9:01
Could you please add your code in order to inspect whether exist an error or not. I think giving Id seam not correct.
– HakanC
Jan 6 at 9:01
Could you please add your code in order to inspect whether exist an error or not. I think giving Id seam not correct.
– HakanC
Jan 6 at 9:01
add a comment |
1 Answer
1
active
oldest
votes
You need to pospone the code after the push until the element has been rendered.
Do this using the updateComplete promise
See the documentation reference
answered Jan 2 at 13:31
valsvals
45.3k757109
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
add a comment |
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%2f53993868%2fuse-scrolltoview-to-go-to-a-newly-created-paper-card-element-in-a-dom-repeat%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You need to pospone the code after the push until the element has been rendered.
Do this using the updateComplete promise
See the documentation reference
answered Jan 2 at 13:31
valsvals
45.3k757109
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
add a comment |
You need to pospone the code after the push until the element has been rendered.
Do this using the updateComplete promise
See the documentation reference
answered Jan 2 at 13:31
valsvals
45.3k757109
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
add a comment |
You need to pospone the code after the push until the element has been rendered.
Do this using the updateComplete promise
See the documentation reference
answered Jan 2 at 13:31
valsvals
45.3k757109
You need to pospone the code after the push until the element has been rendered.
Do this using the updateComplete promise
See the documentation reference
answered Jan 2 at 13:31
valsvals
45.3k757109
answered Jan 2 at 13:31
valsvals
45.3k757109
answered Jan 2 at 13:31
valsvals
45.3k757109
answered Jan 2 at 13:31
valsvals
45.3k757109
45.3k757109
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
add a comment |
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Not using polymer lite-element....
– JBenz788
Jan 2 at 20:05
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
Sorry ! check this one stackoverflow.com/a/46532736/1926369
– vals
Jan 2 at 21:50
add a comment |
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%2f53993868%2fuse-scrolltoview-to-go-to-a-newly-created-paper-card-element-in-a-dom-repeat%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
Could you please add your code in order to inspect whether exist an error or not. I think giving Id seam not correct.
– HakanC
Jan 6 at 9:01