Question

我对笔记的局部视图我正在尝试进行内联编辑，保存按钮只运行一次，但在第一次提交后停止工作。这是我的观看代码：

<h4>Notes</h4>
<table class="table">
    @foreach (var note in Model)
    {
        <tr>
            <td style="width:150px;">@Html.DisplayFor(modelItem => note.CreatedOn)</td>
            @if (ViewData["ShowNoteType"] == null || ((bool)ViewData["ShowNoteType"] == true)) 
            { 
                <td style="width:120px;">@Html.DisplayFor(modelItem => note.NoteType)</td>
            }

            <td class="readOnlyProperty" data-note-id=@note.NoteID>@Html.DisplayFor(modelItem => note.LoggedBy)</td>
            <td class="readOnlyProperty" data-note-id= @note.NoteID>@Html.DisplayFor(modelItem => note.Text)</td>

                @using (Ajax.BeginForm("Edit", new { id = note.NoteID }, new AjaxOptions { HttpMethod = "POST", Url = "/Notes/Edit", UpdateTargetId = "noteslist", OnComplete = "OnNotesListReloaded" }, new { @role = "form", @class = "form-inline" }))
                {
                    @Html.AntiForgeryToken()
                    <td class="editableProperty" style="display:none;" data-note-id=@note.NoteID>
                        <div class="form-group">
                            @Html.EnumDropDownListFor(modelItem => note.LoggedBy, htmlAttributes: new { @class = "form-control" })
                        </div>
                     </td>
                    <td class="editableProperty" style="display:none;" data-note-id=@note.NoteID>
                        <div class="form-group">
                            @Html.EditorFor(modelItem => note.Text, new { htmlAttributes = new { @class = "form-control" } })
                        </div>
                     </td>

                        @Html.HiddenFor(modelItem => note.NoteID)
                        @Html.HiddenFor(modelItem => note.CandidateID)
                        @Html.HiddenFor(modelItem => note.JobID)
                        @Html.HiddenFor(modelItem => note.ContactID)
                    <td class="editableProperty" style="display:none;" data-note-id=@note.NoteID>
                        <button type="submit" class="btn btn-default btn-sm save-note" title="Save">
                            <span class="glyphicon glyphicon-save" aria-hidden="true" />
                        </button>
                    </td>
                }


            <td><a class="btn btn-default edit-note" data-note-id=@note.NoteID ><span class="glyphicon glyphicon-edit" aria-hidden="true" /></a></td>
            <td class="deletebutton" data-note-id=@note.NoteID>
                @using (Ajax.BeginForm("Delete", new { id = note.NoteID }, new AjaxOptions { HttpMethod = "POST", Url = "/Notes/Delete", UpdateTargetId = "noteslist", OnComplete = "OnNotesListReloaded" }, new { @role = "form", @class = "form-inline" }))
                {
                    @Html.AntiForgeryToken()

                    <input type="hidden" name="id" value="@note.NoteID" />
                    <input type="hidden" name="CandidateID" value="@ViewData["CandidateID"]" />
                    <input type="hidden" name="JobID" value="@ViewData["JobID"]" />
                    <input type="hidden" name="ContactID" value="@ViewData["ContactID"]" />

                    <button type="submit" class="btn btn-default btn-sm" title="Delete Note">
                        <span class="glyphicon glyphicon-trash" aria-hidden="true" />
                    </button>
                }
            </td>
        </tr>
    }
</table>

    @section Scripts {

    @Scripts.Render("~/bundles/custom")
}

保存按钮只能完美运行一次。我必须将下拉列表和编辑器放在单独的<td>中，而不是将整个Ajax表单放在<td>中，以便在编辑时将它们对齐。当我将整个Ajax.Beginform放在<td>中时，它工作得很完美，但它根本不对齐。所以任何人都可以帮助我使保存按钮工作，字段对齐，

这是我的jquery代码：

var OnNotesListReloaded = function () {

    $(".edit-note").click(function (event) {

        var elem = $(this).attr("data-note-id");
        $(".edit-note[data-note-id=" + elem + "]").hide();
        $(".readOnlyProperty[data-note-id=" + elem + "]").hide();
        $(".editableProperty[data-note-id=" + elem + "]").show();
        $(".deletebutton[data-note-id=" + elem + "]").hide();

    });
}

$(document).ready(function () {

    OnNotesListReloaded();

});

Answer 1

您可以使用其他方法执行此操作。让我们从UI开始行动。
第1步： 仅在＆＃34; For Loop＆＃34;的旁边创建一个表单。并将操作设置为＆＃34; / Notes / EditDelete＆＃34;，不用担心我们将在下一步中创建一个动作。
第2步： 现在使用按钮使用名称中的动作，您也可以传递id以及正在编辑或删除的记录。

            //Find start time of today's day
            var todayLocalizedStart = todayLocalized.startOf('day');

            for (var i = 0; i < checkins.length; i++) {
                var checkinDaylocalized = moment(checkins[i].get("checkInDate")).utcOffset(timeZoneDifference);

                //Find start time of checkIn day
                var checkinDaylocalizedStart = checkinDaylocalized.startOf('day');

                //Find number of days
                var daysago = todayLocalizedStart.diff(checkinDaylocalizedStart, 'days');
                // console.log("daysago = " + daysago);

                days_array.push(daysago);
            }

第3步： 现在创建动作过滤器

<input type="submit" value="Edit" name="action:Edit" class="btn btn-sm btn-default" />
<input type="submit" value="Delete" name="action:Delete" class="btn btn-sm btn-danger" />

第4步：在您的操作上方使用此过滤器：

[AttributeUsage(AttributeTargets.Method, AllowMultiple = false, Inherited = true)]
    public class MultipleActionsAttribute : ActionNameSelectorAttribute
    {
        public string Name { get; set; }
        public string Argument { get; set; }

        public override bool IsValidName(ControllerContext controllerContext, string actionName, MethodInfo methodInfo)
        {
            var isValidName = false;
            var keyValue = string.Format("{0}:{1}", Name, Argument);
            var value = controllerContext.Controller.ValueProvider.GetValue(keyValue);

            if (value != null)
            {
                controllerContext.Controller.ControllerContext.RouteData.Values[Name] = Argument;
                isValidName = true;
            }
            return isValidName;
        }
    }

Ajax.Beginform仅运行一次

1 个答案: