Question

这里我试图使用ajax概念验证并将注册详细信息插入到数据库中。我试过下面的编码。下面的编码成功将详细信息插入到数据库中，然后它也显示错误消息。

我的问题是 - ＆gt;例如，假设用户未输入姓氏和电子邮件字段。用户只输入名字然后点击提交按钮。现在，我收到错误消息（需要姓氏）。再次用户填写剩余字段并点击提交按钮。当我检查数据库表时，我得到两行（它应该是一行）。问题是它可以多次存储数据（取决于按下提交按钮的次数 - 如果用户获得验证错误消息5次存储5次相同的行，如果用户获得验证错误消息3次存储在3中的同一行时间）

如何避免多次存储一行？

ajax.js

jQuery(document).ready(function() {
    jQuery("#simple-post").click(function() {
        jQuery("#ajaxform").submit(function(e) {
            jQuery("#simple-msg").html("<img src='loading.gif'/>");
            var postData = $(this).serializeArray();
            var formURL = $(this).attr("action");
            $.ajax( {
                url : 'validation.php',
                type: "POST",
                data :  $('form').serialize(),
                success:function(data, textStatus, jqXHR) {
                    jQuery("#simple-msg").html('<pre><code class="prettyprint">'+data+'</code></pre>');
                },
                error: function(jqXHR, textStatus, errorThrown) 
                {
                    $("#simple-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus='+textStatus+', errorThrown='+errorThrown+'</code></pre>');
                }
            });
            e.preventDefault();  //STOP default action
        });

        $("#ajaxform").submit(); //SUBMIT FORM
    });

});

mainpage.php

<form name="ajaxform" id="ajaxform" >
  First Name: <input type="text" name="fname" /> <br/>
  Last Name: <input type="text" name="lname" /> <br/>
  Email : <input type="text" name="email" /> <br/>
  <input type="button"  id="simple-post" value="submit" name="submit"/>
</form>

validation.php

<?php

    include_once('config.php');

    $name = trim($_POST["fname"]);
    $mobile = trim($_POST["lname"]);
    $email = trim($_POST["email"]);

    if($name == "")
    {
        echo 'First Name required';
        die();
    }
    if($mobile == "")
    {
        echo 'Last Name Required';
        die();
    }
    if($email == "")
    {
        echo 'Email required';
        die();
    }

    try
    {
        $stmt = $conn->prepare("INSERT INTO sample ( Name, Mobile, Email ) VALUES ( ?, ?, ? )");
        $conn->errorInfo();
        $stmt->bindParam('1', $name, PDO::PARAM_STR);
        $stmt->bindParam('2', $mobile, PDO::PARAM_STR);
        $stmt->bindParam('3', $email, PDO::PARAM_STR);
        $stmt->execute();
        echo 'inserted succesfully';
    }
    catch(PDOException $e)
    {
        echo 'failed to insert ' .$e->getMEssage();
    }

?>

Answer 1

简单：

jQuery(document).ready(function() {
    jQuery("#simple-post").click(function() {

            jQuery("#simple-msg").html("<img src='loading.gif'/>");
            var postData = $(this).serializeArray();
            var formURL = $(this).attr("action");
            $.ajax( {
                url : 'validation.php',
                type: "POST",
                data :  $('form').serialize(),
                success:function(data, textStatus, jqXHR) {
                    jQuery("#simple-msg").html('<pre><code class="prettyprint">'+data+'</code></pre>');

                },
                error: function(jqXHR, textStatus, errorThrown) 
                {
                    $("#simple-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus='+textStatus+', errorThrown='+errorThrown+'</code></pre>');
                }
            });
            e.preventDefault();  //STOP default action
        });

});

在验证AJAX调用的成功处理程序中提交表单，而不是无条件的外部。

此外，您根本不需要提交处理程序。一旦用户单击该按钮，验证表单并成功，数据将已存在于数据库中。

Answer 2

每次单击“提交”按钮，都会将另一个submit处理程序绑定到表单。因此，当提交表单时，所有这些处理程序都会运行，并且它们每个都在数据库中创建另一行。您应该只在click处理程序之外绑定提交处理程序一次。

jQuery(document).ready(function() {
    jQuery("#simple-post").click(function() {
        $("#ajaxform").submit(); //SUBMIT FORM
    });
    jQuery("#ajaxform").submit(function(e) {
        jQuery("#simple-msg").html("<img src='loading.gif'/>");
        var postData = $(this).serializeArray();
        var formURL = $(this).attr("action");
        $.ajax( {
            url : 'validation.php',
            type: "POST",
            data :  $('form').serialize(),
            success:function(data, textStatus, jqXHR) {
                jQuery("#simple-msg").html('<pre><code class="prettyprint">'+data+'</code></pre>');
            },
            error: function(jqXHR, textStatus, errorThrown) 
            {
                $("#simple-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus='+textStatus+', errorThrown='+errorThrown+'</code></pre>');
            }
        });
        e.preventDefault();  //STOP default action
    });
});

在提交按钮上也不需要点击处理程序 - 点击提交按钮的默认行为是触发表单的submit事件。

避免每行存储多次进入mysql数据库

ajax.js

mainpage.php

validation.php

2 个答案: