如何从视图 (MVC) 上的输入控件获取值

How to get value from an input control on a View (MVC)

我正在开发小型 mvc 应用程序,有一点我需要来自控制器方法的值, 我的计划是将该值存储在 ViewBag 中并在 View 上获取它,所以我接下来做了:

ViewBag.SuccessBody = "This is a test";

然后在我的 Razor View 上我接下来做了什么:

<input id="customInput" type="hidden" value='@(ViewBag.SuccessBody)' />

//出于测试目的,我也尝试了下面的示例..

<input id="customInputAgain" type="hidden" class="form-control" value="@(ViewBag.SuccessBody)">

当视图加载时,我试图获取一个值,所以我这样写:

 <script>

        $(document).ready(function () {
            var customVal = $("#customInput").val();
            var customValAgain = $("#customInputAgain").val();

            alert(customVal);
            alert(customValAgain);

        });
</script>

我什至尝试添加

alert(customVal.value);

alert(customValAgain.value);

但它也不起作用,所以看起来我没有从我的 Controller/ViewBag 中检索值,这是原因 为什么警报总是显示空 space - 什么都没有。

编辑:

我在编辑我的文章时设置这个 ViewBag 值,实际上是在 [HttpPost] EDIT 上,所以当用户单击保存更改时 [HttpPost] EDIT 方法被调用并且数据可能被插入数据库时我正在设置 ViewBag 值并将用户重定向到相同的 [HttpGet] Edit 方法。这是它的样子:

[HttpPost]
public ActionResult Edit(ArticleEditViewModel model)
{
            if (ModelState.IsValid)
            {
                //Rest of the code
                ViewBag.SuccessBody = "This is a test";
                return RedirectToAction("Edit/" + product.Id, "Article");
            }
            else
            {
              return View("NotFound");
            }
            return View(model);
}

大家可以看到,我定义了 ViewBag,但我无法获取应存储在输入控件中的视图的值。

可能是因为我在 HttpPost Action 方法中定义了一个 ViewBag,而不是在 HttpGet 我来自哪里 "opening the view" ?

我会使用 .attr(),因为我更喜欢明确知道我的目标是什么:

var customVal = $("#customInput").attr("value");

至于服务器端,请确保 ViewBag.SuccessBody 已实际声明并且 return 已声明。

public ActionResult FooAction()
{
    ViewBag.SuccessBody = "This is a test";
    return View();
}

还要确保您return从正确的操作方法 ViewBag.SuccessBody 到相应的视图。

更新

根据您的编辑:您正在重定向到不同的操作(编辑 [HttpGet] 操作),因此显然 ViewBag.SuccessBody 未在此处定义。为什么不直接将 bool? editSuccess 参数传递给 [HttpGet] Edit 方法,指示编辑是否成功?

[HttpGet]
public ActionResult Edit(int id, bool? editSuccess)
{
    if (editSuccess.HasValue) 
    {
         if (editSuccess)
         {
             // edit was successful here
            ViewBag.SuccessBody = "Yay! :)";
         }
         else
         {
            // edit was unsuccessful here
            ViewBag.SuccessBody = "No! :(";
         }
    } 
    // other stuff
    return View();
}

您的 [HttpPost] 操作将变为:

[HttpPost]
public ActionResult Edit(ArticleEditViewModel model)
{
    if (ModelState.IsValid)
    {
        // ...
        RedirectToAction("Edit", new { id = product.Id, editSuccess = true });
    }
    else
    {
        // ...
    }
}

使用这种方法,您还可以通过将 editSuccess 设置为 false 来指定编辑何时可能失败。如果您只是对将任何值传递回视图感兴趣,则跳过所有 editSuccess 部分并从 [HttpGet] 操作中简单地 return ViewBag.SuccessBody,而不是 [HttpPost]一个.

旁白:显然,由于 editSuccess 是可选的,并且您只是在 editSuccess 实际具有值时将 ViewBag.SuccessBody 设置为某个值,因此您可以在视图中执行此检查以在 HTML:

中判断是否输出
@if (!string.IsNullOrEmpty(ViewBag.SuccessBody)) 
{ 
    // not empty, do something
} 

您可以为此使用临时数据

 [HttpPost]
    public ActionResult Edit(ArticleEditViewModel model)
    {
        if (ModelState.IsValid)
        {
            //Rest of the code
            TempData["SuccessBody"] = "This is a test"; ;
            return RedirectToAction("Edit/" + product.Id, "Article");


        }
        else
        {
            return View("NotFound");
        }
        return View(model);
    }

并且在你的 get 方法中使用这个

if (TempData["SuccessBody"] != null && TempData.ContainsKey("SuccessBody"))
                ViewBag.SuccessBody = Convert.ToString(TempData["SuccessBody"]);