javascript - unable to submit form data using ajax? -

i new php , have no idea of javascript, have done js work using tutorials.also tried use existing solutions stackoverflow, no success !

what trying trying update database values using 'submit' button on basis of values called 'select option'.

problem no data getting updated in db after click on submit button (on viewtest.php), have tried add 'update.php' form action.

here's screenshot of viewtest.php

here's code:

viewtest.php

<form method="post" action="">     <table border="1px"><tr> <td> <select required name="tstname" id="test" onchange="fetch_ques()"> <option> select test name</option> <?php $res=mysqli_query($connection,"select * test_detail"); while($row=mysqli_fetch_array($res))     {     ?>     <option value="<?php echo $row["test_name"]; ?>">  <?php echo  $row["test_name"]; echo' - - ['. $row['test_category'].']'; ?> </option>      <?php             }     ?>     </select>     </div>  <td>     <div id="qnos"><select></select></div></td></tr>  <tr><td colspan="2" align="center">  <input type="submit" name="btnsubmit" id="vform" value="update question"> </td></tr> </form> </table> <div id="ques"></div>  <script type="text/javascript"> function fetch_ques()  {  var xmlhttp=new xmlhttprequest();  xmlhttp.open("get","getq.php?  tstnm="+document.getelementbyid("test").value,false); // function id  xmlhttp.send(null);  document.getelementbyid("qnos").innerhtml=xmlhttp.responsetext;  // div id  }   function display_ques()  {  var xmlhttp=new xmlhttprequest();  xmlhttp.open("get","displayq.php? qnos="+document.getelementbyid("quesdd").value,false);  xmlhttp.send(null);  document.getelementbyid("ques").innerhtml=xmlhttp.responsetext;  }     </script>     <script type="text/javascript">    $(document).ready(function()    {    $("#vform").submit(); (function()    // document.getelementbyid("vform").submit();(function()    {    location.href='update.php?  qno='+$("#quesno").val()+'&qn='+$("#ques").val()+'&c1='+$("#a1").val()+'&c2='+$  ("#a2").val()+'&c3'+$("#a3").val()+'&c4='+$("#a4").val()+'&cr='+$("#cr").val();        });        });        </script>      <?php     if(isset($_get['st']) && $_get['st'] !== "")     {     echo"updated";           }     else echo "error: ".mysqli_errno();     ?> 

displayq.php //used fetch data in select menu

 <?php  include '../connect.php';  $quesno=$_get["qnos"];   if($quesno!="")  {  $qry=mysqli_query($connection,"select * quesadd quesid='$quesno'");  echo "<table name='ques'>"; while($ftc=mysqli_fetch_array($qry)) {  ?>   <form method="post" action="">  <table name="ques">  <tr><td align="center" colspan="2"> <!-- // comment <input type="submit" name="submit" id="upq" value="update question">--></td> </tr>  <tr> <td align="center"> <b> question : <input type="text" id="quesno" value="<?php echo $ftc["quesid"];?>" disabled></b></td>   <td> <textarea name="ques" id="ques" cols="100" rows="3" placeholder="please input question here !"> <?php echo $ftc['ques'];?></textarea> </td> </tr>  <tr> <td width="25%" align="center" colspan="2"> <br> <b>choices</b> </td> </tr>  <tr> <td align="center" colspan="2"><b>1.</b> <input type="text" id="a1" name="a1" value="<?php echo $ftc['c1'];?>"> </td> </tr>  <tr> <td align="center" colspan="2"><b>2.</b> <input type="text" id="a2" size="20px" name="a2" value="<?php echo $ftc['c2'];?>"> </td> </tr>  <tr> <td align="center" colspan="2"><b>3.</b> <input type="text" id="a3" size="20px" name="a3" value="<?php echo $ftc['c3'];?>"> </td> </tr>  <tr> <td align="center" colspan="2"><b>4.</b> <input type="text" id="a4" size="20px" name="a4" value="<?php echo $ftc['c4'];?>"> </td> </tr>  <tr> <td align="center" colspan="2"><b><font color="maroon">correct answer</font></b> <input type="text" size="20px" id="cr" name="correct" value="<?php echo $ftc['answer'];?>"> </td> </tr>  </table> </form>  <?php  }  echo "</table>";  }  ?>   </tr> </td>   </table>  </form> 

update.php //used update question getting values 'viewtest.php'

<?php include '../connect.php'; $qn=$_get['qno']; $qname=$get['qn']; $a1=$get['c1']; $a2=$get['c2']; $a3=$get['c3']; $a4=$get['c4']; $acr=$get['cr'];   $update=mysqli_query($connection,"update quesadd set ques='$qname',  c1='$a1',c2='$a2',c3='$a3',c4='$a4',answer='$acr' quesid='$qn' ");  if($update==true)  {      header('location:viewtest.php?st=true');  } ?> 

i can see multiple problems, don't know if problems go away help.

$("#vform").submit(); (function()

the line above says if <form> id="vform" has been submitted, execute function. form not have id never trigger. 1 other problem function not part of trigger. should like

$("#vform").submit(function()

the complete code like:

       <script type="text/javascript">            $(document).ready(function(){                $("#vform").submit(function(e){                    e.preventdefault();                    location.href='update.php?qno='+$("#quesno").val()+'&qn='+$("#ques").val()+'&c1='+$("#a1").val()+'&c2='+$("#a2").val()+'&c3'+$("#a3").val()+'&c4='+$("#a4").val()+'&cr='+$("#cr").val();                    return false;                });            });        </script>