javascript - ajax returned form is not prevented using event.preventdefault() -



javascript - ajax returned form is not prevented using event.preventdefault() -

i have 2 files testjquery.php , abcd.php on form submit calling ajax phone call , submitting ajax method. first times prevents forms defaultevent using event.preventdefault , loads response info other page div . when 1 time again seek submit it, event.preventdefault doesnt work on form. please help. in advance.

// testjquery.php

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>untitled document</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> </head> <body> <div id="abc"> <form action="abcd.php" method="post" accept-charset="utf-8" name="cartform"> <table cellpadding="6" cellspacing="1" style="width:100%" border="0"> <tr> <th>qty</th> <th>item description</th> <th style="text-align:right">item price</th> <th style="text-align:right">sub-total</th> </tr> <input type="hidden" name="cartrowid[1]" value="d68b70f3503216b22484eef9c786124a" /> <tr> <td><input type="text" name="cartrowqty[1]" value="1" maxlength="3" size="5" /></td> <td> micromax_a12112 <p> <strong>size:</strong> l<br /> <strong>color:</strong> red<br /> </p></td> <td style="text-align:right">123.00</td> <td style="text-align:right">$123.00</td> </tr> <input type="hidden" name="cartrowid[2]" value="e376db925db6430cf3e82c3854b4f5e2" /> <tr> <td><input type="text" name="cartrowqty[2]" value="1" maxlength="3" size="5" /></td> <td> indian_saree <p> <strong>size:</strong> l<br /> <strong>color:</strong> red<br /> </p></td> <td style="text-align:right">2,555.00</td> <td style="text-align:right">$2,555.00</td> </tr> </table> <p> <input type="submit" name="add_item_via_ajax_form" value="update cart" class="add_item_via_ajax_form" /> </p> </form> <a href="http://w3schools.com/">go w3schools.com</a> <p>the preventdefault() method prevent link above next url.</p> </div> </body> </html> <script> $(function() { // illustration of adding item cart via link. $('.add_item_via_ajax_form').click(function(event) { alert(1); event.preventdefault(); // parent form. var parent_form = $(this).closest('form'); // url ajax form info submitted to. var submit_url = parent_form.attr('action'); // form data. var $form_inputs = parent_form.find(':input'); var form_data = {}; $form_inputs.each(function() { form_data[this.name] = $(this).val(); }); $.ajax( { url: submit_url, type: 'post', data: form_data, success:function(data) { //alert(data); event.preventdefault(); ajax_update_mini_cart(data); } }); }); // function display updated ajax cart info mini cart menu. function ajax_update_mini_cart(data) { $('#abc').html(data); $('#mini_cart_status').show(); // set new height of menu animation purposes. var min_cart_height = $('#mini_cart ul:first').height(); $('#mini_cart').attr('data-menu-height', min_cart_height); $('#mini_cart').attr('class', 'js_nav_dropmenu'); // scroll top of page. $('body').animate({'scrolltop':0}, 250, function() { // notify user cart has been updated showing mini cart. $('#mini_cart ul:first').stop().animate({'height':min_cart_height}, 400).delay(3000).animate({'height':'0'}, 400, function() { $('#mini_cart_status').hide(); }); }); } }); </script> <script> $(document).ready(function(){ $("a").click(function(event){ event.preventdefault(); }); }); </script> //abcd.php <form action="abcd.php" method="post" accept-charset="utf-8" name="cartform"> <table cellpadding="6" cellspacing="1" style="width:100%" border="0"> <tr> <th>qty</th> <th>item description</th> <th style="text-align:right">item price</th> <th style="text-align:right">sub-total</th> </tr> <input type="hidden" name="cartrowid[1]" value="d68b70f3503216b22484eef9c786124a" /> <tr> <td><input type="text" name="cartrowqty[1]" value="1" maxlength="3" size="5" /></td> <td> micromax_a12112 <p> <strong>size:</strong> l<br /> <strong>color:</strong> red<br /> </p></td> <td style="text-align:right">123.00</td> <td style="text-align:right">$123.00</td> </tr> <input type="hidden" name="cartrowid[2]" value="e376db925db6430cf3e82c3854b4f5e2" /> <tr> <td><input type="text" name="cartrowqty[2]" value="1" maxlength="3" size="5" /></td> <td> indian_saree <p> <strong>size:</strong> l<br /> <strong>color:</strong> red<br /> </p></td> <td style="text-align:right">2,555.00</td> <td style="text-align:right">$2,555.00</td> </tr> </table> <p> <input type="submit" name="add_item_via_ajax_form" value="update cart" class="add_item_via_ajax_form" /> </p> </form> <a href="http://w3schools.com/">go w3schools.com</a> <p>the preventdefault() method prevent link above next url.</p>

you should delegate event, e.g:

$('#abc').on('click', '.add_item_via_ajax_form', function(event){ //... });

see @my question's comment regarding form submit instead

javascript php jquery ajax forms

Comments

Post a Comment

Popular posts from this blog

Delphi change the assembly code of a running process -

Delphi change the assembly code of a running process - i'm trying alter address 00741fa5 has push test.009e721c . alter push test.009e71c8 . procedure callback; asm force $9e71c8 end; procedure tform2.btn1click(sender: tobject); var ppid :dword; pprocess : cardinal; begin getwindowthreadprocessid(findwindow(nil,pchar('test')), @ppid); pprocess := openprocess(process_all_access, false, ppid); injectasm(pprocess, $741fa5, 10, integer(@callback), 0); end; here injectasm function (with error checking) function injectasm(process: longword; injectaddress, injectsize, codeaddress, codesize : integer): pointer; var csize, rsize : integer; replaced : array of byte; jmp : array [0..4] of byte; jmpaddress : integer; nopv : byte; : integer; nbr: ulong_ptr; begin //injectsize must equal or greater 5, because need space our //(far) jmp wwxxyyzz instruction //if there's no space, inject in place of few instructions if injectsize ...
Read more

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) - hello have problem hibernate , jackson. have 2 pojos @entity @table(name = "users") public class user implements serializable { static final long serialversionuid = 4235637833262722256l; @id @generatedvalue private int id; @column(name = "creation_date") private date creationdate; @column(name = "first_name") private string firstname; @column(name = "last_name") private string lastname; @version @column(name = "version") private int version; @column(name = "e_mail") private string email; @column(name = "enabled") private boolean enabled; @column(name = "login") private string login; @column(name = "password") private string password; @jsonmanagedreference("role") @onetomany(mappedby = "user", cascade = cascadetype.all,fetch = fetchtyp...
Read more

C++ 11 "class" keyword -

C++ 11 "class" keyword - i've started using c++ 11 little bit more , have few questions on special uses of class keyword. know it's used declare class, there's 2 instances have seen don't understand: method<class t>(); and class class_name *var; why precede typename keyword class in first example, , keyword pointer in sec example? that known elaborated type specifier , necessary when class name "shadowed" or "hidden" , need explicit. class t { }; // love of god don't t t; t t2; if compiler smart, give these warnings: main.cpp:15:5: error: must utilize 'class' tag refer type 't' in scope t t2; ^ class main.cpp:14:7: note: class 't' hidden non-type declaration of 't' here t t; ^ if class not defined, deed forwards declaration. for example: template <typename t> void method() { using type = typename t::value_type; } method...
Read more