从模态中检索 html 并通过脚本将其转换为字符串

Question

如何通过脚本在模态框主体中检索 html？因为将 html 转换为字符串然后将该内容传递给控制器（并最终传递给操作方法）会很棒。

我以为我可以执行以下操作，但只收到一条 undefined 消息。

$("#sendButton").click(function () {
            alert("Send button pressed");
            $.ajax({
                url: '@Url.Action("DidItWork", "Home", new { testEmail = "newtestemail@gmail.com"})',
                success: function (result) {
                    var body = $('#myModal').attr('modal-body');
                    alert("Success. It worked: " + body);
                },

关于如何最好地将 html 元素转换为字符串以便它可以与 @Url.Action 中的 testEmail 字符串一起传递的想法/建议？我还应该使用 $('#myModal').data('modal-body') 而不是 .attr 吗？

在 _layout.cshtml 文件中，代码如下：

<div class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <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">Modal title</h4>
      </div>
      <div class="modal-body">
        <p>One fine body&hellip;</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

再往下有一个脚本有：

<script>
    $("#sendButton").click(function () {
        alert("Send button pressed");
        $.ajax({
            url: '@Url.Action("DidItWork", "Home", new { testEmail = "newtestemail@gmail.com"})',
            success: function (result) {
                alert("Success. It worked: " + result);
            }, 
            error: function( xhr, status, errorThrown ) {
                alert("Sorry, there was a problem! Error: " + errorThrown + ". Status: " + status + ". Console: " + xhr);
                console.log("Hello");
                console.log("Error: " + errorThrown);
                console.log("Status: " + status);
                console.dir(xhr);
                console.log("Good-bye");
            },
        });
        return false;
    });
</script>

将 testEmail 变量传递给 homecontroller.cs:

public async Task<ActionResult> DidItWork(string testEmail)
{
        var dash = "dash equals nash";

        var manager = HttpContext.GetOwinContext().GetUserManager<ApplicationUserManager>();
        var user = new ApplicationUser { UserName = "test2 username2", Email = "testemail2@gmail.com" };
        user.Email = testEmail;
        var result = await manager.CreateAsync(user, "passwordGoesHere1!");
        if (result.Succeeded)
        {
            await manager.SendEmailAsync(user.Id, "Confirm your account", "Please confirm your account");

            return View();
        }

        //AddErrors(result);
        return View();    
}

Answer 1

使用 jQuery .html() 函数获取特定元素的 HTML String 内容。

$('#myModal .modal-body').html();

您想获取classmodal-body元素的内容。在您的版本中，您获得了 #myModal 元素上名为 modal-body 的属性的值（returns undefined 因为不存在这样的属性）

从模态中检索 html 并通过脚本将其转换为字符串

Retrieve html from a modal and convert it to a string via a script

html

asp.net-mvc

jquery

razor

twitter-bootstrap