0

ここで Ajax のヘルプを探しています...

非常に複雑なViewModelに基づいて構築された非常に複雑なビューがあります。

このページには 3 つの列があり、各列は完全な旅を表し、それを分割して個々のフライトを表示します。

各フライトは、詳細 (開始場所と終了場所、出発時間、到着時間、オペレーターなど) を含むボックスで表されます。ボックスには、この場所から利用できる他のすべてのフライトのドロップダウン リストも含まれています (たとえば、ハングしたい場合があります)。空港周辺でさらに 6 時間かかるので、後のフライトを選択できます!)

とにかく、可能なフライトを 1 つ変更することで、列全体を更新する必要があります。後のフライトに乗ると、その後のフライトができなくなる可能性があるためです。

これが私の質問につながります-複雑なビューモデルをjQuery経由でコントローラーに戻すことは可能ですか? foreach ループ内にネストされた部分ビューを使用して実行できますか? 私がやりたいのは、ajax経由で列を更新することだけですが、ビューモデルを戻す方法がわかりません。ページ全体のリロードを避けるようにしています

プロセスの短縮コードを次に示します。

ビューのコード (index.cshtml) - jQuery はメイン ビュー内にあります。

@foreach (var item in Model)
{
    <div id="column-@groupCount">
        @Html.Partial("_JourneyColumnPartial", item)
    </div>
}

<script type="text/javascript">
    $(".flightItem").change(function (event) {
        alert(event.target.id);
        var cSelected = $(this).val();
        alert(cSelected);
        $.ajax({
            url: "/Search/GetChangeInfo",
            contentType: "application/json",
            type: "POST",
            dataType: "json",
            data: ({ cID: cSelected }),
            success: function (display) {
            }
        });
    });
</script>

最初の部分ビューのコード (_JourneyColumnPartial.cshtml)

<div class="routeContainer">
    @Html.Partial("_ColumnItemPartial", Model)
</div>

子部分ビューのコード (_ColumnItemPartial.cshtml)

@{
    int journeyNumber = 1;
}
@foreach (var journey in Model.SelectedJourneys)
{
    List<JourneyDetails> list = Model.Journeys.Where(j => j.JourneyDateAndTimeID != journey && j.DepartureID == hub.DepartureID && j.ArrivalID == hub.ArrivalID).OrderBy(j => j.JourneyDateAndTime).ToList();
    <div class="box">
        <div class="journeytimes">
            <b>Depart</b> @hub.DepartureDate<br />
            <b>Arrive</b> @hub.ArrivalDate<br />
        </div>
        <div class="boxcontrols">
            <select class="flightItem" id="flightItem_@{<text>@Model.ColumnNumber</text><text>_</text><text>@journeyNumber</text>}">
                @foreach (var flight in list)
                {
                    <option value="@flight.JourneyID">@flight.ProviderName - @flight.JourneyDateAndTime</option>                                                    
                }                                            
            </select>

        </div>
        <!-- end of box -->
    </div>
    journeyNumber++;    
    <!-- end of box wrap -->
}

ViewModel に関する詳細を含めていないことは承知していますが、非常に複雑で、他のクラスの一般的なリストが含まれているため、非常に大きくなります。ajax/jQueryのトリガーはドロップダウンリストの変更イベントです。

これがまったく意味をなさない場合は、遠慮なく言ってください。私が探しているものを明確にしようとします!

ありがとう

4

2 に答える 2

1

jquery呼び出しでデータをjsonとして送信することで可能です。

これを実現するには、ViewModel のような JavaScript オブジェクトを作成し、その JavaScript オブジェクトをJson.Stringifyメソッドで文字列に変換し、文字列値をdataajax 呼び出しで に設定します。

于 2012-05-21T17:38:20.033 に答える
0

問題がデータの送信にあるのか、それを返すことにあるのかはわかりませんが、これは ajax 経由で返すのに役立ちます: http://www.klopfenstein.net/lorenz.aspx/render-partial-view-to-string -in-asp-net-mvc

于 2012-05-21T17:41:09.720 に答える