javascript - 使用 ajax 和 jquery 提交表单

Question

我正在尝试使用 jquery 和 ajax 提交一个表单，以在名为 cadreSante 的表中添加一行（表的名称及其字段为法语）我正在使用这些代码来执行此操作。有人可以告诉我哪个代码包含错误以及如何解决它？

$(document).ready(function(){
    $("#submit").click(function(){
        var nom = $("#nom").val();
        var prenom = $("#prenom").val();
        var adresse = $("#adresse").val();
        var ville = $("#ville").val();
        var codePostal = $("#codePostal").val();
        var tel = $("#tel").val();
        var salaire = $("#salaire").val();
        var dateEmbauche = $("#dateEmbauche").val();

        // Returns successful data submission message when the entered information is stored in the database.

        var dataString = "nom=" + nom + "&prenom=" + prenom + "&adresse="+ adresse + "&ville="+ ville + "&codePostal=" + codePostal + "&tel=" + tel + "&salaire=" + salaire + "&dateEmbauche=" + dateEmbauche;

        if(nom =='' && prenom =='' && adresse =='' && ville =='' codePostal == '' &&
            tel =='' && salaire= '' && dateEmbauche =='jj/mm/aaaa')
        {
            alert("Merci de renseigner les champs");
        }
        else
        {
        // AJAX Code To Submit Form.
            $.ajax({
                type: "POST",
                url: "databaseupdateprocessing.php",
                data: dataString,
                cache: false,
                success: function(result){
                    alert(result);
                }
            });
        }
        return false;
    })

我正在尝试使用 ajax 和 jquery 提交一个表单，以便在名为 cadreSante 的表中插入一行，它具有以下字段（nom、prenom、adresse、ville、codePostal、tel、salaire、dateEmbauche）我将表单发送到一个名为databaseupdateprocessing.php 这是该文件中用于插入行的代码部分

if($_POST['action'] =='ajoutCadreSante'){

$columns = "insert into cadresante(";
$values = " values(";
if($_POST['nom'] != ""){
    $columns .= "nom";
    $values .= $_POST['nom'];
}

if($_POST['prenom'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "prenom";
        $values .= $_POST['prenom']
    }
    else{
        $columns .= ",prenom";
        $values .= "," . $_POST['prenom'];
    }
}

if($_POST['salaire'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "salaire";
        $values .= $_POST['salaire']
    }
    else{
        $columns .= ",salaire";
        $values .= "," . $_POST['salaire'];
    }
}

if($_POST['tel'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "tel";
        $values .= $_POST['tel']
    }
    else{
        $columns .= ",tel";
        $values .= "," . $_POST['tel'];
    }
}

if($_POST['adresse'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "adresse";
        $values .= $_POST['adresse']
    }
    else{
        $columns .= ",adresse";
        $values .= "," . $_POST['adresse'];
    }
}

if($_POST['codePostal'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "codepostale";
        $values .= $_POST['codePostal'];
    }
    else{
        $columns .= ",codepostale";
        $values .= "," . $_POST['codePostal'];
    }
}

if($_POST['ville'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "ville";
        $values .= $_POST['ville'];
    }
    else{
        $columns .= ",ville";
        $values .= "," . $_POST['ville'];
    }
}

if($_POST['dateEmbauche'] != ""){
    if($columns == "insert into cadresante("){
        $columns .= "dateEmbauche";
        $values .= $_POST['dateEmbauche'];
    }
    else{
        $columns .= ",dateEmbauche";
        $values .= "," . $_POST['dateEmbauche'];
    }
}

$columns .= ") ";
$values .= ")";
$addquery = $columns . $values;
mysqli_query($db,$addquery);

}

这是表单的 HTML 代码

<form class="form-horizontal">
        <input type="hidden" name="action" value="ajoutCadreSante">
        <div class="col-sm-6">
            <div class="form-group">
                <label class="control-label col-sm-2" for="nom">Nom :</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="nom" name="nom">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-2" for="prenom">Prénom :</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="prenom" name="prenom">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-2" for="adresse">Adresse :</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="adresse" name="adresse">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-2" for="ville">Ville :</label>
                <div class="col-sm-10">
                    <input type="tel" class="form-control" id="ville" name="ville">
                </div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="form-group">
                <label class="control-label col-sm-4" for="codePostal">Code postal :</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="codePostal" name="codePostal">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-4" for="tel">Tél :</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="tel" name="tel">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-4" for="salaire">Salaire :</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="salaire" name="salaire">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-4" for="dateEmbauche">Date d'embauche :</label>
                <div class="col-sm-8">
                    <input type="date" class="form-control" id="dateEmbauche" name="dateEmbauche">
                </div>
                <div class="col-sm-12">
                    <button type="submit" id="submit" class="btn btn-default pull-right enregistrer">Enregistrer</button>
                </div>
            </div>
        </div>          
    </form>

标签： javascriptphpjqueryajax

Answer 1

您需要以 JSON 格式发送数据。在 AJAX 中，将数据字符串从字符串更改为 JSON 对象。

var dataString = "nom=" + nom + "&prenom=" + prenom + "&adresse="+ adresse + "&ville="+ ville + "&codePostal=" + codePostal + "&tel=" + tel + "&salaire=" + salaire + "&dateEmbauche=" + dateEmbauche;

至

var dataString = {
 nom: nom,
 prenom: prenom,
 adresse: adresse,
 ...
};