添加到数据库后，保持在同一页中而不刷新

我有一个PHP网页，需要在其中向数据库中插入一些信息。插入完成后，会刷新同一页。但有人告诉我，这个过程并不实用，因为您每次都要加载页面的所有HTML、CSS和JS。我应该你AJAX来做那件事。

我搜索它，并尝试了这个代码：

$("#insert").click(function(){
 //get the form values
 var selectType = $('#selectW').val();
 var selectcom = $('#select_at').val();
 var pay = $('#pay').val();     
 var facture = $('#facture').val();     
 var selectcur = $('#select').val(); 
 //make the postdata
 //var postData = 'username='+username+'&name='+name+'&brand='+brand;
 //call your input.php script in the background, when it returns it will call the success function if the request was successful or the error one if there was an issue (like a 404, 500 or any other error status)
     $.ajax({
        url : "insert.php",
        type: "POST",
        data : postData,
        success: function(data,status, xhr)
        {
            //if success then just output the text to the status div then clear the form inputs to prepare for new data
            $("#section2").html(data);
            $('#pay').val('');
            $('#selectcur').val('');
        },
        error: function (jqXHR, status, errorThrown)
        {
            //if fail show error and server status
            $("#section2").html('there was an error ' + errorThrown + ' with status ' + textStatus);
        }
    });// JavaScript Document

这是我的PHP-PDO代码，我删除了header行，并用echo("something"):替换了它们

if(isset($_POST['insert'])){
    $selectOpt1 = $_POST['currency'];
    if($selectOpt1=="9"){
        $type = $_POST['type'];
        $provider = $_POST['alfa_touch'];
        $pay = $_POST['pay'];
        $facture = $_POST['facture'];
        try{
            $query = "INSERT INTO sales
            (type, provider, pay, facture, date_now, time_now) 
            VALUES
            (:type, :provider, :pay, :facture, :date, now())";
            $stmt = $conn->prepare($query);
            $stmt->bindValue(":type", $type);
            $stmt->bindValue(":provider", $provider);
            $stmt->bindValue(":pay", $pay);  
            $stmt->bindValue(":facture", $facture);
            $stmt->bindValue(":date", date("y-m-d"));
            $count = $stmt->execute();
            //header("location: home.php");
            echo ("Done");
        }
        catch(PDOException $e) {
            echo $e->getMessage();
            //header("location: ../pages/insert_false.php?id=".$projid);
            print_r($conn->errorInfo());
        }

    }
}

现在，当我点击insert按钮时，数据会被正确地添加到MySQL数据库中，但应用程序会停留在insert.php和echo Done中。我需要的是保持一致。感谢您的帮助。

编辑

$("#insert").click(function(){
 //get the form values
 var selectType = $('#selectW').val();
 var selectcom = $('#select_at').val();
 var pay = $('#pay').val();     
 var facture = $('#facture').val();     
 var selectcur = $('#select').val(); 
 //make the postdata
 var postData = 'username='+username+'&name='+name+'&brand='+brand;
 //call your input.php script in the background, when it returns it will call the success function if the request was successful or the error one if there was an issue (like a 404, 500 or any other error status)
 $.ajax({
    url : "insert.php",
    type: "POST",
    data : postData,
    success: function(data,status, xhr)
    {
        //if success then just output the text to the status div then clear the form inputs to prepare for new data
        $("#section2").html(data);
        $('#pay').val('');
        $('#selectcur').val('');
    },
    error: function (jqXHR, status, errorThrown)
    {
        //if fail show error and server status
        $("#section2").html('there was an error ' + errorThrown + ' with status ' + textStatus);
    }
});
return false;
});// JavaScript Document

还是同样的问题。这是我的HTML表单：

<form name="insertForm" action="insert.php" method="post">
    <tr>
        <td align="center">
          <select id="selectW" name="type">
            <option value="Choose">Choose</option>
            <option value="Dollars">Dollars</option>
            <option value="D & D">D & D</option>
            <option value="Cards">Cards</option>
            <option value="Phones">Phones</option>
            <option value="Acc">Acc</option>
            <option value="Bills">Bills</option>
          </select>
          <!--<select>
          <?php foreach($result5 as $rows){ ?>
            <option value="<?php echo $rows['item_name'] ?>"><?php echo $rows['item_name'] ?></option>
            <?php } ?>
          </select>-->
          </td>
        <td align="center"><select id="select_at" name="alfa_touch">
            <option value="Undefined">Not Required</option>
            <option value="Alfa">Alfa</option>
            <option value="Touch">Touch</option></select></td>
        <td align="center"><input type="text" id="pay" name="pay"/></td>
        <td align="center"><input type="text" id="facture" name="facture" placeholder="في حال دفع الفواتير عبر omt"/></td>
        <td align="center"><select id="select" name="currency">
            <option value="9">LBP</option>
            <option value="10">Dollars</option>
            </select></td>
        <td align="center"><input type="submit" id="insert" name="insert" value="insert" />
      </td>
      </tr>
      </form>