Каскадный выпадающий список со статическими данными - PullRequest
Новая
       11

Каскадный выпадающий список со статическими данными

0 голосов
/ 12 марта 2012

Мне нужно разработать два выпадающих списка в моем проекте MVC3, где первый выпадающий список будет управляться дБ и на основе данных, выбранных при первом выпадающем списке, мой второй выпадающий список должен измениться. Второй выпадающий имеет жесткий код и значение. Как я мог достичь этого. пожалуйста помогите 

Following is my codebased

viewmodel

public IEnumerable<SelectListItem> ProductTypeCode{ get; set; }
public int? ProductID { get; set; }


public IEnumerable<SelectListItem> ProductGroupCode;
public int? ProductGrpID { get; set; }

Controller

public ActionResult Index()     {         
var model = new MyViewModel         
{             
// TODO: Fetch those from your repository ,
model.ProductTypeCode= new SelectList(obj.ProductTypeCode as                   System.Collections.IEnumerable, "Value", "DispalyText");
return view(model);

}

VIEW


@Html.DropDownListFor(m => m.ProductID , Model.ProductTypeCode, "ALL" , new { @class = "DropDownList" })</td>

Мой вопрос основан на приведенном выше раскрывающемся списке productType, мне нужно заполнить еще один раскрывающийся список под названием «ProductGroup», который имеет жестко заданное значение. в зависимости от раскрывающегося списка ProductType значение группы товаров должно измениться.

1 Ответ

0 голосов
/ 13 марта 2012

У вас есть несколько вариантов.

  1. Вы можете написать свой собственный javascript для обработки события onchange.На эту тему есть буквально тысячи простых уроков. Этот , вероятно, ответит на ваш вопрос наилучшим образом.

  2. Вы можете использовать расширения, такие как Telerik. Они относительно просты, хорошо документированы, но у них есть дополнительный вес другой библиотеки (хотя разметка, которую они генерируют, довольно тонкая).

Если вы выберете вариант 1 и напишите свой собственный, две основные вещивам нужно будет добавить дополнительное действие контроллера и немного javascript.

javascript будет прослушивать события изменений в выпадающем списке идентификаторов вашего продукта.Поместите это в функцию готовности документа на самой странице. 

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

    // Get the product id selected
    var id = $(this).val();

    // Fire off an ajax request to get the groups
    $.ajax({
        // whatever the url may be.
        url: "@Url.Action("Groups")" + id, // Append the id to the url.
        dataType: "json",
        type: "POST",
        error: function() {
            alert("An error occurred.");
        },
        success: function(data) {
            var items = "";
            $.each(data, function(i, item) {
                items += "<option value=\"" + item.Id+ "\">" + item.Name + "</option>";
            });

            // Set the secondary dropdown content to the newly created
            // list of options.  Use whatever Id your secondary is.
            $("#ProductGroup").html(items);
    });

Действие контроллера отвечает на вызов ajax со списком соответствующих групп продуктов. 

public class ProductsController : Controller
{
    public ActionResult Groups(int id)
    {
        // You only need the id and a name field in the response, not the
        // entire object.
        var groups = _myService.FindGroupsForProductId(id)
            .Select(g => new 
            {
                Id = g.Id, 
                Name = g.Name
            });

        // Return a json result.  You only need to re
        return Json(groups);
    }
}

Приведенный выше код долженпомочь вам начать.Предполагается несколько вещей, которые вы вообще не показывали в своем коде.Ваш вопрос получил отрицательную оценку, потому что сначала вы не опубликовали код.Тогда код, который вы опубликовали, на самом деле не показывает, что вы приложили какие-то усилия, чтобы найти решение самостоятельно.Найдите несколько уроков по jquery, их тысячи, и если у вас есть конкретные проблемы, приведите их здесь.

...