如何在同一视图中获取剃刀文本框的值？

Posted 2023-02-23

【中文标题】如何在同一视图中获取剃刀文本框的值？

【英文标题】：How do get value of razor textbox in the same view?

【发布时间】：2016-03-08 15:55:36

【问题描述】：

我在 Razor 视图页面中使用 `@html.Textbox("searchString")。我需要

中的文本框的这个值

@Html.ActionLink("View Items", "Index", new  id = item.transaction_id, searchString = "Value of textbox").

当然，html 操作链接中的搜索字符串部分现在不工作，但我需要这个，因为我有根据搜索字符串工作的特定路线。

如何将文本框的值传递给操作链接？

我检查了这个this,this,this 和this。

我尝试的是

<script type = "text/javascript">
var value = document.getElementbyID("searchString").Text;
var link =  @Html.ActionLink("View Items", "Index", new  id = item.transaction_id, searchString = -1);
link.replace(-1,value);
</script>

仍然没有运气。我了解 Razor 在服务器端呈现。

更新

我在视图顶部有以下文本框：

    @using (Html.BeginForm("Index", "trans_junction", FormMethod.Get))

<p>
    Request No: @Html.TextBox("searchString")
    <span><input type="submit" value="Search Request" /></span>
</p>

此文本框是用户可以在其中搜索项目的搜索框。

有一个Action链接如下：

 @Html.ActionLink("View Items", "Index", new  id = item.transaction_id ) |

还有一个路由配置：

public class RouteConfig

    public static void RegisterRoutes(RouteCollection routes)
    
        routes.IgnoreRoute("resource.axd/*pathInfo");

        routes.MapRoute(
            name: "Default",
            url: "controller/action/id/searchString",
            defaults: new  controller = "Home", action = "Index", id = UrlParameter.Optional, searchString= UrlParameter.Optional 
        );
    

现在我需要通过 actionlink 将值作为我的路线图传递。正如 StephenMuecke 在回答中所建议的那样，我尝试用 @using (Html.BeginForm("Index", "trans_junction", new id = item.transaction_id , FormMethod.Get)) 修改我的 @using (Html.BeginForm("Index", "trans_junction", FormMethod.Get)) 但那里无法访问项目。

当用户点击搜索按钮时，url为http://localhost:57286/trans_junction/Index?searchString=20

如果用户点击操作链接 url 是 http://localhost:57286/trans_junction/Index/88

但我真正需要的是http://localhost:57286/trans_junction/Index/88/20

保留搜索结果并传递id。

我正在添加屏幕截图以便更好地理解。

这是没有搜索的索引视图。

这是 searchString = 10 的搜索结果。

这是在单击操作链接（即查看项目）之后，此处不保留搜索结果。

【问题讨论】：

当您最后尝试了该代码时，结果如何？实际的客户端 JavaScript 是什么样子的，它执行时 value 和 link 变量中的内容是什么？我强烈怀疑当代码尝试执行时，您的浏览器控制台显示 JavaScript 错误。你一定要看看那个。

如果您使用将文本框放入表单（使用FormMethod.Get）并将提交按钮的样式设置为看起来像您想要的链接（无需脚本），您会发现这要容易得多.但是您的脚本所做的只是更新href 属性。您需要取消默认重定向，然后调用location.href=url;

@StephenMuecke 我需要一个文本框值，我可以通过操作链接传递它，以便它匹配 routeconfig 路由。

您不需要操作链接 - 将文本框放入表单中（使用 FormMethod.Get 并将其提交给 GET 方法。

@StephenMuecke 我使用 @Html.beginform 和 FormMethod.Get 覆盖，现在我得到这种 url：localhost:57286/trans_junction/Index/74?searchString=52，正如你所见，我需要将 id 与搜索字符串一起传递。如果我像这样输入 url，localhost:57286/trans_junction/Index/74/52，我会得到想要的结果，但我不知道如何为这种 url 创建链接。所以我试图通过操作链接传递它。

【参考方案1】：

与其手动尝试使用 javascript 操作链接，不如使用带有method="get" 的表单。在你的循环中

@using (Html.BeginForm("Index", "trans_junction", new  id = item.transaction_id , FormMethod.Get))

    @Html.TextBox("SearchString")
    <button type="submit">View Items"</button> // style as a link if desired

这将进行 GET 调用

[HttpGet]
public ActionResult Index(int id, string searchString)

假设你有一个特定的路由定义

url: "trans_junction/Index/id/searchstring",
defaults: new  controller = "trans_junction", action = "Index" 

编辑（基于更新的问题详情）

当您返回过滤结果时，您还需要将searchString 的值传递回视图，以便可以在ActionLink() 方法中使用in 来生成路由值，例如

ViewBag.Filter = searchString;
return View(....);

然后修改链接到

@Html.ActionLink("View Items", "Index", new  id = item.transaction_id, searchString = ViewBag.Filter )

【讨论】：

正好我有相同的路线。我现在正在测试。

只要确保该路由在您的路由定义中排在首位。如果您收到.../trans_junction/Index/74?searchString=52，则表明它在默认路由之后

我现在看到你只有一个文本框（它改变了一切）。我将在一个小时左右重写答案以解决这个问题（基本上当您根据搜索字符串呈现新结果时，您需要将搜索字符串传回视图（例如使用ViewBag.Filter = searchString;）并创建使用@Html.ActionLink("View Items", "Index", new id = item.transaction_id, searchString = ViewBag.Filter )的链接

@Html.ActionLink("View Items", "Index", new id = item.transaction_id, searchString = ViewBag.Filter ) 按预期工作。简单直观。如果您正在编写答案如果有更多细节，我会接受。

现在没时间，但我会在一小时或两小时内更新答案。

【参考方案2】：

您需要在事件上设置值，例如单击 ActionLink，否则您如何知道要在 Actionlink 中替换的 searchString 文本框的值。在您的页面上添加此 javascript。

$(function()
    $("#myLink").click(function()
        var link = $(this).attr("href");
        link.replace(-1, $(#searchString).val());
        var link = $(this).attr("href", link);
    );
);​​​​

你的 Razor 视图操作链接需要是

@Html.ActionLink("View Items", "Index", new  id = item.transaction_id, searchString = "-1")

【参考方案3】：

试试：

  @
     var value = Request.Form["inputID"];
    

附言当有人输入searchString 时，您为什么不使用表单而不是链接并提交表单？

无论谁否决了这个答案，您都可以争论原因或提出更好的解决方案？因为在他的情况下，searchString = Request.Form["inputID"]; 应该按照他的要求去做。

【讨论】：

您似乎误解了这个问题。 OP 正在询问如何获取 input 值 client-side 并将其添加到链接中。 Request.Form 运行服务器端。