Используя C # .Net Core, как передать содержимое текстового поля модальному - PullRequest
0 голосов
/ 08 ноября 2019

В настоящее время я работаю над представлением (в веб-приложении C # .Net Core 2.1), которое должно иметь текстовое поле «Строка поиска» и кнопку «Добавить элемент», которая должна открыть модальное окно, которое будет иметьсписок всех элементов (из базы данных), соответствующих строке поиска, с кнопкой «Выбрать» или ссылкой для добавления элемента.

Но я затрудняюсь понять, как передатьтекстовое поле приводит к модальному действию.

Примечание: я знаю, что у меня есть обходной путь, в котором я мог бы закодировать его как совершенно отдельный вид / действие (т.е. не модальное), возможно, добавив логику к существующемуФорма отправки действия, но было бы неплохо, если бы я мог сохранить модальную идею.

Вот код того, что я пробовал до сих пор (но безрезультатно):

Контроллер:

    public IActionResult AddItem(string SearchString)
    {
        var model = _context.BasicItems
            .Where(i => i.Name.Contains(SearchString));

        return PartialView("_AddKitItem", model);
    }

В том виде, в котором у меня есть текстовое поле и кнопка (теперь я использую ViewModel, а не исходную сущность Model). Примечание: ViewModel - это просто объект, содержащий исходную сущность, которую я хотелиспользовать - в этом случае называетсяKit - и строка с именем SearchString):

<div id="modal-placeholder"></div>

(затем некоторые другие элементы управления)

            <label asp-for="SearchString" class="control-label"></label>
            <input asp-for="SearchString" class="form-control" />


            <button type="button" class="btn btn-primary" data-toggle="ajax-modal" data-target="#add-item" data-url="@Url.Action("AddItem")">
                Search Item To Add
            </button>

У меня также есть следующий код JS (который я взял из примера кода)

$(function () {
    var placeholderElement = $('#modal-placeholder');

    $('button[data-toggle="ajax-modal"]').click(function (event) {
        var url = $(this).data('url');
        $.get(url).done(function (data) {
            placeholderElement.html(data);
            placeholderElement.find('.modal').modal('show');
        });
    });

    placeholderElement.on('click', '[data-save="modal"]', function (event) {
        event.preventDefault();

        var form = $(this).parents('.modal').find('form');

        var actionUrl = form.attr('action');

        var dataToSend = form.serialize();

        $.post(actionUrl, dataToSend).done(function (data) {

            var newBody = $('.modal-body', data);
            placeholderElement.find('.modal-body').replaceWith(newBody);

            var isValid = newBody.find('[name="IsValid"]').val() == 'True';
            if (isValid) {
                placeholderElement.find('.modal').modal('hide');
            }
        });
    });
});

Когда это не сработало (поместив точку останова в первую строку действия AddItem в контроллере и проверив значение SearchString - равное нулю), в главном представлении я заменил два SearchStringконтролирует со следующим

@Html.DisplayNameFor(model => model.SearchString)
                    :
                    @Html.DisplayFor(model => model.SearchString)

Но все равно не повезло - тот же результат.

Итак, я даже попытался:

Item Name:

                @Html.TextBox("SearchString")

И все тот же результат.

1 Ответ

0 голосов
/ 08 ноября 2019

Скотт использует

asp-for="@model.SearchString"
...