如何从 JQuery 中的表行中提取 PHP 值以供以后使用？

Question

我有一个 Button 填充了表格中的每一行。我希望能够输入“$row[auditID]”行的值并在我的模式中使用它，以便能够使这个删除按钮工作。弹出警报，但 Modal 不会隐藏，并且我的删除操作不起作用（不会删除审核）。

<a href=\"#\" id=\"$row[auditID]\" class='btn btn-danger  btn-xs' role='button' data-toggle='modal' data-target='#question_alert' Title=\"Remove\" >Remove</span>   </a>";

<!-- modal pop up for Deleting a audit -->
<div class="modal fade" style="z-index:10000" id="question_alert" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
            <h4 class="modal-title">Audit Delete Confirmation</h4>
            </div>
            <div class="modal-body"id="myModal1">
                <h3>Are you sure you want to <strong>DELETE</strong> this Audit? You will not be able to get it back.</h3>
            </div>
            <div class="modal-footer">
            <form method = "POST">
                <input type="button" id="yes_delete" value="Yes " name="deleteaudit" />
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
            </form> 
            </div>
        </div>
    </div>
</div>

jQuery 脚本：

<script> 
 $("#yes_delete").click(function(){
var auditID = this.id;
//alert("delete test");
    $.post("edit_audits.php?action=delete&auditID="+auditID,{
    function(data){
        alert("Audit Deleted");
        $('question_alert').modal('hide');
        window.location.reload();
        }
        }); 
    }); 
</script>

Answer 1

这样的？

将您的 PHP 值放入 a 标记中，如下所示：

    <a href="#" data-mylink="<?php echo $yourPHPVar; ?>" class='btn btn-danger  btn-xs' role='button' data-toggle='modal' data-target='#question_alert' Title="Remove" ><span>Remove</span> </a>

jsFiddle Demo

$('#question_alert').on('shown.bs.modal', function (e) {
	var btn = $(e.relatedTarget);
	var linked = btn.data('mylink');
	$('#audNo').text(linked);
// Or:
//	var modal = $(this);
//	modal.find('.modal-body h3 span#audNo').text(linked);
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<a href="#" id="bob" data-mylink="Fred" class='btn btn-danger  btn-xs' role='button' data-toggle='modal' data-target='#question_alert' Title="Remove" ><span>Remove</span> </a>

<!-- modal pop up for Deleting a audit -->
<div class="modal fade" style="z-index:10000" id="question_alert" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
            <h4 class="modal-title">Audit Delete Confirmation</h4>
            </div>
            <div class="modal-body"id="myModal1">
                <h3>Are you sure you want to <strong>DELETE</strong> Audit number <span id="audNo"></span>? You will not be able to get it back.</h3>
            </div>
            <div class="modal-footer">
            <form method = "POST">
                <input type="button" id="yes_delete" value="Yes " name="deleteaudit" />
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
            </form> 
            </div>
        </div>
    </div>
</div>

Answer 2

我会做这样的事情

<a href="javascript:void(0)" class='btn btn-danger btn-xs btn-remove' data-id="<?=$row["auditID"]?>" role='button' data-toggle='modal' data-target='#question_alert' Title="Remove" >Remove</span></a>

<!-- modal pop up for Deleting a audit -->
<div class="modal fade" style="z-index:10000" id="question_alert" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
            <h4 class="modal-title">Audit Delete Confirmation</h4>
            </div>
            <div class="modal-body"id="myModal1">
                <h3>Are you sure you want to <strong>DELETE</strong> this Audit? You will not be able to get it back.</h3>
            </div>
            <div class="modal-footer">
            <form method = "POST">
                <input type="button" id="yes_delete" value="Yes " name="deleteaudit" />
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
            </form> 
            </div>
        </div>
    </div>
</div>

这在 jQuery 函数中。确保将 jQuery 脚本标签放在页面顶部，以便 jQuery 在此函数之前加载

<script>
var removeId = null;
$(document).ready(function(){
    $(".btn-remove").click(function(){
        removeId = $(this).attr("data-id");
    });
    $("#yes_delete").click(function(){
        $.ajax({
            url: "edit_audits.php",
            type: "POST",
            data: "action=delete&auditID="+removeId,
            success: function(){
                $('#question_alert').modal('hide');
                window.location.reload();
            }
        });
    }
});

请记住，我没有运行它，因为我没有所需的所有数据。您可能需要稍微调试一下，因为它是盲编码。