Question

我花了很多时间来理解如何使用模态弹出窗口，但我还没有找到任何好的答案，或者我应该说明完整的工作代码。

我正在寻找一种使用MVC HTTPGET，HTTPPOST方法的方法，在Javascript或Ajax中不应该有硬编码的属性名称

这是我到目前为止所能实现的目标：
enter image description here

我是AJAX的新手，JQUERY

主要错误：我无法在此处正确使用SAVE按钮，即在Internet Explorer和Chrome中未调用HTTPPOST操作，但在Firefox中可以使用

Approach based on this link但它没有在Internet Explorer中进行锻炼。问题：HTTPPOST操作不会在Internet Explorer或Chrome中调用
Tried to follow his complete article但不喜欢使用JSON的方式并执行验证。
Jquery UI modal form: Want to use feature like this但不知道如何在此使用ASP.net MVC4 HTTP GEt和HTTP POST。
Tried this demo too but :(
This one was good, tried to implement by using his complete source code but still could not able to work
ASP.net MVC Modal这个人有太多的希望。下载后，试图在2-3小时后实现所有内容，即使这个也没有“随时可用”。 More information about it
Code project: Comparison of three jquery modal虽然它是在ASPX中但仍尝试实施。（没用完:(）

尝试了其他一些解决方案，每个解决方案都有自己的问题。可能是这些帖子中的一些旧的和jquery版本已经过时的少数控件。

这个功能几乎被使用和讨论，所以如果有人有工作代码，那么请分享。

CODE 以下是我的完整代码：http://pastebin.com/yNH7CFTS

错误提示我不确定这是否是问题，但在Internet Explorer中按“保存”按钮然后对话框关闭调用HTTPPost操作和浏览器中的网址：

http://localhost:53381/Project/Details/1?ProjectId=1&Effort=0&Cost=56

值1,0,56是我在文本框中输入的内容

任何人都可以使用RESTFUL方法在asp.net MVC中发布MODAL / POPUP的完整答案。

Answer 1

使用$ .post jquery方法调用这样的httppost控制器操作：

$.post(
    "addressofaction",
        {}).done(function () {
            alert("do something"
            })
        }).fail(function () {
            alert("error");
        })

Answer 2

我无法测试它，我尽可能简化了之前为具有大量自定义功能的Web应用编写的代码。

查看

@using (Html.BeginForm("PostAction", "A" , FormMethod.Post ,new { @class = "modal-form", id = "asd" })) { <div class="modal-header">Header</div> <div class="modal-body"> ......... <div class="modal-footer"> <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> <button type="submit" class="btn btn-success">Save</button> }

让我们说 AController

[HttpPost] public JsonResult PostAction(PostModel model) { return Json(true); }

和jQuery与最新版本

$(document).on("submit", 'form.modal-form', function (e) { e.preventDefault(); var form = $(this); $.ajax({ url:form.attr("action"), type:"POST", data:form.serialize(), contentType:"application/json; charset=utf-8", success: function(result){ if (result) { //Returns true } else { //Returns false } } }); }

Answer 3

最后发现问题不在于方法，而是放置了“DialogDiv”代码。

What's the best way to call a modal dialog in ASP.NET MVC using Twitter Bootstrap?建议的方法绝对是一个很好的方法。这就是我做错了。

我在“index.cshtml”

中写了这个

<!-- Estimated Effort Region -->
   <div class="span5">
      <h4>
              Estimated Effort
        <!-- Open  Bootstrap Modal using this link -->
         @Html.ActionLink("Create", "Create", null, null, 
              new { id = "btnCreate", @class = "btn" })
        <div id='dialogDiv' class='modal hide fade in'>
            <div id='dialogContent'></div>
       </div>
      </h4>                   

     <!-- Table on project details page -->
     <table class="table">
          <!-- Stuff related to displaying table -->
     </table>
  </div>

但是，Modal对话框div不应与索引视图代码一起使用。即，这应该完全在索引视图代码之外。

在Best approach for Modal建议的代码中，它不可重复，因为它涉及非常基本的代码。

<div id='dialogDiv' class='modal hide fade in'>
    <div id='dialogContent'></div>
</div>

可以帮助别人。

使用ASP.net MVC4中的Modal弹出窗口添加/编辑/删除

3 个答案: