javascript - 使用 Javascript 将值传递给模态弹出窗口

Question

当用户单击该特定按钮时，我想将按钮 ID 值传递到模态弹出窗口中。稍后，我可以从传递的 ID 查询数据库值并在打开的模式弹出窗口中查看。

这是按钮的代码部分。 ID 将从 DB 中分配。它运行良好。

<td>
<input type="submit" name="button" id="<?php echo $row["id"];?>" value="Details" onClick="popupwindow(this.id)">
</td>

模态窗口:这里我需要获取popupwindow函数的值并查询数据库和 View :

<div id="openModal" class="modalDialog">
    <div>
        <a href="#" title="Close" class="close">X</a>
        <h2>Modal Box</h2>
        <!--  From the retrieved values I can query and view data here.-->
    </div>
</div>

用于将值传递到模态弹出窗口的 JavaScript 函数

function popupwindow(id) {

// code for Pass the value to modal window

            window.location="#openModal"
            }

我需要 popupwindow 函数的代码示例来将按钮 ID 值传递到模态窗口。请帮我解决这个问题。我对这个话题很陌生。

Answer 1

我认为你应该使用AJAX来查询你的数据库并从中检索数据，你的popupwindow的基本模板可以是这样的:

function popupwindow(id) {

    $("#openModal .content").load("yourscript.php?id=" + escape(id), function(){
        $("#openModal").show();
    })

}

还有你的 HTML:

<div id="openModal" class="modalDialog">
    <div>
        <a href="#" title="Close" class="close">X</a>
        <h2>Modal Box</h2>
        <!--  From the retrieved values I can query and view data here.-->
        <div class="content"></div>
    </div>
</div>