Обновление кода не работает для jquery Ajax в PHP?

Question

У меня есть 4 отдельные таблицы - Stud, Country_master_academic, master_state, master_city.Я пытаюсь обновить, но он открывает модальные и показывает все извлеченные значения, а затем, когда я изменяю значение и нажимаю на обновление, модальное окно закрывается, и данные не будут обновляться.Можете ли вы сказать, что я делаю не так?Заранее спасибо.Моя кнопка обновления выглядит следующим образом:

<button type="submit" name="update" class="btn btn-info">Update</button>

Для извлечения значений -> jquery

$(document).ready(function(){
             $(document).on('click', '.edit_data', function(event){
               var stud_no = $(this).attr("id");
               $.ajax({  
                    url:"update.php",  
                    method:"POST",  
                    data:{stud_no:stud_no},  
                    dataType:"json",  
                    success:function(data){  
                    console.log(data);
                    $('#update_data_modal').modal("show");
                    $('#upname').val(data[1]);
                    $('#upmob_no').val(data[2]);
                    $('#updob').val(data[3]);
                    $('#upadd').val(data[4]);
                    $("#resultedPhoto").attr("src","images/" + data[5]);
                    if(data[6] == 'M')
                    {
                        $("#genderMale").prop("checked", true);
                    } else if(data[6] == 'F') {
                        $("#genderFemale").prop("checked", true);
                    }
                    $('#upcountry').val(data[7]);
                    $('#upstate').val(data[8]);
                    $('#upcity').val(data[9]);
                    },  
                    });     
                });  
    });

И страница update.php

<?php
include("connection.php");
    $no=$_POST['stud_no'];
    $name=trim($_POST['name']);
    $mob=trim($_POST['mob_no']);
    $dob=trim($_POST['dob']);
    $add=trim($_POST['add']);
    $photo=trim($_FILES['photo']['name']);
    $gen=trim($_POST['gender']);
    $cn=trim($_POST['country']);
    $st=trim($_POST['state']);
    $ct=trim($_POST['city']);

if(isset($_POST['stud_no'])){
$id= $_POST["stud_no"];
$qry="select * from stud s, country_master_academic c,master_state st, master_city ct where s.country=c.country_code and s.state=st.state_code and s.city=ct.city_code and stud_no='".$id."'";
$res = mysqli_query($conn,$qry);
$row=mysqli_fetch_array($res);
echo json_encode($row);
}
else
{
    $qry="update stud set stud_name='$name',mobile='$mob',dob='$dob',address='$add',gender='$gen',country='$cn',state='$st',city='$ct' where stud_no='$no'";
    $data=mysqli_query($conn,$qry);
    if($data)
    {
        echo '<script language="javascript">';
        echo 'alert("Updated Successfully")';
        echo '</script>';
    }
    else {
        echo '<script language="javascript">';
        echo 'alert("Cannot update record")';
        echo '</script>';
    }
    if(!empty($_FILES['photo']['name'])){
    $qry1= "update stud set photo='$photo' where stud_no='$no'";
    $data1=mysqli_query($conn,$qry1);

    if($data1){
        $target_dir="images/";
            $target_file=$target_dir.basename($_FILES["photo"]["name"]);
            $imageFileType=pathinfo($target_file,PATHINFO_EXTENSION);
            if(move_uploaded_file($_FILES["photo"]["tmp_name"],$target_file)){
                echo '<script language="javascript">';
                echo 'alert("Image upload successfully")';
                echo '</script>';

            }  else {
                echo '<script language="javascript">';
                echo 'alert("Cannot Upload")';
                echo '</script>';
            }
    }
}
}

?>

Answer 1

html:

<form id="FormSubmit" method="post">

jquery:

$(document).ready(function(){
     $( "#FormSubmit" ).submit(function( event ) {
        event.preventDefault();
        $.ajax ({
            url: "update.php",
            type: "POST",
            data:  new FormData(this),
            contentType: false,
            cache: false,
            processData:false,
            success: function(response) {
        console.log(response);  
                        }
                    });
                });
                });