0

ここに画像の説明を入力数値でドロップダウン リストを選択し、選択した値を使用して、エンティティ テーブルに追加する必要があるオブジェクト リストのサイズを決定できるようにしたいと考えています。リストを初期化するためのカウントを取得できませんでした。また、ユーザーが別のアイテムを選択するたびに部分ビューを更新する必要があります。ユーザーが最初に 3 を選択し、パーシャルに div の 3 つのブロックが含まれていたが、後で選択を 1 に変更した場合、パーシャルには 1 つのブロックのみを含める必要があるとします。私はさまざまな方法を試してきましたが、運がありません。どんな助けでも大歓迎です。

これが私がこれまで行ってきたことです: ajax呼び出しのためのjQuery:

$(function () {
    $('#drpSelect').change(function () {
        $.ajax({
            type: 'GET',
            url: '/EduKate/_Test',
            data: null,
            success: function (data) {
                $("#result").append(data);                    
            }
        });
        return false;    
    });
});

落ちる：

    <select id="drpSelect">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                </select>

Create.cshtml ファイルのターゲット div

    //some other html helpers for other properties ...
//where I want the partial
        <div id="result"></div>

部分ビュー: _Course.cshtml

@model List<EduKate.DataModel.Course>

@foreach (var item in Model)
{
    <div class="course">
    @Html.LabelFor(model => item.CourseID)
    @Html.TextBoxFor(model => item.CourseID)

    @Html.LabelFor(model => item.Credits)
    @Html.TextBoxFor(model => item.Credits)

    @Html.LabelFor(model => item.Title)
    @Html.TextBoxFor(model => item.Title)
    </div>
}

Course ビューで部分ビューをレンダリングするための ActionResult:

 public ActionResult _Test(int value)
    {            
        EdukateViewModel edukateViewModel = new EdukateViewModel();
        //
        for(int i = 0; i < value; i++)
        {
            Course course = new Course();
            edukateViewModel.CourseList.Add(course);
        }
        return PartialView("_Course", edukateViewModel.CourseList);
    }

Create アクションの Get メソッドと Post メソッド

 public ActionResult Create()
    {
        return View();
    } 

    [HttpPost]
    public ActionResult Create(EdukateViewModel edukateViewModel)
    {
        try
        {
            //List<course> property in viewmodel is always null
            edukateRepository.Insert(edukateViewModel);
            return RedirectToAction("Index");
        }
        catch(Exception exp)
        {
            return View();
        }
    }
4

1 に答える 1

0

div が更新されなかった理由は、ドロップダウン コードを含む div 全体を置き換えたと思われるため、イベント境界が失われたためです。代わりに jquery 'on' API を使用してイベントをバインドします。

$(function () {
    $(document).on('change','#drpSelect',function () {
        $.ajax({
            type: 'GET',
            url: '/EduKate/_Test',
            data: null,
            success: function (data) {
                $("#result").append(data);                    
            }
        });
        return false;    
    });
});
于 2012-07-25T06:22:31.143 に答える