i want to toggle one div after ajax call loads the page
-4
I am triggering a click event on one element. which in turn calls some function which has ajax calls in them. I want to toggle one div(which will get loaded after ajax call) after ajax call loads the page.
function triggerFunction(){
$("#trigger_div").trigger("click");
$("#toggle_div").toggle(); //this div gets loaded after ajax call which happens after triggering click event
}
javascript jquery ajax
asked Nov 27 '18 at 7:42
KetanKetan
11
add a comment |
-4
I am triggering a click event on one element. which in turn calls some function which has ajax calls in them. I want to toggle one div(which will get loaded after ajax call) after ajax call loads the page.
function triggerFunction(){
$("#trigger_div").trigger("click");
$("#toggle_div").toggle(); //this div gets loaded after ajax call which happens after triggering click event
}
javascript jquery ajax
asked Nov 27 '18 at 7:42
KetanKetan
11
You need to post your AJAX call to. Either you use callbacks or promises or async/await?
– yunzen
Nov 27 '18 at 7:49
add a comment |
-4
-4
-4
I am triggering a click event on one element. which in turn calls some function which has ajax calls in them. I want to toggle one div(which will get loaded after ajax call) after ajax call loads the page.
function triggerFunction(){
$("#trigger_div").trigger("click");
$("#toggle_div").toggle(); //this div gets loaded after ajax call which happens after triggering click event
}
javascript jquery ajax
asked Nov 27 '18 at 7:42
KetanKetan
11
I am triggering a click event on one element. which in turn calls some function which has ajax calls in them. I want to toggle one div(which will get loaded after ajax call) after ajax call loads the page.
function triggerFunction(){
$("#trigger_div").trigger("click");
$("#toggle_div").toggle(); //this div gets loaded after ajax call which happens after triggering click event
}
javascript jquery ajax
javascript jquery ajax
asked Nov 27 '18 at 7:42
KetanKetan
11
asked Nov 27 '18 at 7:42
KetanKetan
11
edited Nov 27 '18 at 8:58
Ketan
asked Nov 27 '18 at 7:42
KetanKetan
11
asked Nov 27 '18 at 7:42
KetanKetan
11
asked Nov 27 '18 at 7:42
KetanKetan
11
11
You need to post your AJAX call to. Either you use callbacks or promises or async/await?
– yunzen
Nov 27 '18 at 7:49
add a comment |
You need to post your AJAX call to. Either you use callbacks or promises or async/await?
– yunzen
Nov 27 '18 at 7:49
You need to post your AJAX call to. Either you use callbacks or promises or async/await?
– yunzen
Nov 27 '18 at 7:49
You need to post your AJAX call to. Either you use callbacks or promises or async/await?
– yunzen
Nov 27 '18 at 7:49
add a comment |
1 Answer
1
active
oldest
votes
0
You can use jQuery css() Method to update the css of any div in success callback of ajax.
Here is how you can make it work
$.ajax({
url: './AnotherPage.php',
success: function(output) {
$("#toggle_div"). toggle();
$("#toggle_div").css("css_property", "property_value");
// $("#toggle_div").css("background_color", "red");
}
});
Recommend you to always use success and failure callback for Ajax .
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
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
});
}
});
draft saved
draft discarded
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%2f53494886%2fi-want-to-toggle-one-div-after-ajax-call-loads-the-page%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
0
You can use jQuery css() Method to update the css of any div in success callback of ajax.
Here is how you can make it work
$.ajax({
url: './AnotherPage.php',
success: function(output) {
$("#toggle_div"). toggle();
$("#toggle_div").css("css_property", "property_value");
// $("#toggle_div").css("background_color", "red");
}
});
Recommend you to always use success and failure callback for Ajax .
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
add a comment |
0
You can use jQuery css() Method to update the css of any div in success callback of ajax.
Here is how you can make it work
$.ajax({
url: './AnotherPage.php',
success: function(output) {
$("#toggle_div"). toggle();
$("#toggle_div").css("css_property", "property_value");
// $("#toggle_div").css("background_color", "red");
}
});
Recommend you to always use success and failure callback for Ajax .
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
add a comment |
0
0
0
You can use jQuery css() Method to update the css of any div in success callback of ajax.
Here is how you can make it work
$.ajax({
url: './AnotherPage.php',
success: function(output) {
$("#toggle_div"). toggle();
$("#toggle_div").css("css_property", "property_value");
// $("#toggle_div").css("background_color", "red");
}
});
Recommend you to always use success and failure callback for Ajax .
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
You can use jQuery css() Method to update the css of any div in success callback of ajax.
Here is how you can make it work
$.ajax({
url: './AnotherPage.php',
success: function(output) {
$("#toggle_div"). toggle();
$("#toggle_div").css("css_property", "property_value");
// $("#toggle_div").css("background_color", "red");
}
});
Recommend you to always use success and failure callback for Ajax .
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
answered Nov 27 '18 at 7:54
Prateek SrivastavaPrateek Srivastava
113
113
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
add a comment |
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
But i dont have access to underline ajax call. I am just triggering one click event which in turn can have multiple ajax call.
– Ketan
Nov 27 '18 at 8:57
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
cleanest way to do this i've mentioned already but in your case as you say you don't have access to success functions, Use something like this function callAjaxfunc(callback) { //All ajax calls called here onAjaxSuccess: function() { callback(); }; $("#toggle_div"). toggle(); $("#toggle_div").css("css_property", "property_value"); }
– Prateek Srivastava
Nov 27 '18 at 10:27
add a comment |
draft saved
draft discarded
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.
draft saved
draft discarded
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%2f53494886%2fi-want-to-toggle-one-div-after-ajax-call-loads-the-page%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
You need to post your AJAX call to. Either you use callbacks or promises or async/await?
– yunzen
Nov 27 '18 at 7:49