如何使用Dropdown和Partial View过滤数据?

时间:2016-02-19 02:48:29

标签: jquery asp.net-mvc

好的。我在MVC应用程序中尝试做的是在视图中显示表名称,国家等,它确实有效。现在,我试图使用下拉列表过滤它。下拉列表确实已填充。问题是我的动作结果没有从jQuery调用。我可能会出错的任何想法?

提前多多感谢。

这是我的模特

public partial class tblDropdownFilter
{
    public int ID { get; set; }
    public string Name { get; set; }
    public string Country { get; set; }
    public System.DateTime Birthdate { get; set; }
}

这是我的控制器

public class HomeController : Controller
{ 

   public ActionResult Index()
   {       
        DropdownFilterSampleEntities dfse = new DropdownFilterSampleEntities();
        ViewBag.Names = new SelectList(dfse.tblDropdownFilters, "ID", "Name");
        var a = dfse.tblDropdownFilters.ToList();
        return View(a);
    }

    public ActionResult GetNames(int id)
    {
        DropdownFilterSampleEntities dfse = new DropdownFilterSampleEntities();
        var a = dfse.tblDropdownFilters.Where(x => x.ID == id).ToList();
        return PartialView("_GetNames",a);
    }
}

以下是我的观点。

@model IEnumerable<SampleDropdownFilter.Models.tblDropdownFilter>
@{
ViewBag.Title = "Index";
}

<table class="table table-striped">
    <thead>
        <tr>
            <th>Name</th>
            <th>Country</th>
            <th>Date of Birth</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var items in Model)
        { 
         <tr>
        <td>
            @items.Name
        </td>
        <td>
            @items.Country
        </td>
        <td>
            @items.Birthdate
        </td>
        </tr>
        }
    </tbody>
</table>

@Html.DropDownList("Names", "Select a name")

<div id="target"></div>

<script type="text/javascript">
    $(document).ready(function () {
        $("#Names").change(function () {
            type: 'get',
            url: '@Url.Action("GetNames")',
            dataType: 'html',
            data: { id: $(this).val() },
            success: function (result) {                   
                $("#target").html(result);
            },
            error: function (ex) {
                alert("Error");
            }
        });
    });
</script>

最后,这是我的部分观点。名称是_GetNames.cshtml

@model SampleDropdownFilter.Models.tblDropdownFilter

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Country</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>@Html.DisplayFor(x=>x.Name)</td>
            <td>@Html.DisplayFor(x => x.Country)</td>
        </tr>
    </tbody>
</table>

1 个答案:

答案 0 :(得分:0)

@frozenmirage在你的剧本中尝试这个..

    $(document).ready(function () {

       $("#Names").change(function () {

            var myVal = $(this).val();

            $.ajax({
                cache: false,
                type: "GET",
                url: '@Url.Action("GetNames", "Home")?id=' + myVal,
                success: function (response) {
                    $('#target').html(response);
                },
                failure: function (response) {
                    alert("Failure");
                }
            });
        });
    });
</script>