对于每个mysql，使用javascript创建并提交_Javascript_Php_Jquery_Html_Mysql

对于每个mysql，使用javascript创建并提交

javascript php jquery html mysql

对于每个mysql，使用javascript创建并提交,javascript,php,jquery,html,mysql,Javascript,Php,Jquery,Html,Mysql,目前，该表为每个mysql行显示了不同的按钮，但只有第一个mysql行按钮工作正常。当它正常工作时，submit按钮将位置行保存为javascript AJAX帖子的值。当它不能正常工作时，“提交”按钮刷新页面这是html和mysql表单： while($row = mysqli_fetch_array($result)) { echo '<form class="form-signin" action="" method="POST" id="register-form">

目前，该表为每个mysql行显示了不同的按钮，但只有第一个mysql行按钮工作正常。当它正常工作时，submit按钮将位置行保存为javascript AJAX帖子的值。当它不能正常工作时，“提交”按钮刷新页面

这是html和mysql表单：

   while($row = mysqli_fetch_array($result)) {

echo '<form class="form-signin" action="" method="POST" id="register-form"><tr>';
echo "<td><b>" . $row['product'] . "</b><br>";
echo "<td><b>" . $row['location'] . "</b><br>";
echo "" . $row['notes'] . "";
  echo '  
  <input type="hidden" name="user_name" value="'.   $row['product'].'" />
   <input type="hidden" name="location" value="'.   $row['location'].'" />
  <input type="text" class="form-control" placeholder="Table Number" name="user_email" id="user_email" />
  <input type="text" class="form-control" placeholder="Quantity" name="password" id="user_email" />
   <button type="submit" class="btn btn-default" value="Submit form" name="btn-save" id="btn-submit">
                <span class="glyphicon glyphicon-log-in"></span> &nbsp;'. $row['location'] .'
            </button></td>';

echo "</tr></form>";

}

while（$row=mysqli\u fetch\u数组（$result））{
回声'；
回显“$row['product']”。
；
回显“.$row['location']”。
；
回显“$row['notes']”；
回声'
“.$row['location']”
';
回声“；
}

这是“注册表单”的javascript，它发布：

{
    var data = $("#register-form").serialize();

    $.ajax({

        type: 'POST',
        url: 'register.php',
        data: data,
        beforeSend: function() {
            $("#error").fadeOut();
            $("#btn-submit").html('<span class="glyphicon glyphicon-transfer"></span> &nbsp; sending ...');
        },
        success: function(data) {}
    })
}

{
变量数据=$（“#注册表形式”）.serialize（）；
$.ajax({
键入：“POST”，
url:'register.php'，
数据：数据，
beforeSend:function（）{
$（“#错误”）.fadeOut（）；
$（“#btn submit”）.html（'sending…'）；
},
成功：函数（数据）{}
})
}

基本上，如果单击了submit按钮，则需要为单击的相应行保存它，而不是采取不同的操作

$('document').ready(function()
{
    /* validation */
    $("#register-form").validate({
        rules:
        {

        },
        messages:
        {
            user_name: "Enter a Valid Username",
            password:{
                required: "Provide a Password",
                minlength: "Password Needs To Be Minimum of 8 Characters"
            },
            user_email: "Enter a Valid Email",
            cpassword:{
                required: "Retype Your Password",
                equalTo: "Password Mismatch! Retype"
            }
        },
        submitHandler: submitForm
    });
    /* validation */

    /* form submit */
    function submitForm()
    {
        var data = $("#register-form").serialize();

        $.ajax({

            type : 'POST',
            url  : 'register.php',
            data : data,
            beforeSend: function()
            {
                $("#error").fadeOut();
                $("#btn-submit").html('<span class="glyphicon glyphicon-transfer"></span> &nbsp; sending ...');
            },
            success :  function(data)
            {
                if(data==1){

                    $("#error").fadeIn(1000, function(){


                        $("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> &nbsp; Sorry email already taken !</div>');

                        $("#btn-submit").html('<span class="glyphicon glyphicon-log-in"></span> &nbsp; Create Account');

                    });

                }
                else if(data=="registered")
                {

                    $("#btn-submit").html('Ordered');
                   // setTimeout('$(".form-signin").fadeOut(500, function(){ $(".signin-form").load(""); }); ',5000);

                }
                else{

                    $("#error").fadeIn(1000, function(){

                        $("#error").html('<div class="alert alert-danger"><span class="glyphicon glyphicon-info-sign"></span> &nbsp; '+data+' !</div>');

                        $("#btn-submit").html('<span class="glyphicon glyphicon-log-in"></span> &nbsp; Create Account');

                    });

                }
            }
        });
        return false;
    }
    /* form submit */

});

$（'document'）.ready（函数（）
{
/*验证*/
$（“#登记表”）。验证({
规则：
{
},
信息：
{
用户名：“输入有效用户名”，
密码：{
必需：“提供密码”，
minlength:“密码至少需要8个字符”
},
用户_电子邮件：“输入有效电子邮件”，
注册会计师密码：{
必需：“重新输入密码”，
equalTo:“密码不匹配！请重新键入”
}
},
submitForm
});
/*验证*/
/*提交表格*/
函数submitForm（）
{
变量数据=$（“#注册表形式”）.serialize（）；
$.ajax({
键入：“POST”，
url:'register.php'，
数据：数据，
beforeSend:function（）
{
$（“#错误”）.fadeOut（）；
$（“#btn submit”）.html（'sending…'）；
},
成功：功能（数据）
{
如果（数据==1）{
$（“#错误”）.fadeIn（1000，函数（）{
$（“#error”）.html（'抱歉，电子邮件已被占用！'）；
$（“#btn submit”）.html（'Create Account'）；
});
}
否则，如果（数据==“已注册”）
{
$（“#btn submit”）.html（'Ordered'）；
//setTimeout（'$（“.form signin”）.fadeOut（500，function（）{$（“.signin form”）.load（“”；}）；'，5000）；
}
否则{
$（“#错误”）.fadeIn（1000，函数（）{
$（“#错误”）.html（“+data+”！”）；
$（“#btn submit”）.html（'Create Account'）；
});
}
}
});
返回false；
}
/*提交表格*/
});

我敢肯定，这仅仅是因为所有按钮都具有相同的id，我认为这意味着除第一个按钮之外的所有按钮都无效。尝试将行id添加到id=“btn submit”的末尾，看看是否有效

编辑：：

javascript没有做任何事情，因为您可能正在使用以下内容启动单击处理程序：

 $('#submit-btn')...

对吧?？（我在上面复制的内容中看不到javascript的这一部分。）如果是这样的话，那一小段代码所说的就是

查找id为submit btn的元素，然后在单击该元素时运行此代码

您需要的是：

$（'.row submit btn'）..

。这意味着找到一个css类为row submit btn的元素，然后在单击其中一个元素时运行此代码

我之所以说使用CSS类而不是id，是因为id必须是唯一的，或者html是无效的（因此这个问题就在这里！），但是CSS类没有这个限制。这里的主要警告是，您需要确保这个css类对于这个页面上的元素是唯一的（这意味着row submit btn作为css类没有任何其他东西）否则你会得到意想不到的副作用。

我敢肯定，这只是因为你所有的按钮都具有相同的id，我认为这意味着除了第一个按钮之外，其他所有按钮都无效。尝试将行id添加到id=“btn submit”的末尾，看看是否有效