MVCは他の選択に基づいてドロップダウンを動的にロードします

Question

私はMVCを使用しています。私は1つの値が別の値に依存する2つのドロップダウンをしたいと思います。さらに、2つのドロップダウンの組み合わせに基づいて、対応するIDが保存されました。

私はドロップダウン一つは、私はドロップダウン二つのことを持っている任意のモデルになりたいの選択をオフに基づいて製造業者のリストで持ちたい

から成るコードテーブルを有しますメーカーとして次に、これらのドロップダウンが使用されているレコードを保存すると、その組み合わせに割り当てられたManufacturerModelIDが記録されます。これは可能ですか？

Answer 1

私がよく理解していれば、アプリケーションにMVCモデルを適用したいと考えています。

「はい」の場合は、何も実装できません。ビューとコントローラからモデルを分離するだけです。

あなたの場合、私は "オブジェクト指向"のJavaScriptに行くだろう。オブジェクト内のモデルを分離すると、MVC自体の理解に役立ちます。 "MANUFACTUREAPP"のような名前空間の下のすべてをプログラミングすることも役に立ちます。

1）モデル
a）this.description、this.models = []のようなフィールドを持つオブジェクト "Manufacturer"が必要です。次に、セッター、ゲッター、そしてあなたの魔法の機能が必要です。したがって、最終的にgetManufacturer（）のようなもう1つの関数は、このメーカが持つすべてのオブジェクトでオブジェクトを取得します。
b）this.model、this.modelDescription、this.manufacturerID = []、setters、getters、initとすべてのファンキーな機能を持つ "ManufacturerModel"が必要です。だから今、あなたのアプリがMVCアーキテクチャをサポートしていることをあなたが誇りにすることができ

onManufacturerClick = function(){ 
    manufacturersModels = MANUFACTUREAPP.manufacturers.getMeWhatIwant(howIwantIt); 
} 

：ビュー 用

2）a）は次のような機能を持つあなたの「ビュー」オブジェクトが必要です。
3）コントローラーについては、同じ概念に従ってください。

init = function(){ 
    MANUFACTUREAPP.manufacturers = new MANUFACTUREAPP.init(); 
} 

二優しいアドバイス：あなたのメインで

あなたは同様にあなたのinit関数で、あなたのオブジェクトを作成します。 MVCを理論的に調べるには、それを100％理解していなければ難しいかもしれません。そして私の最善のアドバイスは...あなたがペンギンとエネルギーを節約したいなら、ペンをつかんで前にモデルを描くことです！

EDITはただとにかく、私はここにいることを去るつもりだ.. asp.netタグに気づきました。私はasp.netに精通していないが、理論は同じでなければならないと思う。

Answer 2

これはjQueryとajaxを使って行うことができる。

あなたのカミソリビューは、このようなマークアップをレンダリングすると仮定します。

<select name="Manufacturer" id="Manufacturer"> 
    <option value="1">Aaaaa</option> 
    <option value="2">Bbbbb</option> 
    <option value="3">Ccccc</option> 
</select> 
<select name="Model" id="Model"> 
</select> 

今最初のselect要素の変更イベントをリッスンし、選択されたオプションの値を取得し、AJAXを使用してサーバーに送信され、あなたのページにこのJavaScriptを持っています。あなたのサーバーアクションメソッドがモデルをメーカーIDに属するものとして返すようにします。お使いのモデルのアクションメソッドを想定し

$(function(){ 

    var urlForModesl = "/Manufacturer/Models"; 
    $("#Manufacturer").change(function(){ 
     var manufacturerId= $(this).val(); 
     $.getJSON(urlForModesl,function(data){ 
      var modelsHtml=""; 
      $.each(data,function(a,b){ 
       modelsHtml+="<option value='"+b.Id+"'>"+b.Name+"</option>"; 
      });   
      $("#Model").html(modelsHtml); 
     }); 
    }); 


}); 

は、JSON形式のIDと名前プロパティを持つオブジェクトのリストを返します。

public ActionResult Models(int id) 
{ 
    var list= db.ModelManufactors.Where(s=>s.ManufacturerId==id) 
      .AsEnumerable() 
      .Select(s=> new { Id=s.ManufacturerModelId, Name=s.Name}).ToList(); 
    return Json(list,JsonRequestBehaviour.AllowGet); 
}