1

私は自分自身を結び目で結びます-そして、大きな一歩を踏み出し、基本に戻ることが最善だと思いました。

私はViewModelを使用する必要があることを理解しているので、それを構築しようとしています。

私のデモアプリには4つのセクションがあります（フォームの4つの異なる部分に記入する必要があります）。

  1. ユーザーから日付/日数を取得
  2. そのデータを使用してデータベースにクエリを実行し、適格なレコードのリストを返します（これらはそれぞれTypeIDの一意のIDを持ちます）。また、これらのそれぞれについて、2つの動的DropDownListが関連付けられている必要があります（各リストのListBox3は、TypeID3（およびそのID）に対応します。
  3. その後、ユーザーは動的に入力されたドロップダウンリストからエクストラを選択できるようになります
  4. ユーザーの名前/追加/電話が収集されます

ViewModelがどのように見える/保持する必要があるかについての私の「ビュー」は次のとおりです。

ここに画像の説明を入力してください

私のviewModelは次のようになっているはずです。

public class SearchViewModel
    {
        public DateTime Date{ get; set; }
        public int Days { get; set; }
        public IQueryable<TypeID> TypeIDs { get; set; }
        public IQueryable<LB1Item> LB1Items { get; set; }
        public IQueryable<LB2Item> LB2Items { get; set; }
        public IQueryable<Extras> Extras { get; set; }
        public string Name { get; set; }
        public string Add { get; set; }
        public string Tel { get; set; }
        public string email { get; set; }
    }

まず第一に、これは私が上で説明したもののViewModelを構築する方法ですか？ドロップダウンボックスについてはよくわかりません。各フォームについて、選択した日付に基づいて、取得したTypeIDごとに1、2、3 .... 10、11、12が存在する可能性があります。

LB1ItemおよびLB2Itemの各ドロップダウンボックスには、選択した値を各行のTypeIDに対して保存する必要があります。

これは、1つのドロップダウンのクラスがどのように見えるかを私が考えるものです。

public class LB1Item
{
        public String TypeName { get; set; }
        public long TypeID { get; set; }
        public int NumSelected { get; set; }
        public int TypeCount { get; set; }
        public IEnumerable<SelectListItem> CarsAvail 
        {
            get
            {
                return new SelectList(
                    Enumerable.Range(0, TypeCount+1)
                    .OrderBy(typecount => typecount)
                    .Select(typecount => new SelectListItem
                    {
                        Value = typecount.ToString(),
                        Text = typecount.ToString()
                    }
                ), "Value", "Text");
            }
        } 
}

それも大丈夫ですか？それとも、私が達成しようとしていることを複雑にしすぎていますか？

また、各ステージ（1、2、3、4）の後にデータをPOSTして戻した後、選択した値をViewModelにアクティブに入力し、それをビューに渡して、次のデータを取得できるようにします。次のステップ。

最終的には次のようなものになります。

Date: 01/09/2012
Days: 4
{ List:
   TypeID:    3059   ListBox1: 2   ListBox2: 8748,
   TypeID:    2167   ListBox1: 7   ListBox2: 2378,
   TypeID:    4983   ListBox1: 4   ListBox2: 5873
}
{List:
   ExtraID:  4324,
   ExtraID:  3878,
   ExtraID:  4872,
   ExtraID:  7698,
   ExtraID:  2873
}
Name: Mark
Add: My town
Tel: 0912378
Email: me@me.com

ヘルプ/ポインタ/サンプルをありがとう...

マーク

4

1 に答える 1

1

このタイプのソリューションでは、レンダリングする各セクションを個別のビューとして分離し、Jquery ajaxメソッドを使用して Ajax 呼び出しを使用します。また、 KnockoutJSを使用してクライアントのビューを処理します。そのため、基本的に 2 つの ViewModel を使用します。1 つはクライアントの JavaScript にあり、もう 1 つは MVC にあり、クライアントからの Ajax 呼び出しに対して必要な部分を JSON として返すためのものです。ビューのセクション 1 はユーザーによってクライアントに入力されるため、コントローラー側では必要ありません。セクション 1 は、基本的にセクション 2 のクエリに使用されるデータです。返されるリストをクエリしないため、コレクションを IQueryable にする必要はありません。コントローラー側の ViewModel は次のようになります。

public class Section2
{
    public List<TypeID> TypeIDs { get; set; }
    public List<LB1Item> LB1Items { get; set; }
    public List<LB2Item> LB2Items { get; set; }
}

public class Section3
{
    public List<Extras> Extras { get; set; }
}

public class Section4
{
    public string Name { get; set; }
    public string Add { get; set; }
    public string Tel { get; set; }
    public string email { get; set; }
}

そのため、実行される手順は、ユーザーが日付と曜日を入力したというイベントがスローされると、入力されたデータと日付を使用して Ajax 呼び出しがコントローラーに返され、セクション 2 に入力される情報を照会することです。コントローラーは Section2 ViewModel を JSON として返し、Knockout を使用して HTML でレンダリングされます。次に、ユーザーがセクション 2 のリストから選択すると、セクション 3 に入力するために必要な情報を返すためにコントローラーに再度クエリを実行するイベントがスローされ、サイクルが繰り返されます。

Knockout を使用して、ここでやろうとしていることを正確に実行する優れた例があります。

于 2012-08-08T13:45:29.330 に答える