使用jQuery asp.net mvc使用下拉列表在2个视图之间导航

时间:2014-07-22 13:21:26

标签: asp.net-mvc-4

window.location.href无法导航到我选择的视图

这是我的js:

<script type="text/javascript">

$(document).ready(function () {
    $('#submitButton').click(function () {

        var temp = $("#dropDownList option:selected").val();

        if (temp == "person")
            window.location.href = "http://localhost:1284/Home/Person";
        if (temp == "job")
            window.location.href = "http://localhost:1284/Home/Job";
    });

});
</script>

@Html.BeginForm()

    <select id="dropDownList">
        <option value="person">Person</option>
        <option value="job">Job</option>
    </select>

    <button id="submitButton">Choose</button>

我可以使用@html.actionlink吗?或任何其他解决方案

2 个答案:

答案 0 :(得分:0)

你不需要@ Html.BeginForm(),这会将当前页面提交给自己......所以,以下应该可以工作..

 <div>
   <select id="dropDownList">
    <option value="person">Person</option>
    <option value="job">Job</option>
  </select>
 <button id="submitButton">Choose</button>
</div>

<script type="text/javascript">
$(document).ready(function () {
    $('#submitButton').click(function () {

      var temp = $("#dropDownList option:selected").val();
      if (temp == "person") window.location.href = "http://localhost:1284/Home/Person";
      if (temp == "job")  window.location.href = "http://localhost:1284/Home/Job";

     });
    });
 </script>

答案 1 :(得分:0)

控制器负责决定要渲染的视图。您必须为控制器的操作而不是视图本身设置Url重定向。

以下是在javascript中使用服务器端助手@Url.Action生成此URL的方法。

$(function () {
  $('#submitButton').click(function () {

    var temp = $("#dropDownList option:selected").val();

    var urlPerson = '@Url.Action("Person", "Home")'; // Home:Controller, Person:Action
    var urlJob = '@Url.Action("Job", "Home")'; // Home:Controller, Job:Action

    if (temp == "person")
        window.location = urlPerson;
    if (temp == "job")
        window.location = urlJob;
  });
});

'@Html.ActionLink'将生成整个<a>代码

var result = '@Html.ActionLink("Link", "Person", "Home")';

上面的代码将生成

<a href="/Home/Person">Link</a>