如何引用Razor表达式创建的控件？MVC搜索传参问题

其实啊，你遇到的这个问题核心在于：ActionLink是服务器端渲染页面时生成的静态HTML链接，这时候用户还没在搜索框里输入内容呢，所以没法直接把动态输入的值塞到ActionLink的参数里。想要实现点击链接时传递搜索框的输入值，得靠客户端脚本或者换一种更适配的实现方式，给你两种常用方案：

方案一：用JavaScript动态处理跳转 #

给你的搜索框和ActionLink加上ID，然后通过JS监听点击事件，获取输入值后构造正确的跳转URL：

视图代码： #

@using (Html.BeginForm())
{
    <!-- 给搜索框加ID，方便JS获取 -->
    <input type="text" id="searchInput" name="searchTerm" placeholder="请输入搜索关键词" />
    <!-- 给ActionLink加ID，绑定点击事件 -->
    @Html.ActionLink("执行搜索", "Search", "Home", null, new { id = "searchLink" })
}

对应的JavaScript代码： #

// 监听搜索链接的点击事件
document.getElementById('searchLink').addEventListener('click', function(e) {
    // 阻止默认的链接跳转行为
    e.preventDefault();
    
    // 获取搜索框的输入值
    var searchValue = document.getElementById('searchInput').value.trim();
    
    if (searchValue) {
        // 构造跳转URL，替换成你的控制器名和Action方法名
        var targetUrl = '@Url.Action("Search", "Home")' + '?searchTerm=' + encodeURIComponent(searchValue);
        // 跳转到目标地址
        window.location.href = targetUrl;
    } else {
        // 可选：提示用户输入内容
        alert('请先输入搜索关键词哦');
    }
});

方案二：用表单提交代替ActionLink（更推荐） #

其实MVC里的表单本来就适合处理这类提交场景，直接把ActionLink换成提交按钮，完全不需要JS：

视图代码： #

<!-- 指定表单提交的Action和控制器，用Get方法把参数拼在URL里 -->
@using (Html.BeginForm("Search", "Home", FormMethod.Get))
{
    <input type="text" name="searchTerm" placeholder="请输入搜索关键词" />
    <button type="submit">执行搜索</button>
}

控制器代码（接收参数）： #

public ActionResult Search(string searchTerm)
{
    // 在这里处理你的搜索逻辑，比如根据searchTerm查询数据
    // ...
    
    return View();
}

两种方案对比：

• 方案二更简单直观，符合MVC的表单设计逻辑，不需要额外写JS；
• 方案一更灵活，适合需要自定义跳转逻辑、输入验证的场景。

内容的提问来源于stack exchange，提问作者Andrew B Schultz