0

私のHTMLテーブルには、チェックボックス、開始日、終了日があります

チェックボックスのIDをそのレコード/行のプライマリケイとして設定しました

チェックボックスをクリックすると、対応するレコードの終了日テキストボックスが日付ピッカーにバインドされ、日付を変更できます

最後にテーブルの複数のレコードに対してこれを行うことができます ボタンをクリックすると、この選択された行IDとその編集された終了日の値をコントローラーに送信したい

私のコード全体でこれを行うことができますが、問題は、最後に更新された値のみがコントローラーに送信され、すべての値が送信されるわけではないことです

これが私のコードです:

 <div class="cell" style="width:auto;"> 
  <input type="checkbox" name="chkbox" class="a"   value="" data-id="@item.ID" onclick="checkbox1(@item.ID)"/> 
 </div> 
 <div class="cell" style="width:auto;">
  @Html.DisplayFor(modelItem => item.StartDate,  new { id = "strtDate" })
 </div>               
 <div class="cell" id="edit2-@item.ID" style="width:auto;">
  @Html.DisplayFor(modelItem => item.EndDate, new { id = "endDate" })
 </div>
 <div class="cell" id="edit1-@item.ID" style="width:auto; display:none;">
  @Html.TextBox("Enddate", item.EndDate, new { @class = "date", id = "date-" + @item.ID })
</div>

div edit2-@itemID を非表示にし、チェックボックスのクリックで edit1-@itemID を表示し、datepicker をバインドしています

    function checkbox1(index) {
    var divname =index;
    $("#edit1-" + divname).toggle();
    $("#edit2-" + divname).toggle();
    $("#date-" + divname).datepicker({ yearRange: "-0:+13",
        changeMonth: true,
        changeYear: true,
        dateFormat: 'dd-mm-yy',
        onSelect: function (dateText, inst) {
            var test = dateText + "," + divname;
            alert(test);
            $(".a:checked").attr('data-id', test);
        }
    });
}

チェックボックスの ID を「id-newenddate」の組み合わせとして設定しようとしましたが、選択したすべてのチェックボックスに最近の日付が割り当てられています。

以下は、 wen ボタンがクリックされたというコードです

$("#button1").click(関数 () {

    var selected = $(".a:checked").map(function () {
        return $(this).data('id');
    }).get();
    var urlDistricts = '@Url.Action("EditExhi")';
    $.ajax({
        type: "POST",
        datatype: 'integer',
        url: urlDistricts,
        traditional: true,
        data: { listofid: selected},
        success: function (result) {

        }
    });

コントローラーで：

     [HttpPost]
    public ActionResult EditExhi(List<int> listofid)
    {

    }

この問題を解決し、id-date の組み合わせをコントローラーに送信するにはどうすればよいですか?

私を助けてください。

4

1 に答える 1

0

チェックボックスとアイテムを一致させる必要があります。

ビュー モデルにインデックスを追加します。

public class YourViewModel
{
    public int Index {get;set;}
    public IEnumerable<YourItemType> Items {get; set; }

    // other fields
}

ビューで使用します。

 @foreach(var item in Model.Items)
 {
    <div class="cell" style="width:auto;"> 
        <input type="checkbox" name="chkbox[@Model.Index]" class="a" value="true" data-id="@item.ID" onclick="checkbox1(@item.ID)"/> 
    </div> 
    <div class="cell" style="width:auto;">
        @Html.DisplayFor(modelItem => item.StartDate,  new { id = "strtDate" })
    </div>               
    <div class="cell" id="edit2-@item.ID" style="width:auto;">
        @Html.DisplayFor(modelItem => item.EndDate, new { id = "endDate" })
    </div>
    <div class="cell" id="edit1-@item.ID" style="width:auto; display:none;">
        @Html.TextBox("Enddate[" + Model.Index + "]", item.EndDate, new { @class = "date", id = "date-" + @item.ID })
    </div>
    <input type="hidden" name="Id[@Model.Index]" value="@item.ID" /> 
    @{Model.Index = @Model.Index + 1}
}

次に、投稿アクション用の新しいビュー モデルを作成します。

public class PostModel
{
    bool chkbox { get; set; }
    string EndDate {get;set; }
    string Id { get; set; }
}

次に、アクションでこれを行います：

[HttpPost]
public ActionResult EditExhi(PostModel[] items)
{
    foreach (var item in items)
    {
        if (item.chkbox)
            //update db here with item.EndDate & item.Id
    }
}
于 2012-08-31T07:23:07.277 に答える