使用 ajax 在 bootstrap 模态中加载远程表单进行编辑

Question

这就是我正在尝试的：

打开模式：

<a href="" class="label label-important" 
data-toggle="modal" data-target="#editFee" 
data-id="'.$month['fid'].'" title="Edit '.$month['status'].' Fee">Edit</a>';

这是modal dialog:

<div class="modal fade" id="editFee" tabindex="-1" role="dialog"
style="width: 25%" aria-labelledby="myModalLabel" aria-hidden="true">
           <div class="modal-dialog">
              <div class="modal-content">
                 <div class="modal-header">
                   <h4 class="modal-title" id="myModalLabel">Pay Fee</h4>
                 </div>
                 <div class="modal-body">
                    <!--Load remode editfee.php--!>
              </div>
        </div>
    </div>
</div>

这是editfee.php

<?php 
$id=$_GET['id'];
$fee = QueryFee('Feetable', $id);
foreach($fee as $feeForm):
?>
<form>
<input type="text" id="amount" value="<?php echo $feeForm['amount']; ?>">
<input type="text" id="dateFee" value="<?php echo $feeForm['dateFee']; ?>">
<input type="submit" id="submitFee" value="Save Fee">
</form>
<?php endforeach;?>

最后 jquery ajax:

$(document).on("click", ".label", function(e){
        e.preventDefault();
        var id= $("#id").val();
        dataEdit = 'id='+id;
        $.ajax({
            type:'GET',
            data:dataEdit,
            url:'editfee.php',
            success:function(data) {
              $(".modal-body").val(data);             
            }
          });

    });

我正在使用 Bootstrap 模态 V2.0.4。上面的代码确实打开了对话框，但没有来自 editfee.php 的远程数据。请帮助我。

Answer 1

在您的示例中，此代码无效：

var id= $("#id").val();

你必须使用这样的东西：

var id = $(this).data('id');

并完成：

$(".modal-body").html(data);

Answer 2

$(".modal-body").val(data);

将不起作用，因为模态主体只是一个 div 而不是输入元素。所以我们应该给

$(".modal-body").html(data);

而不是

$(".modal-body").val(data);

.val() 属性仅适用于输入元素。 .html() 用于将 html 内容附加到 div.

并通过

获取id属性

$(this).attr("id")

或

$(this).prop("id")

使用 ajax 在 bootstrap 模态中加载远程表单进行编辑

Load remote form for editing in bootstrap modal using ajax

php

ajax

jquery

bootstrap-modal