僅供參考：我沒有使用引導模式框彈出。我在每一行都有一個帶有按鈕的表格，可以在彈出的模式框中顯示詳細信息。我附上了 、 和 所需dashboard.html的modal.js部分modal.css代碼modal.php。我缺乏 jquery 的概念來向表單添加元素并通過 PHP 分配返回的 JSON 文件的值，然后將 FORM 添加到div tag class modal-content. 用于彈出模式框的 CSS 也不適用于按鈕單擊。此外，我想刪除之前的 html 表單標簽，class modal-content因為每次新行點擊都會彈出新表單，用戶可以在其中進行編輯和更改行的值。您可以通過查看下面的屏幕截圖來獲得更清晰的圖片。該modal.js文件將在每個新按鈕單擊時獲取行 ID，并構建 HTML FORM 以使用該 HTML FORM 彈出模態框。$(document).ready(function() { $('[name="leadidclick"]').click(function(e){ e.preventDefault(); // var leadid = $('[name="leadidclick"]').val(); var leadid = $(this).val(); alert("You clicked Leadid: " + leadid); $.ajax({ type: "POST", url: './server/modal.php', data: { 'leadid': leadid }, success: function(data){ var result = $.parseJSON(data); console.log(result); console.log(result.length) //Modal Box to POP UP HERE $.each(result, function(key, value) { $form = $("<form action='' method='POST'></form>").attr("id", value['Lead_Id']); //This value assigning based on JSON Key value pair is also not working $form.append('<label>Lead Id: </label><input type="text" name="leadid" ').attr("id", value['Lead_Id']); $form.append('<label>Lead Name: </label><input type="text" name="leadname">').attr("value", value['FirstName']+" "+value['LastName']); $form.append('<label>Company: </label><input type="text" name="company" ').attr("value", value['Company']); $form.append('<input type="button" value="button">'); i = i + 1; }); $( ".modal-content" ).append( $form ); //This change in CSS is not working $('#myModal').css("display", "show"); } }); });});
1 回答
蠱毒傳說
TA貢獻1895條經驗 獲得超3個贊
在文件dashboard.html中，您必須在模型代碼 ex 中提供 div。<div id="formapp">
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">×</span>
<p>This is Modal Box</p>
<div id="formapp">
</div>
</div>
</div>
在阿賈克斯
$.ajax({
type: "POST",
url: './server/modal.php',
data: {
'leadid': leadid
},
success: function(data){
var result = $.parseJSON(data);
console.log(result);
console.log(result.length)
//Modal Box to POP UP HERE
$('#formapp').empty(); // first empty division content
var form=''; //declare var
$.each(result, function(key, value) {
form = $("<form action='' method='POST'></form>").attr("id", value['Lead_Id']);
//This value assigning based on JSON Key value pair is also not working
form.append('<label>Lead Id: </label><input type="text" name="leadid" value="'+value['Lead_Id']+'">');
form.append('<label>Lead Name: </label><input type="text" name="leadname" value="'+value['FirstName']+" "+value['LastName']+'">');
form.append('<label>Company: </label><input type="text" name="company" value="'+value['Company']+'">');
form.append('<input type="button" value="button">');
i = i + 1;
});
$( "#formapp" ).html( form );
//This change in CSS is not working
$('#myModal').show();
}
});
或者不需要$.each()單條記錄，只需使用result[0]['Lead_Id']
也$form被視為參考。在jquery中使用var聲明變量
- 1 回答
- 0 關注
- 103 瀏覽
添加回答
舉報
0/150
提交
取消