Question

我在使用jQuery和modal将值传递到另一个页面时遇到了问题。所以这是我的代码。

解雇模态：

echo "<input type='hidden' data_project='$row[PROJECT_NAME]' data_headmark='$row[HEAD_MARK]' data_id='$row[ID]'></input>";

echo '<button type="button" name="qcreject" id="qcreject" class="btn btn-primary btn-danger btn-lg btn-block" data-toggle="modal" data-target="#qcRejectModal"> 
                <span style="font-size:35px"> '.$row['PROJECT_NAME'].' / <b>'.$_POST["hm"].'</b>/'.$row['ID'].' ~ FAIL</span></button>';

 <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                              This is the confirmation window to PASS all the Quality Control for, <br/><br/>
                              PROJECT : <b>'.$row['PROJECT_NAME'].'</b>
                              HEADMARK : <b>'.$row['HEAD_MARK'].'</b>
                              ID : <b>'.$row['ID'].'
                            </div>
                        </div>
                    </div><br/>
                    <div class="row">
                        <div class="col-md-12">
                          <div class="form-group">
                            <textarea name="reasonForRejection" id="reasonForRejection" class="form-control" placeholder="Reason for rejection" rows="2" required></textarea>
                          </div>
                        </div>
                    </div>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button type="button" name="rejectbutton" id="rejectbutton" class="btn btn-danger">Confirm REJECT!</button>
                  </div>

当用户点击拒绝按钮时，它应该将textarea中的PROJECT_NAME，HEAD_MARK，ID和值传递给testClass.php。

jQuery是，

$('#rejectbutton').click(function() {

        $.post("testClass.php",{
        projectName : this.getAttribute("data_project"), 
        headMark : this.getAttribute("data_headmark"),
        id : this.getAttribute("data_id"),
        reasonReject : this.getAttribute("reasonForRejection")});
    });

并在testClass.php内部

    echo 'TEST CLASS WORKS';

$val1 = $_POST["projectName"];
$val2 = $_POST["headMark"];
$val3 = $_POST["id"];
$val4 = $_POST["reasonReject"];

var_dump($val1);
var_dump($val2);
var_dump($val3);
var_dump($val4);

不幸的是，我在testClass中获得的所有值都为null

TEST CLASS WORKSstring(0) ""
string(0) ""
string(0) ""
string(0) ""

Answer 1

查看此代码：

$('#rejectbutton').click(function() {
    $.post("testClass.php",{
    projectName : this.getAttribute("data_project"), 
    headMark : this.getAttribute("data_headmark"),
    id : this.getAttribute("data_id"),
    reasonReject : this.getAttribute("reasonForRejection")});
});

它假定，当点击标识为#rejectbutton的元素时，即：

<button type="button" name="rejectbutton" id="rejectbutton" class="btn btn-danger">Confirm REJECT!</button>

它具有您想要的属性，但它没有。此外，您正在尝试使用getAttribute()获取属性 - 为什么不使用jquery方法？

这就是你如何做到的。将您的HTML更新为：

<button
    type="button"
    name="rejectbutton"
    id="rejectbutton"
    class="btn btn-danger" 
    data_project="some project name",
    headMark="some head mark",
    data_id="1234",
    reasonForRejection="some reason here"
    >Confirm REJECT!</button>

然后更新你的JS以在你的帖子请求中获取这些属性：

$('#rejectbutton').click(function() {
    $.post("testClass.php", {
        projectName : $(this).attr('data_project'),
        headMark : $(this).attr('headMark'),
        id : $(this).attr('data_id'),
        reasonReject : $(this).attr('reasonForRejection'),
    });
});

Answer 2

在隐藏字段中添加id属性，然后在js中使用该属性，如下面的代码。

echo "<input type='hidden' data_project='$row[PROJECT_NAME]' data_headmark='$row[HEAD_MARK]' data_id='$row[ID]' id="data_field" />";

// your codes

$('#rejectbutton').click(function() {
     var myData = $('#data_field');
     $.post("testClass.php",{
     projectName : myData.attr("data_project"), 
     headMark : myData.attr("data_headmark"),
     id : myData.attr("data_id"),
     reasonReject : $("#reasonForRejection").val() 
     });
});

使用modal和jquery从另一个页面传递时，值为null

2 个答案: