Using the following function to capture two dynamically generated form submissions, but is not preventing their submission.
$('body').delegate('.edit_faq, .new_faq', 'submit', function(e){
e.preventDefault();
//voodoo
});
I was using the following, using live. This works, but live is depreciated and the end result is for this code to end up in a flexible plugin.
$('.edit_faq').add('.new_faq').live('submit', function(e){
e.preventDefault();
//magic
});
What you have written is actually working.
check:
http://jsfiddle.net/peuqU/
press run as jsfiddle sometimes needs a refresh before testing submits.
I have only been able to test it with chrome 23.
Try on which is the recommended way, and return false:
$('body').on('submit', '.edit_faq, .new_faq', function(e){
e.preventDefault();
//Do your stuff here.
});
As to why the submission still occurs, maybe you have a JS error somewhere in the page?
FIXED--
The problem was that the code required being wrapped on a document onReady:
$(document).ready(function(){
$('body').on('submit', '.edit_faq, .new_faq', function(e){
e.preventDefault();
//voodoo
});
})
I occurs to me that since live did not require the ready, that maybe this is still wrong?
Related
im trying to get a lil project going but im stuck on a very annoying thing.
$(document).ready(function() {
$("#search-button").click(console.log('hello'))
});
as you can see im targeting a search button with the id search-button and as soon as i click it something should happen. in this case i put a console.log in to test if it works but it doesn't. it always logs it as soon as i load the page , not when i click the button i target. ... what am i doing wrong
if you need more info on this pls tell me i tried to keep it as simple as i could
ty for your help
O.k
The click handler needs a function argument, not just the console.log by itself. Try this:
$(document).ready(function() {
$("#search-button").click(function() {
console.log('hello');
});
});
Inside of .click should be a handler .click(handler) and the handler should be a function. The browser is reading the code and when it hits console.log('hello'), it does it! It's seeing .click etc, but it doesn't matter; it next sees console.log and does it.
Try
$(document).ready(function() {
$("#search-button").click(function() {
console.log('hello');
});
});
As others have mentioned, the click function requires its own callback function. You can also use this, without requiring the use of document:
$("#search-button").on('click', function() {
console.log('hello')
})
I hope You're using jQuery version 3 or up. if you use 3 or up jquery version the good practice is you use Document binding Example:
jQuery(document).on('click', '#search-button', function(event) {
//your Code here...
console.log('hello');
});
Hello Friends this is my code to form submit and then send post link but form submit success then after not send post link.
document.getElementById("pitch_image_path_form").submit(function(e){
$.post("submit_investorform.php",{'flage':'getallimagesfromselectedid','form':'pitch_image_path_form'},function(result){
$("#pitch_image_path_showalldatafromid").html(result);
});
e.preventDefault();
});
this is my code form is submit but post request is not send.
dear renishkhunt please try this code. this is help fully for me.
$("#pitch_image_path_form").ajaxSubmit({ success: function(){
$.post("submit_investorform.php",{'flage':'getallimagesfromselectedid','form':'pitch_image_path_form'},function(result){
$("#pitch_image_path_showalldatafromid").html(result);
});
} });
please check this link this is tutorial.
http://malsup.com/jquery/form/
.submit() is a jQuery function, so you need to wrap your $("#pitch_image_path_form")[0] in a jQuery wrapper, like so:
$($("#pitch_image_path_form")[0]).submit(function(){
There is no submit() event in DOM, you are mixing DOM and jQuery
change
document.getElementById("pitch_image_path_form").submit
to
$("#pitch_image_path_form").submit
$("pitch_image_path_form").submit(function(e){
e.preventDefault();
$.post(
"submit_investorform.php",
{'flage':'getallimagesfromselectedid','form':'pitch_image_path_form'}
, function(result) { $("#pitch_image_path_showalldatafromid").html(result); }
);
});
Because DOM does not support submit(), there is do submit() function in DOM. Same exact answer when you asked this the last time.
When you call .submit(), it posts the form with the specified action of the <form>.
You might want to stop the propagation, by using either event.stopPropagation();, event.preventDefault(); or return false; at the end of your function.
$("#pitch_image_path_form").submit(function(event){
event.stopPropagation();
event.preventDefault();
//Your .post()
return false;
});
Plus, as epascarello pointed out, .submit() is a jQuery function.
If you want to use it, use it on the jQuery object by removing [0] before submit(), as you're not supposed to have multiple elements with the same ID.
i have some scripts on my site that send replies to a server and reload the page using ajax. sometimes though, it reloads the page for no reason.
so I added this code
<script type="text/javascript">
$("form").submit(function(){
event.preventDefault();
return false;
)
</script>
but it is still reloading the page when i hit sumbit.
why.
You simply forgot to bring in the event argument into the handler:
$("form").submit(function( event ) {
Also: check the error console, in your example code you are missing an ending bracket });
As a side note: make sure you are selecting the form element after it has been loaded, to be safe use domReady:
$(function() {
$("form").submit(function(event){
event.preventDefault();
});
});
event as a global (window.event) is non-standard. jQuery normalizes this for you, so just pass in event as an argument:
$(document).ready(function() { // Make sure you wait until the document is ready
$("form").submit(function(event) {
event.preventDefault();
});
});
Also, returning false calls event.preventDefault() as well as event.stopPropagation(). You only want the first to happen, so be explicit.
$("form").submit(function(event){})
In a comment on another answer, you've said:
it still reloads the page
That suggests that you have this code above the form you want it to act on in the HTML. Move the script below the form (usually just before the closing </body> tag is best), or use jQuery's ready event.
Also note that if you're using return false, you don't need event.preventDefault, because return false from a jQuery event handler does event.preventDefault() and event.stopPropagation(), so:
<form ...>
<!-- ... -->
</form>
<!-- ... -->
<script>
$("form").submit(function(){
return false;
});
</script>
</body>
Or alternately, this anywhere on the page, using the shortcut for ready:
$(function() {
$("form").submit(function(){
return false;
});
});
This is a button to close the click but it fail and not work. I would like to know what is the tab ID since i did not think i assign one when i create a tab.
Thank you.
This is my attempt
js
$("#closeTab").click(function() {
window.parent.$('#tt').tabs('close','Create List');
});
html
<input type="button" id="closeTab" value="Cancel" class="submit"/>
I found my js code is working but the button can not trigger it? Why? thank you
latest try:
<script>
$(document).ready(function(){
$("#addlist").validate();
});
$(function(){
$("#closeTab").click(function() {
window.parent.$('#tt').tabs('close','Create List');
});
});
</script>
It still doesn't work so i think it is because the upper function ? How to fix this?
================================================================================
Also, are there any ways to clear my session in using this jquery function (what should i add for instance)?**Thanks
With javascript, you have to delay the execution of certain functions (like event handlers) until the page loads fully. Otherwise, it is attempting to bind a function to an element that doesn't yet exist. With jQuery, you can pass a function to jQuery to be executed on page load very easily like this:
$(function(){ /* code goes here */ });
So to use this with your code, you would do this:
$(function(){
$("#closeTab").click(function() {
window.parent.$('#tt').tabs('close','Create List');
});
});
This way, when the jQuery attempts to bind the function to #closeTab, it happens after the page has loaded (and after #closeTab exists).
Do you have any errors in the console?
Do you include jQuery before that click binding?
Try changing the window.parent.... to alert('clicked!'); and make sure you're actually getting there.
Also, make sure the click binding is inside of a:
$(document).ready(function(){
// here
});
A script can close only the windows it creates. It cannot close the tab which it didn't create.
To rephrase, cannot close tab only if unless but when created tab by script which is same that close window.
I hope this makes sense.
Maybe the form is submitted and the browser navigates to another URL before the code could run? Try replacing function() with function(e) and adding e.preventDefault(); to the beginning of the event handler.
i am having a problem when i click on an input(button) (click event captured using jquery) it is executed two times but the click event is single... i used "e.stopPropagation();" - but it didn't work...
jQuery("#ok").click(function(e){
alert("Alert");
e.stopPropagation();
});
i need the reason and the solution...
take care..
problem is solved...
i just added e.stopImmediatePropagation(); to the click function... and it worked... None of the following functions worked...
e.preventDefault();
e.stopPropagation();
return false
---------------------CODE---------------------
jQuery("#ok").click(function(e){
alert("Alert");
e.stopImmediatePropagation();
});
Click here for more information on jQuery Events..
Please use e.stop(true,true) and function which you are using. like
e.stop(true,true).show();
I think you use this code as below:
jQuery("#ok").click(function(){
alert("Alert");
return false;
});
e.preventDefault() is likely what you are looking for.
i used
return false;
after the desired action.