javascript - 如何在 bootstrap Modal asp.net mvc 中使用编辑

标签 javascript c# jquery asp.net-mvc twitter-bootstrap

我正在使用 asp.net mvc 我想使用 bootsrap 模式更新数据库中的数据 和部分意见。 问题是当我单击链接以显示它不工作的模型时(它显示一个空模式)

这是我的代码:

     //the Controller Action
         public ActionResult Edit(int id = 0)
        {
            Tache tache = db.Taches.Find(id);


            if (tache == null)
            {
                return HttpNotFound();
            }
            return PartialView("PartialEdit", tache);
        }



   // the index View that contain the link and the modal definition :

         <td>
         <a data-modal='' href='"/Tache/edit/"+@item.TacheId' data-id="@item.TacheId" id="@item.TacheId " title=" edit">Edit </a> |
          @Html.ActionLink("Delete", "Delete", new { id = item.TacheId })
           </td>

<div id='myModal' class='modal fade'>
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div id='myModalContent'></div>
        </div>
    </div>
</div>

//这是局部 View

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Nouvelle Tâche</h4>
                </div>

    @using (Html.BeginForm("Create", "Tache", FormMethod.Post, new { @id = "formId" }))
    {
        @Html.AntiForgeryToken()
        @Html.ValidationSummary(true)





    @Html.HiddenFor(model => model.TacheId)
                <div class="modal-body">




        //Some  forms in inputs
                    <div class="row">

//最后我的 javascript :

           $(function () {
    $.ajaxSetup({ cache: false });
    $("a[data-modal]").on("click", function (e) {
        $('#myModalContent').load(this.href, function () {
            $('#myModal').modal({
                keyboard: true
            }, 'show');
            bindForm(this);
        });
        return false;
    });
     });

      function bindForm(dialog) {
    $('form', dialog).submit(function () {
        $('#progress').show();
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (result) {
                if (result.success) {
                    $('#myModal').modal('hide');
                    $('#progress').hide();
                    location.reload();
                } else {
                    $('#progress').hide();
                    $('#myModalContent').html(result);
                    bindForm();
                }
            }
        });
        return false;
    });
    }

我认为问题可能出在缺少某些东西的链接!! 但我不确定 如果有人能帮助我,那就太好了 想你

最佳答案

正如我在评论中所说,代码现在可以完美运行。

在我的索引 View 中,我已经替换了这个:

<a data-modal='' href='"/Tache/edit/"+@item.TacheId' data-id="@item.TacheId" id="@item.TacheId " title=" edit">Edit </a> 

对此:

<a data-modal='' href="@Url.Action("Edit", "Tache", new { id = item.TacheId })" data-id="@item.TacheId" id="@item.TacheId " title=" edit">Modifier </a>

关于javascript - 如何在 bootstrap Modal asp.net mvc 中使用编辑,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36083104/

相关文章:

javascript - JavaScript 中的十进制算术

javascript - JQuery - 有条件地迭代元素以 addClass()

javascript - 如何为页面中的所有动画添加公共(public)回调?

c# - 在 WPF 中重叠(叠加)图像的更好方法?

javascript - jQuery 无法用meteor.js 改变DOM?

jquery - 将 UI 外部 DOM 操纵器导入到 svelte 客户端

javascript - browserify包: how to expose library inside window object?

c# - 使用 dapper 并将一列映射到 json

c# - 在 linq 查询中动态选择字段

jquery - Flot - 设置线垂直顺序(z-index)