Question

我正在将记录详细信息加载到允许用户编辑的模式中。我想要实现的是让用户更新模态中的记录，然后通过AJAX / jQuery提交到MySQL表，但是，按下＆＃34; Save Changes＆＃34;按钮没有任何反应我检查了JS Query并确认该按钮已正确链接，并且在直接寻址PHP更新脚本时也设法更新数据库。不确定脚本拒绝启动的原因

模态：

    <div id="output"></div>

<!-- Modal MYMODAL -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Edit Record</h4>
      </div>
      <div class="modal-body">

        <!-- ID No. -->
        <div class="form-group">
            <label>ID No.:</label>
            <input type="number" class="form-control" id="dataPID" name="dataPID" size="5" disabled />
        </div>
        <!-- /.id number -->                                        

        <!-- Category -->
        <div class="form-group">
            <label>Category:</label>
            <input type="text" class="form-control" id="dataCat" name="dataCat" />
        </div>
        <!-- /.category -->

        <!-- Issue -->
        <div class="form-group">
            <label>Issue:</label>
            <input type="text" class="form-control" id="dataIssue" name="dataIssue" />
        </div>
        <!-- /.issue -->

        <!-- Department Responsible -->
        <div class="form-group">
            <label>Department Responsible:</label>
            <input type="text" class="form-control" id="dataDeptResp" name="dataDeptResp" />
        </div>
        <!-- /.department responsible -->

        <!-- Experience -->
        <div class="form-group">
            <label>Experience:</label>
            <input type="text" class="form-control" id="dataExp" name="dataExp" />
        </div>
        <!-- /.experience -->

        <!-- textarea -->
        <div class="form-group">
          <label>Description:</label>
          <textarea class="form-control" id="dataDesc" name="dataDesc" rows="3" ></textarea>
        </div>

      </div>
      <div class="modal-footer">
        <button type="button" id="SaveChanges" name="SaveChanges" class="btn btn-primary">Save Changes</button>
        <button type="button" id="DeleteRecord" name="DeleteRecord" class="btn btn-danger">Delete Record</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<!-- /.Modal MYMODAL -->

使用Javascript：

$("#SaveChanges").click(function() {
    $.ajax({
        type: "POST",
        url: "plugins/MySQL/ajax_action.php",
        data: { action:"update_mysqli",PID:$("#dataPID").val(), Category:$("#dataCat").val(), Issue:$("#dataIssue").val(), Department_Responsible:$("#dataDeptResp").val(), Experience:$("#dataExp").val(), Description:$("#dataDesc").val()}, //your form data to post goes here as a json object
        dataType: "json",
        contentType:"text",                                     

        success: function(data) {
            $('#output').html(data); 
            drawVisualization();   
        },
    });
});

ajax_action.php

    <?php

error_reporting(E_ALL);
ini_set('display_errors', 1);

if(isset($_POST['action']) && ($_POST['action']=='update_mysqli')) {

    // include connection details
    include 'connect_db.php';

    //Open a new connection to the MySQL server
    $db = new mysqli($dbhost,$dbuser,$dbpass,$dbname);

    //Output any connection error
    if ($db->connect_error) {
        die('Error : ('. $db->connect_errno .') '. $db->connect_error);
    }

    // get variables and sanitize
    $pid = mysqli_real_escape_string($db,$_POST['PID']);
    $cat = mysqli_real_escape_string($db,$_POST['Category']);
    $issue = mysqli_real_escape_string($db,$_POST['Issue']);
    $dept_resp = mysqli_real_escape_string($db,$_POST['Department_Responsible']);
    $exp = mysqli_real_escape_string($db,$_POST['Experience']);
    $desc = mysqli_real_escape_string($db,$_POST['Description']);

    // check if record exists based on ID number      
    $result = $db->query("SELECT * FROM qci_problems_index_new WHERE PID='".$pid."'");

    // if record is found, update accordingly
    if ($result->num_rows > 0){ 

        $sql = "UPDATE qci_problems_index_new SET Category = '$cat', Issue = '$issue', Department_Responsible = '$dept_resp', Experience = '$exp', Description = '$desc' WHERE PID = '$pid'";

        if (!$db->query($sql)) {
        echo "Error - Update of record PID " . $pid . " failed: (" . $db->errno . ") " . $db->error;
        }
    } else {
        // if no record with relevant PID is found, create new record
        $sql = "INSERT INTO `qci_problems_index_new`(`PID`, `Category`, `Issue`, `Department_Responsible`, `Experience`, `Description`) VALUES ('".$pid."', '".$cat."', '".$issue."', '".$dept_resp."', '".$exp."', '".$desc."')";

        if (!$db->query($sql)) {
        echo "Error - could not insert new record: (" . $db->errno . ") " . $db->error;
        }

    }

    echo "Success, record updated successfully";

    //close connection
    $db->close();

}

编辑1： Chrome控制台说明以下内容：

编辑2：更新的代码

Answer 1

将数据类型更改为json，将内容类型更改为文本，将get变量添加到帖子请求

$("#SaveChanges").click(function() {
    $.ajax({
        type: "POST",
        url: "plugins/MySQL/ajax_action.php",
        data: { action:"update_mysqli",PID:$("#dataPID").val(), Category:$("#dataCat").val(), Issue:$("#dataIssue").val(), Department_Responsible:$("#dataDeptResp").val(), Experience:$("#dataExp").val(), Description:$("#dataDesc").val()}, //your form data to post goes here as a json object
        dataType: "json",
        contentType:"text",

        success: function(data) {
            $('#output').html(data); 
            drawVisualization();   
        },
    });
});

PHP

if(isset($_POST['action']) && ($_POST['action']=='update_mysqli')) {

Answer 2

您正在传递值＆＃34; update_mysql ＆＃34;在＆＃34; 行动＆＃34; ajax URL中的参数（plugins / MySQL / ajax_action.php？ action = update_mysql ）。另一方面，如果＆＃34; action＆＃34;的值，则ajax_action.php中的条件将仅执行代码。参数是＆＃34; update_mysqli ＆＃34;

更改以下行

if(isset($_GET['action']) && ($_GET['action']=='update_mysqli'))

到

if(isset($_GET['action']) && ($_GET['action']=='update_mysql'))

在你的ajax_action.php文件中。

OR

或者，您可以在ajax调用中为操作参数传递值 update_mysqli 而不是 update_mysql 。由于您使用的是mysqli，因此为了最佳实践，您会更喜欢这个，因为您在代码中使用了mysqli函数。

jquery + AJAX - 通过模态更新MySQL记录

2 个答案: