从Controller ASP.NET MVC返回View时调用jquery代码

Question

I have an MVC app and want to fire up a jquery code when a view is returned from a controller. 我有一个MVC应用程序，想从控制器返回视图时启动jquery代码。

This is the jquery line I have in my _Layout.cshtml (I only want this code to execute when is called by the controller, not when the page loads, I need some kind of function??) 这是我在_Layout.cshtml中拥有的jquery行（我只希望该代码在控制器调用时执行，而不是在页面加载时执行，我需要某种功能？）

<script>
    $("#drpdown").addClass("open");
</script>

Then in my HomeController.cs I want to call the jquery code when a user fails to authenticate or when the ModelState is not valid (I guess when the view is returned to the page). 然后在我的HomeController.cs中，当用户验证失败或ModelState无效时（我想将视图返回到页面时），我想调用jquery代码。

[HttpPost]
public ActionResult Index(UserAccount user)
{
    if (ModelState.IsValid)
    {
        //Authenticate User
        ...
        //User Failed to Authenticate
        ...
        return View(user); //**FIRE UP JQUERY**
    }

    return View(user); //**FIRE UP JQUERY**
}

Is this possible? 这可能吗？ What would be the best way to tackle this? 解决这个问题的最佳方法是什么？

Code requested : 要求的代码 ：

UserAccount.cs UserAccount.cs

namespace ProfessionalDev.Models
{
    public class UserAccount
    {
        [Required(ErrorMessage = "Required Field")]
        public string email { get; set; }

        [Required(ErrorMessage = "Required Field")]
        public string password { get; set; }

        public string FirstName { get; set; }
        public string MiddleName { get; set; }
        public string LastName { get; set; }

        public bool AddOpenClass { get; set; }

        public UserAccount() { }
    }
}

HomeController.cs HomeController.cs

[HttpPost]
public ActionResult Index(UserAccount user)
{
    if (ModelState.IsValid)
    {
        //Authenticate User

        //User Failed to Authenticate
        user.AddOpenClass = true;
        TempData["alert"] = "alert-danger";
        TempData["error"] = "Email or Password Incorrect";
    }

    user.AddOpenClass = true;
    return View(user);
}

_Layout.cshtml _Layout.cshtml

@model ProfessionalDev.Models.UserAccount

<!DOCTYPE html>
<html>
<head>
...
<ul class="nav navbar-nav navbar-right">
    <li><a href="#">New User</a></li>
    <li class="dropdown" id="drpdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Log In <span class="caret"></span></a>
        <ul class="dropdown-menu">
            <li>
                @Html.Partial("_Errors")

                @using (Html.BeginForm("Index", "Home", FormMethod.Post))
                {
                    @Html.ValidationMessageFor(model => model.email)
                    @Html.TextBoxFor(model => model.email, new { @class = "form-control", @placeholder = "Email" })

                    @Html.ValidationMessageFor(model => model.password)
                    @Html.PasswordFor(model => model.password, new { @class = "form-control", @placeholder = "Password" })

                    <input type="submit" value="Submit" class="btn btn-primary" />
                }
            </li>
            <li role="separator" class="divider"></li>
            <li><a href="#">Forgot Password?</a></li>
        </ul>
    </li>
</ul>
...
    @if (Model.AddOpenClass)
    {
    <script>
       $(function(){
            $("#drpdown").addClass("open");
       });
    </script>
    }

</body>
</html>

Answer 1

In your action method, set a variable to ViewBag which you can access in your Layout page and execute the JS as neeeded 在您的操作方法中，将变量设置为ViewBag，您可以在“布局”页面中访问该变量，并根据需要执行JS

[HttpPost]
public ActionResult Index(UserAccount user)
{
    ViewBag.ShouldExecuteJs = true;
    if (ModelState.IsValid)
    {
        //Authenticate User
        ...
        //User Failed to Authenticate
        ...
        return View(user); //**FIRE UP JQUERY**
    }
    return View(user); //**FIRE UP JQUERY**
}

In Layout, read this value and use that for determining whether you want to execute the js code 在Layout中，读取此值并将其用于确定是否要执行js代码

<script type="text/javascript">
   $(function(){
      var shouldExecuteJs="@ViewBag.ShouldExecuteJs";
      if(shouldExecuteJs)
      {
        $("#drpdown").addClass("open");
      }
   });
</script>

Answer 2

You should add a property to your user model that is returned to the view. 您应该将属性添加到返回视图的用户模型中。 This is a better approach than using viewbag, tempdata, etc because it allows you to have a strongly typed model. 与使用viewbag，tempdata等相比，这是一种更好的方法，因为它允许您使用强类型模型。

[HttpPost]
public ActionResult Index(UserAccount user)
{
    if (ModelState.IsValid)
    {

        //User Failed to Authenticate
        if(auth.failed)
        {
            //You might have a property specifically for authentication like this:
            user.failedToAuthenticate = true;

            // Or you could have a generic error message property that you display when not null
            user.errorMessage = "Authentication Failed!";

            return View(user); 
        }
    }
}

And then in your View 然后在您看来

 @if(Model.failedToAuthenticate)
 {
    // Fire your jQuery
    <div class="alert-danger">@Model.errorMessage</div>
 }

or

@if(!string.IsNullorEmpty(Model.errorMessage))
{
    //Display error message
}

从Controller ASP.NET MVC返回View时调用jquery代码

问题描述

2 个解决方案

解决方案1
0 已采纳 2015-10-22 19:28:22

解决方案2
0 2015-10-22 19:35:59

从Controller ASP.NET MVC返回View时调用jquery代码

问题描述

2 个解决方案

解决方案1 0 已采纳 2015-10-22 19:28:22

解决方案2 0 2015-10-22 19:35:59

解决方案1
0 已采纳 2015-10-22 19:28:22

解决方案2
0 2015-10-22 19:35:59