Как запустить кнопку отправки типа в MVC View программно

Question

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

Using (Ajax.BeginForm("Index", "Brand", FormMethod.Post, New AjaxOptions With {
                                        .InsertionMode = InsertionMode.Replace,
                                        .UpdateTargetId = "GridList"}))
@Html.TextBox("strName", Nothing, New With {.class = "form-control", .PlaceHolder = "XXXXX"})
<button type="submit" style="display: none">Search</button>

Конец использования

Answer 1

Я добавил код, но btn-search не запускается при первой загрузке страницы просмотра. Пожалуйста, посмотрите содержимое моего представления:

<section class="panel">
    <header Class="panel-heading tab-bg-dark-navy-blue">
        <label class="bg-transparent wht-color">اطلاعات جامع ماشین آلات</label>
    </header>

    <div class="panel-body  pull-left">
        @Using (Ajax.BeginForm("Index", "MachinInfo", FormMethod.Post, New AjaxOptions With {
                                                                    .InsertionMode = InsertionMode.Replace,
                                                                    .OnBegin = "searchAjaxBegin",
                                                                    .UpdateTargetId = "GridList"}))

            @Html.DropDownList("DDSearchItems", New SelectListItem() {
                     New SelectListItem With {.Text = "نوع", .Value = "MachinName"},
                     New SelectListItem With {.Text = "برند", .Value = "BrandName"},
                         New SelectListItem With {.Text = "تیپ", .Value = "MachinTypeName"},
                         New SelectListItem With {.Text = "پلاک", .Value = "NPlate"},
                         New SelectListItem With {.Text = "کد سازمانی", .Value = "OrgCode"},
                         New SelectListItem With {.Text = "محل استقرار", .Value = "Mcamp"},
                         New SelectListItem With {.Text = "سریال کارت", .Value = "CardSerial"},
                         New SelectListItem With {.Text = "VIN", .Value = "VIN"}}, "جستجو در همه ستونها",
                 htmlAttributes:=New With {.class = "btn btn-white btn-sm"})

            @Html.TextBox("strName", Nothing, New With {.class = "btn btn-white btn-sm", .PlaceHolder = "متن جستجو"})
            @<button type="submit" id="btn-search" value="" Class="glyphicon glyphicon-search btn btn-default" />
        End Using
    </div>


    <div id="GridList">
        @Html.Partial("_PVMachinInfoGrid")
    </div>

</section>

<div Class="pull-left btn-toolbar">
    <div Class="btn btn-default">
        @Html.ActionLink(" ", "MachinInfoAdd", Nothing, htmlAttributes:=New With {.class = "glyphicon glyphicon-plus btn btn-small", .data_toggle = "tooltip", .data_placement = "top", .title = "اضافه کردن سطر جدید"})
    </div>
    @*<div Class="btn btn-default">
            @Html.ActionLink(" ", "Index", Nothing, htmlAttributes:=New With {.class = "glyphicon glyphicon-tasks btn btn-small", .data_toggle = "tooltip", .data_placement = "top", .title = "لیست برندها"})
        </div>*@
</div>


<script>

    var searchCallMade = false;

    function searchAjaxBegin() {
        if (searchCallMade) {
            console.log('Will not proceed with AJAX call');
            return false;
        }
    }

    $(function () {

        $("#btn-search").trigger("click");
        searchCallMade = true;

    })

</script>

Answer 2

Вы можете инициировать нажатие кнопки отправки с помощью JavaScript.

Присвойте идентификатор кнопке

<button type="submit" style="display: none" id="btn-search">Search</button>

, и теперь в событии document.ready вы можете вызвать событие нажатия

$(function () {

    $("#btn-search").trigger("click");

})

Другой вариант - вызвать событие формы submit с помощью JavaScript.

Здесь я использую jQuery.Но вы можете сделать то же самое и с ванильным JavaScript.

РЕДАКТИРОВАТЬ: Согласно вопросу в комментарии

Как поставить условие для запуска только один раз.Например, если пользователь нажимает кнопку «Поиск», и информация фильтруется и загружается в представление, не запускается ли этот триггер?

Вы можете использовать переменную flag в вашем для управления этим.Укажите метод JavaScript в качестве значения свойства OnBegin вашего AjaxOptions.Этот метод будет вызван до вызова ajax.На основании значения переменной вашего флага вы можете вернуть true или false.Когда этот метод возвращает false, вызов ajax не будет выполнен.

Вот краткий пример.

@using (Ajax.BeginForm("Index", "Brand",
                        new AjaxOptions
                        {
                            InsertionMode = InsertionMode.Replace,
                            OnBegin = "searchAjaxBegin",
                            UpdateTargetId = "GridList"
                        }))
{
    <input type="text" name="query" value="" />
    <button type="submit" id="btn-search">Search</button>
}

и в вашем JavaScript

<script>

    var searchCallMade = false;

    function searchAjaxBegin() {
        if (searchCallMade) {
            console.log('Will not proceed with AJAX call');
            return false;
        }
    }

    $(function () {

        $("#btn-search").trigger("click");
        searchCallMade = true;

    })

</script>

Если вам нужен больший контроль над тем, как выполняется ваш вызов Ajax, вы можете также рассмотреть возможность отключения помощника Ajax.BeginForm и написания кода для обработки события отправки формы и выполнения вызова ajax самостоятельно.