如何将数据从 Bootstrap Modal 添加到 MySQL答案

【问题标题】：How to add data from Bootstrap Modal to MySQL如何将数据从 Bootstrap Modal 添加到 MySQL
【发布时间】：2016-06-29 08:21:17
【问题描述】：

我正在尝试通过 Anchor 链接单击将一些数据从 Bootstrap Modal 发送到 MySQL 表数据库，但我没有让它工作。

这是调用模态的PHP：-

<a href='#' data-toggle='modal' data-target='#add-post' data-userid=" . $_SESSION['user_id'] . " data-username=" . $username . " data-email=" . $email . ">Add a post</a>

这是引导窗口模式：-

<div class="modal fade" id="add-post" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
  <div class="modal-body">          
      <form class="form-horizontal" role="form" name="add_post">


<input type="hidden" name="username" value="<?php echo $username; ?>">
          <input type="hidden" name="email" value="<?php echo $email; ?>">
        <div class="form-group">
        <label  class="col-sm-3 control-label" for="gebruikersnaam" style="text-align: left;">Username</label>
        <div class="col-sm-9 control-label" style="text-align: left;"><?php echo $username; ?></div>
      </div>
      <div class="form-group">
        <label class="col-sm-3 control-label" for="email" style="text-align: left;">E-mail</label>
        <div class="col-sm-9 control-label" style="text-align: left;"><?php echo $email; ?></div>
      </div>
      <div class="form-group">
        <label class="col-sm-3 control-label" for="post" style="text-align: left;">Post</label>
        <div class="col-sm-9 control-label" style="text-align: left;"><textarea name="post" rows="5" cols="70"></textarea></div>
      </div>
    </form>
  </div>
  <div class="modal-footer">
    <input class="btn btn-success" type="submit" value="Add post" id="submit" />
  </div>
</div>

这是使用 process.php 发送数据的 JQuery AJAX 语法

<script> 
$(document).ready(function () {
$("input#submit").click(function(e){
    $.ajax({
        type: "POST",
        url: "process.php", // 
        data: {
    'username':username,
    'email':email
        },
        success: function(msg){
            //alert("ok");
            $('#add-post').modal('hide');
        },
        error: function(){
            alert("Something went wrong!");
        }
    });
});
});
</script>

process.php是：

<?php
if ($_POST['post']) { 

$sql = "INSERT INTO posts (username, email, post , date) VALUES ('". htmlspecialchars($username, ENT_QUOTES) . "', '". htmlspecialchars($email, ENT_QUOTES) . "', '" . htmlspecialchars($_POST['post'], ENT_QUOTES) . "', NOW())";

$res = mysqli_query($con, $sql) or die(mysql_error());

}
?>

知道出了什么问题吗？

【问题讨论】：

首先你没有建立数据库连接，其次你正在插入$username、$email 等。这些变量没有定义。它应该是$_POST['username']、$_POST['email'] 等......而且你没有在你的 jQuery 调用中发送帖子的价值。发送数据的最佳方式是使用 jQuery 序列化。 api.jquery.com/serialize
感谢评论，但我没有将数据库连接复制到该线程中，因为我认为拥有此信息是合乎逻辑的，我的坏........ :-)。我看到我什至忘记将变量复制到线程中但它们在那里，主要问题是我没有在 Jquery 中发送正确的值。

标签： php jquery mysql ajax bootstrap-modal

【解决方案1】：

试试这样的脚本

$(document).ready(function () {
$("input#submit").click(function(e){
    $.ajax({
        type: "POST",
        url: "process.php", // 
        data: {
    'username':$('input[name=username]').val(),
    'email':$('input[name=email]').val()
        },
        success: function(msg){
            alert("ok");
            $('#add-post').modal('hide');
        },
        error: function(){
            alert("Something went wrong!");
        }
    });
});
});

【讨论】：