Question

我正在尝试将我的表单提交到数据库中。当我点击提交按钮时，它没有插入任何记录并被禁用。当我看到我的控制台时，我发现了这个

代码行

<button type="submit" value="submit" class="btn btn-primary" name="submit">Submit</button>

更改为

<button type="submit" value="submit" class="btn btn-primary disabled" disabled="disabled" name="submit">Submit</button>

我该如何解决这个问题？

我很乐意将答案标记为+1。 Thanx提前

完整代码：

<?php
include 'includes/db_connection.php';
if (isset($_POST['submit'])) {
$firstname = $_POST['firstname'];
$sql1 = "INSERT INTO student (firstname) VALUES ('$firstname')";

$res1 = mysqli_query($conn, $sql1);
if ($res1) {
echo 'succ';
//    header("Location: successful_message.php");
} else {
echo 'fail';
//    header("Location: valid_test.php");
}
} else {
?>
<!DOCTYPE html>
<html lang="en">

<head>

<link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<!--
<link  type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
-->
<link rel="stylesheet" href="http://formvalidation.io/vendor/formvalidation/css/formValidation.min.css">
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="http://formvalidation.io/vendor/formvalidation/js/formValidation.min.js"></script>
<script src="http://formvalidation.io/vendor/formvalidation/js/framework/bootstrap.min.js"></script>

<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/ecmascript"></script>

  <title>Form</title>
</head>
<body>
  <form id="contactForm" method="post" class="form-horizontal">

    <div class="form-group">
      <label class="col-xs-3 control-label">Full name</label>
      <div class="col-xs-4">
        <input type="text" class="form-control" name="firstname" placeholder="First name" />
      </div>
    </div>


    <div class="form-group">
      <div class="col-xs-9 col-xs-offset-3">
          <button type="submit" value="submit" class="btn btn-primary" name="submit">Submit</button>
      </div>
    </div>
  </form>
<?php } ?>

<script>
  $(document).ready(function () {



    $('#contactForm')
            .formValidation({
              framework: 'bootstrap',
              icon: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
              },
              fields: {
                firstname: {
                  validators: {
                    notEmpty: {
                      message: 'The first name is required'
                    },
                    regexp: {
                      message: 'Name only contains Letter',
                      regexp: /^[A-Z a-z]*$/
                    }
                  }
                },


              }

            });


  });
</script>
</body>
</html>

Answer 1

嗯，有两件事在这里看起来不正确。一，您的表单的HTML似乎与JQuery的validate不兼容，我认为您需要使用.validate而不是.formValidation，我不是甚至确定是否存在......

我建议将您的HTML格式化为：

<form id="contactForm" method="post" class="form-horizontal">
    <fieldset>
        <p>
            <label class="col-xs-3 control-label">Full name</label>
            <input type="text" class="form-control" name="firstname" placeholder="First name" />
        </p>
        <p>
            <input class="submit" type="submit" value="Submit">
        </p>
    </fieldset>
</form>

现在，您的JS可以像以下一样简单：

$("#contactForm").validate();

..并且工作，但您可以通过以下方式轻松添加额外的验证：

$("#contactForm").validate({
    submitHandler: function(form) {
        /*
            Add validation here
        */
        form.submit();
    }
});

可以使用许多不同的验证设置，但我只是通过Google搜索来找到它，我以前也不知道这些。我的建议：在来到这里寻找答案之前，先对这些JQuery函数进行一些研究。 Here是你可以开始的地方。

Answer 2

这是您的特定表单验证库的问题。 According to the FormValidation.io FAQ他们不允许命名提交按钮“提交”。您应该只能更改提交按钮的名称属性。

<button type="submit" value="submit" class="btn btn-primary" name="notNamedSubmit">Submit</button>

您还必须更新PHP以查看按钮的新名称，而不是$ _POST ['submit']。

Answer 3

这可能是由于与cdn网络的连接速度缓慢造成的延迟，尝试在本地托管所有库（毕竟它们不是那么大的文件）。我已经看到你遵循了libarary文档中提供的示例代码。我不认为这是与代码相关的问题。

提交显示异常行为的按钮

3 个答案: