微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

模态弹出窗口打开部分视图

如何解决模态弹出窗口打开部分视图

我在 index.cshtml 页面中有一个表格,我想单击 Notes 列中的链接来触发 AJax 调用以打开部分视图 editNotes.cshtml 并提交文本以更新控制器操作“UpdateNotes”。现在,当我单击“编辑”链接时,表单会变灰,并且不会显示弹出的对等视图。当我查看调试器窗口时,我可以看到数据 html 被传递到 $('#modalWrapper').html(data);请帮忙看看是什么问题。谢谢。 索引.cshtml

 ...
 <td class="Notes">

                @Html.displayFor(modelItem => item.Notes)
                <a href="#" onclick="editNotes(@item.id)" class="btn btn-primary" data-toggle="modal" data-target="#modalWrapper">Edit</a></td>

...
//modal window

<div id="modalWrapper" class="modal">
</div>

//_UpdateNotes.cshtml

@model NameSpace.Models.myTableModel
@using (Html.BeginForm())
{
<div class="modal fade" id="editModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div id='myModalContent'>
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">Edit</h4>
                </div>
                <div class="modal-body">
                    <form>
                        <input type="text" id="Notes" value="@Model.Notes" />
                        <input type="submit" />
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
 </div>

}

custom.js

function editNotes(id) {
$.ajax({
    url: '/Admin/UpdateNotes/'+id,// The method name + paramater
    
    success: function (data) {
      
        $('#modalWrapper').html(data); //  html (the partial view)
        $('#editModal').modal();
       
    }
});
}

管理控制器

[HttpGet] // this action result returns the partial containing the modal
    public ActionResult UpdateNotes(int id)
    {
        var viewmodel = new myTableModel ();
        viewmodel.id = id;
        return PartialView("_UpdateNotes",viewmodel);
    }
    [HttpPost]
    public ActionResult UpdateNotes(myTableModel model)
    {
        using (DbContextModel db = new DbContextModel())
        {
            if (ModelState.IsValid)
            {
                 myTableModel C = db.myTableModel.Where(x => x.id == model.id).Single<myTableModel>();
                 C.Notes = model.Notes;
                db.SaveChanges();
            }
            return View("Index");
        }
    }

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。