如何筛选下拉列表基于previous选择 [英] How to filter drop down list based on previous selection

查看:100
本文介绍了如何筛选下拉列表基于previous选择的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有两个表,即国家和Country.These两个是在我看来,页面下拉菜单。
我使用的是独立的查询显示他们每个人的下拉值。
在表中状态我有STATEID和countryid。
我需要根据国家选择过滤状态值。
我甚至有一个名为表一个主表它由州和国家的id
以下为i用于显示方式,

I am having two tables namely State and Country.These two are dropdowns in my view page. I am displaying dropdown values of each of them using an independent query. In table State i am having stateid and countryid. I need to filter state values based on country selection. And i even have a main table called Table which consists of ids of both state and country The following is the way i used to display,

enter code here

//为了得到状态值

//To get state values

var query = (from i in dbContext.countries

                     join j in dbContext.States on i.Country_id equals j.Country_id

                     where j.State_id >= 0
                     select new
                     {
                         state = j.State_name}).ToArray//To get state values

在此输入code

enter code here

  var str = (from li in dbContext.countries

                           where li.Country_id >= 1
                           select new
                           {

                               country = li.Country_name}).ToArray();//To get country

我怎么能查询是过滤全光照值主表表。我是书面查询面临的问题进行过滤
这可能使用LINQ查询?
请建议我如何做到这一点
谢谢

And how can i query be for filtering the values usin main table "table".i am facing problem in writing query for filtering Is this possible using linq query ? Please suggest me how to do this Thanks

推荐答案

这可以以不同的方式来实现的。一种方法是让服务器时第一个下拉改为通过Ajax返回的有效选项的筛选列表。

This can be accomplished in different ways. One way is to get the server to return a filtered list of valid options via Ajax when the first dropdown is changed.

例如,假设这样的场景:有两个DropDownLists图。一个用国家和其它各国。直到一个国家选择与各国的DropDownList默认为空或禁用。

For example, assume this scenario: a View with two DropDownLists; one with countries and the other with states. The DropDownList with states is empty and disabled by default until a country is selected.

所以,你可以在你的控制器,这动作:

So you could have this Action in your controller:

public ActionResult Index()
{
    ViewBag.Country = new [] {
        new SelectListItem() { Text = "Venezuela", Value = "1" },
        new SelectListItem() { Text = "United States", Value = "2" }
    };
    return View();
}

和这样的观点:

<div class="editor-field">
    @Html.DropDownList("Country")
    @Html.DropDownList("State", Enumerable.Empty<SelectListItem>(), "States", new { @disabled = "disabled" })
</div>

现在在你的控制器中添加一个POST操作。它接收所选国家的ID,并返回一个包含状态的过滤列表JSON:

Now add a POST action in your controller. It receives the ID of the selected country and returns JSON containing a filtered list of states:

[HttpPost]
public ActionResult StatesByCountry(int countryId)
{
    // Filter the states by country. For example:
    var states = (from s in dbContext.States
                  where s.CountryId == countryId
                  select new
                  {
                      id = s.Id,
                      state = s.Name
                  }).ToArray();

    return Json(states);
}

的最后一件事是客户端code。本例使用jQuery和建立对国家下拉这就要求通过Ajax的新控制器的动作变化事件侦听器。然后,它使用返回的值更新国家的DropDownList。

The last thing is the client-side code. This example uses jQuery and sets up a change event listener on the country dropdown which calls the new controller action via Ajax. It then uses the returned values to update the 'State' DropDownList.

$(document).ready(function () {
    $('#Country').change(function () {
        $.ajax({
            url: '/Home/StatesByCountry',
            type: 'POST',
            data: { countryId: $(this).val() },
            datatype: 'json',
            success: function (data) {
                var options = '';
                $.each(data, function () {
                    options += '<option value="' + this.id + '">' + this.state + '</option>';
                });
                $('#State').prop('disabled', false).html(options);
            }
        });
    });
});

这篇关于如何筛选下拉列表基于previous选择的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆