My “myModal” div id is not calling in setTimeout Function using jquery
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
0
I want to show poppup box if user sticks more than 10seconds in website, I tried with jquery settimeout function, it is not showing, please check this, I don't know where i went wrong. Here is my link also http://lotusvaluedevelopers.com/contactside.html,
If we click contact us, the popup will come, what I am trying to do, user sticks more than 10second in website, I need to trigger the popup automatically or any autotrigger function also available.
How to trigger the function after 10s using jquery trigger. because the slide toggle is not showing in online, i try with trigger
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
$('#myModal').slideToggle();
}, 1000);
});
</script>
I tried with this code also no output
$("document").ready(function() {
setTimeout(function() {
$("#myModal").trigger();
},10);
});
<div class="container">
<div class="container-box rotated">
<button type="button" class="btn btn-info btn-lg turned-button" data-toggle="modal" data-target="#myModal">Contact Us</button>
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">
Contact Us
</h4>
</div>
<div class="modal-body">
<form role="form" method="post" id="reused_form">
<p> Send your message in the form below and we will get back to you as early as possible. </p>
<div class="form-group">
<label for="name"> Name:</label>
<input type="text" class="form-control" id="name" name="name" required maxlength="50">
</div>
</div>
<button type="submit" class="btn btn-lg btn-success btn-block" id="btnContactUs">Post It! →</button>
</form>
</div>
</div>
</div>
</div>
</div>jquery bootstrap-modal
edited Nov 17 '18 at 8:09
Foo
1
asked Nov 17 '18 at 7:01
kaviyakaviya
425
|
show 3 more comments
0
I want to show poppup box if user sticks more than 10seconds in website, I tried with jquery settimeout function, it is not showing, please check this, I don't know where i went wrong. Here is my link also http://lotusvaluedevelopers.com/contactside.html,
If we click contact us, the popup will come, what I am trying to do, user sticks more than 10second in website, I need to trigger the popup automatically or any autotrigger function also available.
How to trigger the function after 10s using jquery trigger. because the slide toggle is not showing in online, i try with trigger
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
$('#myModal').slideToggle();
}, 1000);
});
</script>
I tried with this code also no output
$("document").ready(function() {
setTimeout(function() {
$("#myModal").trigger();
},10);
});
<div class="container">
<div class="container-box rotated">
<button type="button" class="btn btn-info btn-lg turned-button" data-toggle="modal" data-target="#myModal">Contact Us</button>
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">
Contact Us
</h4>
</div>
<div class="modal-body">
<form role="form" method="post" id="reused_form">
<p> Send your message in the form below and we will get back to you as early as possible. </p>
<div class="form-group">
<label for="name"> Name:</label>
<input type="text" class="form-control" id="name" name="name" required maxlength="50">
</div>
</div>
<button type="submit" class="btn btn-lg btn-success btn-block" id="btnContactUs">Post It! →</button>
</form>
</div>
</div>
</div>
</div>
</div>jquery bootstrap-modal
edited Nov 17 '18 at 8:09
Foo
1
asked Nov 17 '18 at 7:01
kaviyakaviya
425
1
For ten seconds, you need to apply 10000ms, not 1000ms. Aside from that there's basic validation errors in your HTML.
– connexo
Nov 17 '18 at 7:18
The code work in jsfiddle.net/n0rLck68
– Mohammad
Nov 17 '18 at 7:19
I uploaded in server kindly check in given link lotusvaluedevelopers.com/contactside.html it is not coming
– kaviya
Nov 17 '18 at 7:24
just let me know how to trigger the function after 10seconds using jquery trigger. because the slide toggle is not showing in online, i try with trigger
– kaviya
Nov 17 '18 at 7:34
The code work in snippet. So what is problem?
– Mohammad
Nov 17 '18 at 7:42
|
show 3 more comments
0
0
0
I want to show poppup box if user sticks more than 10seconds in website, I tried with jquery settimeout function, it is not showing, please check this, I don't know where i went wrong. Here is my link also http://lotusvaluedevelopers.com/contactside.html,
If we click contact us, the popup will come, what I am trying to do, user sticks more than 10second in website, I need to trigger the popup automatically or any autotrigger function also available.
How to trigger the function after 10s using jquery trigger. because the slide toggle is not showing in online, i try with trigger
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
$('#myModal').slideToggle();
}, 1000);
});
</script>
I tried with this code also no output
$("document").ready(function() {
setTimeout(function() {
$("#myModal").trigger();
},10);
});
<div class="container">
<div class="container-box rotated">
<button type="button" class="btn btn-info btn-lg turned-button" data-toggle="modal" data-target="#myModal">Contact Us</button>
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">
Contact Us
</h4>
</div>
<div class="modal-body">
<form role="form" method="post" id="reused_form">
<p> Send your message in the form below and we will get back to you as early as possible. </p>
<div class="form-group">
<label for="name"> Name:</label>
<input type="text" class="form-control" id="name" name="name" required maxlength="50">
</div>
</div>
<button type="submit" class="btn btn-lg btn-success btn-block" id="btnContactUs">Post It! →</button>
</form>
</div>
</div>
</div>
</div>
</div>jquery bootstrap-modal
edited Nov 17 '18 at 8:09
Foo
1
asked Nov 17 '18 at 7:01
kaviyakaviya
425
I want to show poppup box if user sticks more than 10seconds in website, I tried with jquery settimeout function, it is not showing, please check this, I don't know where i went wrong. Here is my link also http://lotusvaluedevelopers.com/contactside.html,
If we click contact us, the popup will come, what I am trying to do, user sticks more than 10second in website, I need to trigger the popup automatically or any autotrigger function also available.
How to trigger the function after 10s using jquery trigger. because the slide toggle is not showing in online, i try with trigger
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
$('#myModal').slideToggle();
}, 1000);
});
</script>
I tried with this code also no output
$("document").ready(function() {
setTimeout(function() {
$("#myModal").trigger();
},10);
});
<div class="container">
<div class="container-box rotated">
<button type="button" class="btn btn-info btn-lg turned-button" data-toggle="modal" data-target="#myModal">Contact Us</button>
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">
Contact Us
</h4>
</div>
<div class="modal-body">
<form role="form" method="post" id="reused_form">
<p> Send your message in the form below and we will get back to you as early as possible. </p>
<div class="form-group">
<label for="name"> Name:</label>
<input type="text" class="form-control" id="name" name="name" required maxlength="50">
</div>
</div>
<button type="submit" class="btn btn-lg btn-success btn-block" id="btnContactUs">Post It! →</button>
</form>
</div>
</div>
</div>
</div>
</div><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
$('#myModal').slideToggle();
}, 1000);
});
</script>
I tried with this code also no output
$("document").ready(function() {
setTimeout(function() {
$("#myModal").trigger();
},10);
});
<div class="container">
<div class="container-box rotated">
<button type="button" class="btn btn-info btn-lg turned-button" data-toggle="modal" data-target="#myModal">Contact Us</button>
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">
Contact Us
</h4>
</div>
<div class="modal-body">
<form role="form" method="post" id="reused_form">
<p> Send your message in the form below and we will get back to you as early as possible. </p>
<div class="form-group">
<label for="name"> Name:</label>
<input type="text" class="form-control" id="name" name="name" required maxlength="50">
</div>
</div>
<button type="submit" class="btn btn-lg btn-success btn-block" id="btnContactUs">Post It! →</button>
</form>
</div>
</div>
</div>
</div>
</div><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
$('#myModal').slideToggle();
}, 1000);
});
</script>
I tried with this code also no output
$("document").ready(function() {
setTimeout(function() {
$("#myModal").trigger();
},10);
});
<div class="container">
<div class="container-box rotated">
<button type="button" class="btn btn-info btn-lg turned-button" data-toggle="modal" data-target="#myModal">Contact Us</button>
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">
Contact Us
</h4>
</div>
<div class="modal-body">
<form role="form" method="post" id="reused_form">
<p> Send your message in the form below and we will get back to you as early as possible. </p>
<div class="form-group">
<label for="name"> Name:</label>
<input type="text" class="form-control" id="name" name="name" required maxlength="50">
</div>
</div>
<button type="submit" class="btn btn-lg btn-success btn-block" id="btnContactUs">Post It! →</button>
</form>
</div>
</div>
</div>
</div>
</div>jquery bootstrap-modal
jquery bootstrap-modal
edited Nov 17 '18 at 8:09
Foo
1
asked Nov 17 '18 at 7:01
kaviyakaviya
425
edited Nov 17 '18 at 8:09
Foo
1
asked Nov 17 '18 at 7:01
kaviyakaviya
425
edited Nov 17 '18 at 8:09
Foo
1
edited Nov 17 '18 at 8:09
Foo
1
edited Nov 17 '18 at 8:09
Foo
1
1
asked Nov 17 '18 at 7:01
kaviyakaviya
425
asked Nov 17 '18 at 7:01
kaviyakaviya
425
asked Nov 17 '18 at 7:01
kaviyakaviya
425
425
1
For ten seconds, you need to apply 10000ms, not 1000ms. Aside from that there's basic validation errors in your HTML.
– connexo
Nov 17 '18 at 7:18
The code work in jsfiddle.net/n0rLck68
– Mohammad
Nov 17 '18 at 7:19
I uploaded in server kindly check in given link lotusvaluedevelopers.com/contactside.html it is not coming
– kaviya
Nov 17 '18 at 7:24
just let me know how to trigger the function after 10seconds using jquery trigger. because the slide toggle is not showing in online, i try with trigger
– kaviya
Nov 17 '18 at 7:34
The code work in snippet. So what is problem?
– Mohammad
Nov 17 '18 at 7:42
|
show 3 more comments
1
For ten seconds, you need to apply 10000ms, not 1000ms. Aside from that there's basic validation errors in your HTML.
– connexo
Nov 17 '18 at 7:18
The code work in jsfiddle.net/n0rLck68
– Mohammad
Nov 17 '18 at 7:19
I uploaded in server kindly check in given link lotusvaluedevelopers.com/contactside.html it is not coming
– kaviya
Nov 17 '18 at 7:24
just let me know how to trigger the function after 10seconds using jquery trigger. because the slide toggle is not showing in online, i try with trigger
– kaviya
Nov 17 '18 at 7:34
The code work in snippet. So what is problem?
– Mohammad
Nov 17 '18 at 7:42
1
1
For ten seconds, you need to apply 10000ms, not 1000ms. Aside from that there's basic validation errors in your HTML.
– connexo
Nov 17 '18 at 7:18
For ten seconds, you need to apply 10000ms, not 1000ms. Aside from that there's basic validation errors in your HTML.
– connexo
Nov 17 '18 at 7:18
The code work in jsfiddle.net/n0rLck68
– Mohammad
Nov 17 '18 at 7:19
The code work in jsfiddle.net/n0rLck68
– Mohammad
Nov 17 '18 at 7:19
I uploaded in server kindly check in given link lotusvaluedevelopers.com/contactside.html it is not coming
– kaviya
Nov 17 '18 at 7:24
I uploaded in server kindly check in given link lotusvaluedevelopers.com/contactside.html it is not coming
– kaviya
Nov 17 '18 at 7:24
just let me know how to trigger the function after 10seconds using jquery trigger. because the slide toggle is not showing in online, i try with trigger
– kaviya
Nov 17 '18 at 7:34
just let me know how to trigger the function after 10seconds using jquery trigger. because the slide toggle is not showing in online, i try with trigger
– kaviya
Nov 17 '18 at 7:34
The code work in snippet. So what is problem?
– Mohammad
Nov 17 '18 at 7:42
The code work in snippet. So what is problem?
– Mohammad
Nov 17 '18 at 7:42
|
show 3 more comments
1 Answer
1
active
oldest
votes
2
According to Bootstrap docs, if you want to manually show/display a modal, you will have to use modal('show') method. (More ref: https://getbootstrap.com/docs/3.3/javascript/#modals-events)
Example:
$('#myModal').modal('show')
In your case try doing the same:
$(document).ready(function() {
setTimeout(function() {
$('#myModal').modal('show');
}, 10000);
});
Time should be in ms, 10000ms = 10sec.
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
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%2f53349008%2fmy-mymodal-div-id-is-not-calling-in-settimeout-function-using-jquery%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
2
According to Bootstrap docs, if you want to manually show/display a modal, you will have to use modal('show') method. (More ref: https://getbootstrap.com/docs/3.3/javascript/#modals-events)
Example:
$('#myModal').modal('show')
In your case try doing the same:
$(document).ready(function() {
setTimeout(function() {
$('#myModal').modal('show');
}, 10000);
});
Time should be in ms, 10000ms = 10sec.
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
add a comment |
2
According to Bootstrap docs, if you want to manually show/display a modal, you will have to use modal('show') method. (More ref: https://getbootstrap.com/docs/3.3/javascript/#modals-events)
Example:
$('#myModal').modal('show')
In your case try doing the same:
$(document).ready(function() {
setTimeout(function() {
$('#myModal').modal('show');
}, 10000);
});
Time should be in ms, 10000ms = 10sec.
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
add a comment |
2
2
2
According to Bootstrap docs, if you want to manually show/display a modal, you will have to use modal('show') method. (More ref: https://getbootstrap.com/docs/3.3/javascript/#modals-events)
Example:
$('#myModal').modal('show')
In your case try doing the same:
$(document).ready(function() {
setTimeout(function() {
$('#myModal').modal('show');
}, 10000);
});
Time should be in ms, 10000ms = 10sec.
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
According to Bootstrap docs, if you want to manually show/display a modal, you will have to use modal('show') method. (More ref: https://getbootstrap.com/docs/3.3/javascript/#modals-events)
Example:
$('#myModal').modal('show')
In your case try doing the same:
$(document).ready(function() {
setTimeout(function() {
$('#myModal').modal('show');
}, 10000);
});
Time should be in ms, 10000ms = 10sec.
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
edited Nov 23 '18 at 2:29
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
answered Nov 17 '18 at 7:50
Vishnu BaligaVishnu Baliga
367411
367411
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
add a comment |
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
check now it is runinng in server , it is coming as per my requirement lotusvaluedevelopers.com/contactside.html and thanks for your explanation
– kaviya
Nov 17 '18 at 7:58
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%2f53349008%2fmy-mymodal-div-id-is-not-calling-in-settimeout-function-using-jquery%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
1
For ten seconds, you need to apply 10000ms, not 1000ms. Aside from that there's basic validation errors in your HTML.
– connexo
Nov 17 '18 at 7:18
The code work in jsfiddle.net/n0rLck68
– Mohammad
Nov 17 '18 at 7:19
I uploaded in server kindly check in given link lotusvaluedevelopers.com/contactside.html it is not coming
– kaviya
Nov 17 '18 at 7:24
just let me know how to trigger the function after 10seconds using jquery trigger. because the slide toggle is not showing in online, i try with trigger
– kaviya
Nov 17 '18 at 7:34
The code work in snippet. So what is problem?
– Mohammad
Nov 17 '18 at 7:42