Блог

Я использую BeginCollectionItem для динамического добавления элементов в список. Если я попытаюсь щелкнуть по недавно добавленной строке, приложение немедленно остановится и перенаправит меня на страницу входа в систему. Если я удаляю уже существующий элемент, он удаляет его из базы данных, затем удаляет из пользовательского интерфейса, а затем перенаправляет меня на страницу входа в систему. Если элемент добавлен недавно, он даже не запускает код в delete.onClick при всех других действиях, но оба они в конечном итоге перенаправляют меня на экран входа в систему.

У меня была аналогичная проблема при попытке добавить div, и мне сказали добавить:

                 e.preventDefault();
                e.stopImmediatePropagation();
 

Я попробовал это, но это не помешало моему приложению остановиться и перенаправить его на страницу входа в систему. Вот мой код удаления:

     $("a.deleteRow").on("click", function (e) {

    var container = $(this).closest('.editorRow');
    var id = container.data('id');
    var $t = $(this);

        $.ajax({
            type: "POST",
            url: "@Url.Action("Delete","Request", new { area = "" })",
            data: { CommentId: id },
            success: function (e) {
                $t.parents("div.editorRow:first").remove();
                e.preventDefault();
                e.stopImmediatePropagation();
            }
        })

    return false;
});
 

Вот частичный вид:

 @using (Html.BeginCollectionItem("Comments"))
{
        <div class="row editorRow" data-id="@Model.Id" style="padding-bottom:10px">
            @Html.HiddenFor(x => x.Id)

            <div class="col-xl-2">
                @if (Model.CreatorName == "" || Model.CreatorName == null)
                {
                    Html.DisplayFor(x => x.CreatorName, (string)@ViewBag.UserName);
                }
                else
                {
                    @Html.DisplayFor(x => x.CreatorName)

                }
            </div>
            <div class="col-xl-8">
                @Html.TextAreaFor(x => x.Comment, new { @class = "form-control" })
            </div>
            <div class="col-xl-2">
                <a href="#" class="deleteRow">delete</a>
            </div>
        </div>
}
 

вот код удаления в контроллере:

         public ActionResult Delete(int CommentId)
    {
        service.DeleteComment(CommentId);
        return Content(""   CommentId);

    }
 

Обновить:

После ввода кода удаления в document.ready часть ajax, удаляющая существующую строку, теперь работает нормально. Однако попытка добавить и удалить строку без предварительного сохранения этой строки по-прежнему приводит к перенаправлению. Новый код удаления, который теперь работает с «существующей» строкой, выглядит следующим образом:

    $(document).ready(function () {
    $("a.deleteRow").on("click", function (e) {

        var container = $(this).closest('.editorRow');
        var id = container.data('id');
        var $t = $(this);

        $.ajax({
            type: "POST",
            url: "@Url.Action("Delete","Request", new { area = "" })",
            data: { CommentId: id },
            success: function (e) {
                $t.parents("div.editorRow:first").remove();
                return false;
            }
        })

        return false;
    });
});
 

Я новичок в jQuery и пытаюсь понять, а также заставить мой проект работать.

Глядя на код, я не вижу, что это перенаправление связано с jquery. Можете ли вы взглянуть на действие RequestController и удалить. Скорее всего, ваше действие удаления в контроллере выполняет перенаправление в этом случае после того, как оно удалило запись из базы данных.