Question

我正在创建一个包含搜索属性的页面。用户将在搜索字段中输入一个数字并点击提交按钮。我需要能够调用控制器方法才能运行搜索代码。

现在我只想尝试点击部分页面以获得一些功能。下面是我到目前为止的代码。截至目前，单击按钮时没有任何反应。我听说Ajax是可以使用的，所以我一直在玩那个。我还在学习框架，所以请耐心等待。

<div class="span6 roundedCorners">
    <div class="row-fluid Title">
        <div class="span6">
            Search Area
        </div>
    </div>
    <div class="row-fluid individual">
        <div class="row-fluid">
            <div class="span4"><span class="pull-right fieldDescription">Number</span></div>
            <div class="span8"><input /></div>
        </div>
        <div class="row">
            <div class="span12" id="adminSubmitButton">
                @using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "_adminDetails" }))
                {
                    <button type="submit" class="btn btn-inverse">Submit</button>
                }
            </div>
        </div>
    </div>

Answer 1

您的表单为空，只有一个提交按钮。您需要在表单中移动搜索按钮。像这样：

模型

public class SearchModel
{
    [Required]
    public string Query { get; set; }
}

查看

@model SearchModel

...
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "_adminDetails" }))
{
   @Html.EditorFor(m => m.Query)
   @Html.ValidationMessageFor(m => m.Query)
   <button type="submit" class="btn btn-inverse">Submit</button>
}

<div id="_adminDetails"></di>

注意：确保您拥有ID为_adminDetails

的元素

您的控制器必须采取模型并执行搜索。例如：

控制器

 [HttpPost]
 public ActionResult Index(SearchModel model)
 {
    //do something with your model (perform search)
    return View(results);
 }

Answer 2

好吧，我现在部分工作了。当我单击按钮时，我可以使用以下方法调用控制器方法：

function adminButton()
        {
            $("#adminDetails").load("@Url.Action("ControllerMethod", "ControllerName")");
        }

@ Url.Action助手允许我调用返回局部视图的方法。这是朝着正确方向迈出的一步。但是根据我正在阅读的内容，我应该可以使用以下的Url助手而不是@ Url.Action：

"@Url("ControllerMethod", "ControllerName")/" + submitButton.Value

我尝试了一些变化，我仍然在做一些阅读以找出解决方案。是否有帮助我这样做？

Answer 3

感谢帮助人员。我最终在星期五晚上解决了我的问题。基本上我所做的是在JS / jQuery和Razor @ Url.Action（）的帮助下点击按钮时加载部分页面来调用返回PartialView的控制器方法：

<script type="text/javascript">
    function adminButton()
    {
        var link = "@Url.Action("ControllerMethod", "ControllerClass", new { 
                                         number = -1})";

        var num = parseInt($("#number").val());

        link = link.replace(-1, num);

        $("#details").load(link);
    }
</script>

MVC 4单击按钮以获取部分页面

3 个答案: