1

表示してviewいるフォームと呼ばれるものがあり、dropdownlist. に別の選択がある場合、次のdropdownlistように呼び出される jquery があります。

    $(document).ready(function () {
        $("#myDropDownList").change(function () {
            $.ajax({
                url: '/Home/Forms/' + $("#myDropDownList option:selected").val(),
                type: 'GET',
                success: function (data) {
                // refresh div
                }
            });
        });
    });

これが私のフォームビューです：

    @model myProject.ViewModels.PageView

    @section JavaScript
    {
       <script type="text/javascript" src="@Url.Content("/Scripts/jquery.myJQuery.js")"></script>
    }

    @Html.DropDownList("myDropDownList", Model.selectList)

    <div id="somediv">
       @Html.Label(Model.ValueThatShouldChange)
    </div>

したがって、Formsアクションが再度呼び出されるとValueThatShouldChange、ビューモデルが変更され、div. これが、そのdivを更新したい理由ですが、その方法がわかりません。

試してみ$('#yourdivID').html(data)ましたが、ビュー全体が div に読み込まれます。

4

5 に答える 5

3

最も簡単な方法は、load()関数を使用して、必要なページの特定の部分だけをロードすることです。そのidを使用して選択します。例えば：

$("#yourDivId").load("/Home/Forms/ #" + $('#myDropDownList option:selected').val())

Web ページの作成方法 (その情報を提供しない) によっては、必要なコンテンツを読み込むためのパラメーターを含めることで、Ajax 呼び出しを変更することもできます。例えば：

$(document).ready(function () {
    $("#myDropDownList").change(function () {
        $.ajax({
            url: '/Home/Forms/' + $("#myDropDownList option:selected").val(),
            data: { id : $('#myDropDownList option:selected').val() }
            type: 'GET',
            success: function (data) {
               $('div#yourDivId').html(data);
            }
        });
    });
});

そして、あなたのページでは、IDに基づいて必要なコンテンツを出力するだけです（PHPの場合）：

<? if (isset($_POST['id'])) {
      if ($_POST['id'] == "somediv") { ?>
         <div id="somediv">Just this content should be loaded</div>
   <? }
   }
   else { ?>
     <!-- your regular html... -->
?  }   ?>
于 2013-01-10T15:00:34.660 に答える
2

使用できます

$('#yourdivID').html(data)

また

$('#yourdivID').text(data)

コールから返される内容に応じて

于 2013-01-10T14:59:31.213 に答える
1 
$(document).ready(function () {
        $("#myDropDownList").change(function () {
            $.ajax({
                url: '/Home/Forms/' + $("#myDropDownList option:selected").val(),
                type: 'GET',
                success: function (data) {
                  $("div").html(data);
                }
            });
        });
    });
于 2013-01-10T15:00:25.860 に答える
0

おい。これは最も小さく、最も速い答えです! :-)

やりたいことは、jQuery ショートカット $.load() http://api.jquery.com/load/を使用することです。

$(function() {  // <-- shortcut for $(document).ready
    $("#myDropDownList").on('change', function () { 
        $('#target-div').load('/Home/Forms/' + $("#myDropDownList option:selected").val());
    });
});

#target-div は、ターゲット div の CSS セレクターです。合わせてチェンジ。

于 2013-01-10T14:59:43.257 に答える
0

divのコンテンツを再描画するだけの場合は、使用できます

$('#yourdivID').change();
于 2013-01-10T15:00:48.217 に答える