0

ビュー全体を変更せずにコンテンツを変更するビューがあります（ビューの一部を変更します）。これが私のコードです。

モデル：

public class DisplayData
{
    public int ID { get; set; }
    public DisplayData(int ID)
    {
        this.ID = ID;
    }
}

コントローラー：

    public ActionResult PartialDemo(string Data)
    {
        List<DisplayData> Display = new List<DisplayData>();

        if (Request.IsAjaxRequest())
        {
            if (Data == "1")
            {
                Display.Add(new DisplayData(3));
                Display.Add(new DisplayData(4));
            }
            else
            {
                Display.Add(new DisplayData(5));
                Display.Add(new DisplayData(6));
            }
            return PartialView("PartialDemoUC", Display);
        }
        else
        {
            Display.Add(new DisplayData(1));
            Display.Add(new DisplayData(2));
            return View("PartialDemo", Display);
        }
     }

PartialDemoUC.cshtml

 @model IEnumerable<dynamic>

 @foreach(var items in Model)
 {
     @items.ID    
 }

PartialDemo.cshtml：

  @model IEnumerable<AppTwitter.Models.DisplayData>
  @{
      ViewBag.Title = "PartialDemo";
   }

   <script src="../../Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"> </script>
    @Ajax.ActionLink("**Link_1**", "PartialDemo", "PartialDemo", new {Data= "1" }, new   AjaxOptions { UpdateTargetId = "rsvpmsg" })
    @Ajax.ActionLink("**Link_2**", "PartialDemo", "PartialDemo", new {Data= "2" }, new   AjaxOptions { UpdateTargetId = "rsvpmsg" })

    <div id="rsvpmsg">
    @{ Html.RenderPartial("PartialDemoUC", this.Model);}
    </div>

変更Link_1します。チェックすると、リンクがクリックLink_2されたようになります。どうcheckbox:すればよいですか？chechbox

英語が下手でごめんなさい。

4

1 に答える 1

1

標準のチェックボックスを使用できます。

@model IEnumerable<AppTwitter.Models.DisplayData>
@{
    ViewBag.Title = "PartialDemo";
}

<div data-url="@Url.Action("PartialDemo", "PartialDemo")" id="checkboxes">
    @Html.CheckBox("Data1", new { data_value = "1" })
    @Html.CheckBox("Data2", new { data_value = "2" })
</div>

<div id="rsvpmsg">
    @{Html.RenderPartial("PartialDemoUC", this.Model);}
</div>

次に、別のjavascriptファイル（参照する必要があります）.change()で、これらのチェックボックスのイベントをサブスクライブし、AJAXリクエストをトリガーします。

$(function () {
    $('#checkboxes :checkbox').change(function () {
        var value = $(this).data('value');
        var isChecked = $(this).is(':checked');
        var url = $('#checkboxes').data('url');
        $.ajax({
            url: url,
            type: 'POST',
            data: { data: value, isChecked: isChecked },
            success: function (result) {
                $('#rsvpmsg').html(result);
            }
        });
    });
});

これで、コントローラーアクションは2つのパラメーターを取り、どのチェックボックスがクリックされたか、その値がチェックされているかチェックされていないかを知ることができます。これは、リンクとは対照的に、チェックボックスが2つの可能な状態を持つ可能性があるためです。

public ActionResult PartialDemo(string data, bool isChecked)
{
    ...
}

ああ、ヘルパーjquery.unobtrusive-ajax.min.jsを使用しなくなった場合は、スクリプトは不要になります。Ajax.*

于 2012-06-22T09:28:48.317 に答える