Question

以下是我的看法......您可以看到网格已从View模型中填充

 for (int i = 0; i < Model._effGrid.Count; i++)
    {
            <div id="gridRow@(i)" class="row">

                <div class="col-md-1">
                    @Html.CheckBoxFor(m => m._effGrid[i].chkBox, new { id = ("chkGridRow" + i), @unchecked = true })
                    @*<input type="checkbox" id="chkBox@(i)" />*@
                </div>

                <div class="col-md-2">
                    @Html.DropDownListFor(m => m._effGrid[i].iterationId, new SelectList(Model.Iterations, "Value", "Text", Model._effGrid[i].iterationId), new { id = ("drpIteration" + i) })

                </div>
                <div class="col-md-2">
                    @Html.DropDownListFor(m => m._effGrid[i].PhaseID, new SelectList(Model.Phases, "Value", "Text", Model._effGrid[i].PhaseID), new { id = ("drpPhase" + i) })
                </div>

                <div class="col-md-2">
                    @Html.DropDownListFor(m => m._effGrid[i].ActivityID, new SelectList(Model.Activities, "Value", "Text", Model._effGrid[i].ActivityID), new { id = ("drpActivity" + i) })
                </div>
                <div class="col-md-2">
                    @*<input id="dtEffort@(i)" type="date" class="textwidth90percent texthieght10percent" value="@Model._effGrid[i].EffortDate.ToString("yyyy-MM-dd")">*@
                    @*@Html.EditorFor(m => m._effGrid[i].EffortDate)*@
                    @Html.TextBoxFor(m => m._effGrid[i].EffortDate, Model._effGrid[i].EffortDate.ToString("yyyy-MM-dd"), new { type = "date", @class = "textwidth90percent texthieght10percent" })

                </div>

                <div class="col-md-1">
                    @Html.TextBoxFor(m => m._effGrid[i].Hours, new { id = ("hours" + i), @class = "textwidth60percent" })
                </div>

                <div class="col-md-1" style="visibility: hidden">
                    @Html.TextBoxFor(m => m._effGrid[i].effortid)
                </div>

            </div>
        counter = i;
    }
        }

用户可以选择检查chkbox并单击上面的按钮... UPON我需要选中已选中的复选框并获取相应的数据以便在ajax调用中发送。

<script type="text/javascript">
    $(document).ready(function () {
        $("#SaveEffortChanges").click(function (e) {
            debugger;
  @foreach (var item in Model._effGrid)
                {
                    var it = item;


            if (it.chkBox)
                    {
                          UpdateEffortDetail(it.effortid, it.iterationId, it.ActivityID, it.PhaseID, it.EffortDate, it.Hours);
                    } 


                }

            //$("#EffortForm").submit(e.data)
        });
 }
        );

在上面的js函数中，UpdateEffortDetail只是一个ajax调用。我希望现在的问题更清楚了，如果你需要进一步的投入，请告诉我。

Answer 1

将网格行放入ID为“ divGrid ”的Div中，以便我们可以在javascript代码中轻松访问它。

    <script type="text/javascript">
    $(document).ready(function () {
        $("#SaveEffortChanges").click(function (e) {

          $("#divGrid").find('input[type=checkbox]:checked').each(function(){

            var row = $(this).closest('div.row');
            var effortid = row.find('input[name*="effortid"]').val();
            var iterationId = row.find('input[name*="iterationId"]').val();
            var ActivityID = row.find('input[name*="ActivityID"]').val();
            var PhaseID = row.find('input[name*="PhaseID"]').val();;
            var EffortDate = row.find('input[name*="EffortDate"]').val();
            var Hours = row.find('input[name*="Hours"]').val();

            //Use Ajax method to call your Update method on Server side with above updated data
          });

        });
 }
        );

</script>

此脚本将从网格中获取其复选框已选中的所有行，然后我们在该复选框上循环，找到它的父行。从父行我们找到要更新的数据。

这是您获取更新的行数据的方法。

如果您了解逻辑，可以更简化此代码。

Answer 2

这里有两种选择;要么没有元素将chkbox设置为true（在这种情况下，我们不应该期望任何输出），或者//code看起来很荒谬，足以欺骗处理器尝试运行服务器端;你可以尝试给它<text>提示：

@foreach (item in Model.grid)
{
    if (item.chkbox)
    {
        <text>
        //code
        </text>
    }
}

在javascript函数中使用razor代码

2 个答案: