0

このjavascriptを使用して、作成ビューにカスケードドロップダウンが機能しています

<script type="text/javascript">
      $(document).ready(function () {
      $("#GaCatId").change(function () {
        var id = $(this).val();
        $.getJSON("/Gallery/GetSubCategories/", { id: id },
        function (data) {
            var select = $("#GaSCatId");
            select.empty();
            select.append($('<option/>', {
                value: 0,
                text: "Select a Sub Category"
            }));
            $.each(data, function (index, data) {

                select.append($('<option/>', {
                    value: data.Value,
                    text: data.Text
                }));
            });
        });
    });
});    

これを編集して、カミソリ ビューの編集で、データベースのデフォルトの ID レコードに基づいてサブリストにデータが入力されるようにします。実際には、ID があるかどうかコードをチェックするようにしています

4

1 に答える 1

0

できることは、firstdropdownsがアイテム値を選択したかどうかを確認し、それが有効な場合は、別のajax呼び出しを行って、2番目のドロップダウンのデータを取得してロードすることです。ページに2つのドロップダウンが存在すると仮定すると、

$(function(){

  var gaCatId=$("#gaCatId").val();  
  if(gaCatId!="") 
  {
     var items="";
     $.getJSON("@Url.Action("GetSubCategories","Gallery")/"+gaCatId,
                                                                 function(data){
           $.each(data, function (index, item) {
             items+="<option value='"+item.Value+"'>"+item.Text+"</option>";
           });
        $("#GaSCatId").html(items);
     });
  }   

});

これは機能するはずです。しかし、それが編集画面の場合、アクションメソッド自体からこれをロードしてみませんか?私はそれをします。

製品ページを編集していると仮定します。だからあなたはこのようなビューモデルを持っているかもしれません

public class ProductVM
{
  public int ID {  set;get;}
  public string Name { set;get;}
  public List<SelectListItem> Categories { set;get;} 
  public List<SelectListItem> SubCategories { set;get;}
  public int SelectedCategoryID { set;get;}
  public int SelectedSubCategoryID { set;get;}
}

編集GETアクションメソッドで、

public ActinResult Edit(int id)
{
  var vm=new ProductVM { ID=id};
  Product product=repo.GetProductFromID(id);
  vm.Name=product.Name;
  vm.Categories=GetAvailableCategories();
  vm.SelectedCategoryID=product.Category.ID;
  vm.SubCategories=GetSubCategories(product.Category.ID);
  vm.SelectedCategoryID=product.SubCategory.ID;
  return View(vm);
}

と仮定するGetAvailableCategoriesGetSubCategories、のリストを返す2つのメソッドですSelectListItem

private List<SelectListItem> GetAvailableCategories()
{
  //TO DO : read from repositary and build the list and return.
}

そしてあなたの見解では、ProductVMクラスに強く型付けされています

@model ProductVM
@using(Html.Beginform())
{
   @Html.HiddenFor(x=>x.ID)
   @Html.EditorFor(x=>x.Name)
   @Html.DropDownListfor(x=>x.SelectedCategoryID ,
                                      Model.Categories,"select")
   @Html.DropDownListfor(x=>x.SelectedSubCategoryID,
                                      Model.SubCategories,"select")
  <input type="submit" />

}
于 2013-02-04T02:23:32.350 に答える