Question

我有以下HTML来显示一些消息

...
<div class="form-group">
    <div class="col-md-offset-2 col-md-10">
        <span id="fail_message" class="label label-danger"></span>
        <span id="success_message" class="label label-success"></span>
    </div>
</div>
<div class="form-group">
    <div class="col-md-offset-2 col-md-10">
        <input type="button" value="Invite User" class="btn btn-primary"/>
    </div>
</div>
...

按下按钮时触发的脚本是

<script>
    $(function () {
        $("input[type=button]").click(function () {
            var data_email = $('#email').val();
            var data_product = $('#product option:selected').text();
            $.ajax({
                url: 'Tools/SendInvite',
                type: 'POST',
                data: { email: data_email, product: data_product },
                success: function (result_success, result_failure) {
                    $('#fail_message').val(result_failure);
                    $('#success_message').val(result_success);
                }
            });
        });
    });
</script>

然后在我的控制器中我有

[AllowAnonymous]
public async Task<ActionResult> SendInvite(
    string email, string product)
{
    // Check if admin.
    ApplicationUser user = null;
    if (ModelState.IsValid)
    {
        user = await UserManager.FindByIdAsync(User.Identity.GetUserId());
        if (user.IsAdmin != null && (bool)user.IsAdmin)
        {
            string key = String.Empty;
            string subMsg = String.Empty;
            var accessDB = new AccessHashesDbContext();
            switch (product) { /* do stuff */ }

            // Send email.
            try
            {
                await Helpers.SendEmailAsync(new List<string>() { email }, null, "my msg string" );
                result = String.Format("Invitation successfully sent to \"{0}\"", email);
                return Json(new {
                        result_success = result,
                        result_failure = String.Empty
                    },
                    JsonRequestBehavior.AllowGet);
            }
            catch (Exception)
            {
                result = String.Format("Invitation to \"{0}\" failed", email);
                return Json(new {
                        result_success = String.Empty,
                        result_failure = result
                    },
                    JsonRequestBehavior.AllowGet);
            }
        }
    }
    return Json(new {
            result_success = String.Empty,
            result_failure ="Invite Failure"
        },
        JsonRequestBehavior.AllowGet);
}

触发控制器方法，发送电子邮件并返回视图，但不显示我的消息。 如何让标签显示正确的文字？

感谢您的时间。

注意。我见过

ASP.NET MVC controller actions that return JSON or partial html
how to set textbox value in jquery

但这些对我没有帮助。

Answer 1

使用以下

更改您的成功方法

success: function (result) {
    $('#fail_message').html(result.result_failure);
    $('#success_message').html(result.result_success);
}

服务器返回一个json对象。

Answer 2

尝试将ajax成功处理程序更改为

  function (result) {
       $('#fail_message').html(result.result_failure);
       $('#success_message').html(result.result_success);
   }

处理程序应该接收一个JSON对象，其中包含您在操作中指定的2个属性。

Answer 3

$('#fail_message').html(result.result_failure);
$('#success_message').html(result.result_success);

Answer 4

你必须使用这个

<script>
    $(function () {
        $("input[type=button]").click(function () {
            var data_email = $('#email').val();
            var data_product = $('#product option:selected').text();
            $.ajax({
                url: 'Tools/SendInvite',
                type: 'POST',
                data: { email: data_email, product: data_product },
                success: function (result) {
                         $('#fail_message').html(result.result_failure);
                         $('#success_message').html(result.result_success);
                }
            });
        });
    });
</script>

Answer 5

JavaScript需要这样：

<script>
    $(function () {
        $("input[type=button]").click(function () {
            var data_email = $('#email').val();
            var data_product = $('#product option:selected').text();
            $.ajax({
                url: 'Tools/SendInvite',
                type: 'POST',
                data: { email: data_email, product: data_product },
                success: function (result) {
                    $('#fail_message').html(result.result_failure);
                    $('#success_message').html(result.result_success);
                }
            });
        });
    });
</script>

请注意，success函数显示只传递了一个参数：result。

这是因为在你的行动中你会回复：

return Json(new {
            result_success = String.Empty,
            result_failure ="Invite Failure"
        },
        JsonRequestBehavior.AllowGet);

您创建了一个新对象：new {}然后用一些字段填充它。因此，当它被发送回页面时，将有一个具有两个属性的对象（result）。显然返回的对象不是result，而是在函数的上下文中给出的名称。

最后，因为您使用的是return Json，所以您还应该确保您的Action方法返回的类型为JsonResult而不是ActionResult。在ASP.NET框架下，ASP.NET团队扩展了ActionResult，但他们还设置了一些属性，如内容类型，以确保网页知道如何处理响应。它还使用JavaScript序列化程序正确地序列化对象。参考：http://aspnetwebstack.codeplex.com/SourceControl/latest#src/System.Web.Mvc/JsonResult.cs

public async Task<JsonResult> SendInvite(
    string email, string product)
{

如果你想使用newtonsoft JSON.net，我会创建实现它的自定义结果。

无法将JSON结果传递回View

5 个答案: