php - Unable to fire ajax call in jQuery document ready -


i facing problem ajax call when trying submit form database.

here code:

<?php     include 'dbconnect.php';     include 'session.php'; ?> <form class="form" id="form" action="" method="post">     <table class = "left">         <tr align="justify">             <td></td>         </tr>         <tr>             <td>                 <p align="right">                     <font size = "4">new subject name : <input type = "text" name = "subjectname" id = "subjectname"/>                     </font>                 </p>              </td>          </tr>          <tr>              <td>                  <p align="center">                      <input type = 'image' name = 'submit' src="images/submit.gif" value = 'submit' width='100' height='35'/>                   </p>                </td>          </tr>     </table>  </form>     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>     </script> <script>         $(document).ready( function() {                      // bind submit event of our form         $("form#form").submit(function(event){                  // abort pending request                 if (request) {                     request.abort();                 }                 // setup local variables                 var $form = $(this);                  // let's select , cache fields                 var $inputs = $form.find("input, select, button, textarea");                  // serialize data in form                 var serializeddata = $form.serialize();                  // let's disable inputs duration of ajax request.                 // note: disable elements after form data has been serialized.                 // disabled form elements not serialized.                 $inputs.prop("disabled", true);                  // fire off request /form.php                 request = $.ajax({                     url: "subjectitem.php",                     type: "post",                     data: serializeddata                 });                  // callback handler called on success                 request.done(function (response, textstatus, jqxhr){                     // log message console                     console.log("hooray, worked!");                 });                  // callback handler called on failure                 request.fail(function (jqxhr, textstatus, errorthrown){                     // log error console                     console.error(                         "the following error occurred: "+                         textstatus, errorthrown                     );                 });                  // callback handler called regardless                 // if request failed or succeeded                 request.always(function () {                     // reenable inputs                     $inputs.prop("disabled", false);                 });                  // prevent default posting of form                 event.preventdefault();             });         }); </script> 

i not sure why doest not insert data database after user click submit button. please point error if had done wrong in code. thanks

<script>         // setup global var ajax requests         $.xhrpool = [];          // abort ajax requests         $.xhrpool.abortall = function() {                 $(this).each(function(idx, jqxhr) {                          jqxhr.abort();                 });                 $.xhrpool.length = 0         };          // setup ajax         $.ajaxsetup({                 beforesend: function(jqxhr) {                         $.xhrpool.push(jqxhr);                 },                 complete: function(jqxhr) {                         var index = $.xhrpool.indexof(jqxhr);                         if (index > -1) {                                 $.xhrpool.splice(index, 1);                         }                 }         });          // make request         function sendform(){                 $.xhrpool.abortall();                  // register inputs                 var $inputs = $form.find("input, select, button, textarea");                  // set form data                 var formdata = new formdata($('.form')[0]);                  // set post url                 var formurl = "";                  // disable inputs                 $inputs.prop("disabled", true);                  //make ajax request                 $.ajax({                         url: formurl,                         type: 'post',                         data: formdata,                         mimetype: "multipart/form-data",                         contenttype: false,                         cache: false,                         processdata: false,                         success: function(data, textstatus, jqxhr){                                 // handle success                                 console.log("hooray, worked!");                                  // reenable inputs                                 $inputs.prop("disabled", false);                         },                         error: function(jqxhr, textstatus, errorthrown){                                 // handle error                                 console.error("the following error occurred: "+textstatus, errorthrown);                                  // reenable inputs                                 $inputs.prop("disabled", false);                         }                 });         } </script> 

replace submit button <button type="button" onclick="sendform();">submit form</button></p>

i hope helps, don't forget fill out formurl var


Comments

Popular posts from this blog

php - Admin SDK -- get information about the group -

dns - How To Use Custom Nameserver On Free Cloudflare? -

Python Error - TypeError: input expected at most 1 arguments, got 3 -