Добавление проверки поля в приложение ASP.NET, использующее шаблон Serenity

В настоящее время я работаю над базовым веб-приложением CRUD, которое использует шаблон Serenity (Serene) в Visual Studio. Этот шаблон предоставляет доступ к нескольким плагинам. Плагин Sergen генерирует файлы C# и html, которые создают таблицу CRUD для указанной базы данных. Подключаемый модуль jQuery validate используется для изменения проверки полей на стороне клиента. Я пытаюсь добавить проверку настраиваемого поля в поле ввода частоты, добавив следующую комбинацию jQuery и regex (закомментированный раздел) в файл TableIndex.cshtml (созданный Sergen):

{
ViewData["Title"] = Serenity.LocalText.Get("Db.Default.Table.EntityPlural");
}

<div id="GridDiv"></div>


<script type="text/javascript">
jQuery(function () {
    new SerenityNowSolution.Default.TableGrid($('#GridDiv'), {}).init();

    Q.initFullHeightGridPage($('#GridDiv'));
});

//The following is code that I added:

$(document).ready(function () {
    $.validator.addMethod("TableDialog1_Frequency", function (value, element) {
        return this.optional(element) || /(\d)+(d|h|m|s)/.test(value);
    }, "Frequency is invalid: Please enter a valid frequency.");

    $("#TableDialog1_Form").validate({
        rules: {
            TableDialog1_Frequency: "required TableDialog1_Frequency",
        },
    });
});

</script>

Насколько я могу судить, это единственный файл cshtml, сгенерированный Sergen. Мои попытки добавить проверку пользовательских полей сталкиваются с несколькими проблемами:

  1. Я не уверен относительно размещения добавленного кода (если это правильный файл для редактирования).

  2. Мой добавленный код в настоящее время пытается добавить проверку в поле ввода частоты путем добавления правила (метода) регулярных выражений к функции валидатора в плагине validate. К сожалению, сгенерированный Сергеном код "автоматически создает" (из-за отсутствия лучшего описания) модал добавления строки (id = TableDialog#_Form), который содержит поле ввода частоты (id = TableDialog#_Frequency). В приведенном выше коде я пытаюсь добавить проверку поля в поле ввода определенного модального режима (форма / частота #1). Однако каждый раз, когда нажимается кнопка добавления строки на веб-странице, появляющийся модал имеет уникальный идентификационный номер в своих идентификаторах. Может показаться, что мне нужно либо отредактировать модальный код генерации, чтобы удалить эти числа, либо изменить мой проверочный код, чтобы учесть это. Я не уверен, как это сделать.

Следующий код используется для генерации модальных строк добавления (TableDialog#_Form):

namespace SerenityNowSolution.Default {

@Serenity.Decorators.registerClass()
export class TableDialog extends Serenity.EntityDialog<TableRow, any> {
    protected getFormKey() { return TableForm.formKey; }
    protected getIdProperty() { return TableRow.idProperty; }
    protected getLocalTextPrefix() { return TableRow.localTextPrefix; }
    protected getNameProperty() { return TableRow.nameProperty; }
    protected getService() { return TableService.baseUrl; }

    protected form = new TableForm(this.idPrefix);

}
}

Спасибо, что нашли время, чтобы прочитать это. Пожалуйста, дайте мне знать, если я покажу какой-либо дополнительный код. Любая помощь будет принята с благодарностью.

ОБНОВИТЬ:

В настоящее время это мой добавленный код (после внесения предложенных изменений):

$(document).ready(function () {
    $.validator.addMethod(
        "regex",
        function (value, element, regexp) {
            var re = new RegExp(regexp);
            return this.optional(element) || re.test(value);
        },
        "Please check your input."
    );
});

$(document).on('click', '.tool-button.save-and-close-button', function () {
    var item = $("div.field.Frequency input").attr("id");
    var abc = $("div.s-Form form").attr("id");
    $(abc).validate();
    $(item).rules("add", {
        regex: "^(\d)+(d|h|m|s)$"
    });
    $(abc).validate();
});

$(document).on('click', '.tool-button.apply-changes-button.no-text', function () {
    var item = $("div.field.Frequency input").attr("id");
    var abc = $("div.s-Form form").attr("id");
    $(abc).validate();
    $(item).rules("add", {
        regex: "^(\d)+(d|h|m|s)$"
    });
    $(abc).validate();
});

К сожалению, проверка поля все еще не происходит.

1 ответ

Предполагая, что остальная часть вашего подхода верна, вы создали rules объект неправильно

$("#TableDialog1_Form").validate({
    rules: {
        TableDialog1_Frequency: "required TableDialog1_Frequency",
    },
});

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

Использовать key: value пары для method: parameter как это...

$("#TableDialog1_Form").validate({
    rules: {
        field_name: {  // <- NAME of the field here
            required: true,
            TableDialog1_Frequency: true
        },
        another_field_name: {
            // rules for this field
        }, 
        // remaining fields
    },
    // other validate options, etc.
});

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

Если у вас нет контроля или предварительных знаний о том, как будут именоваться динамически генерируемые поля, то вы должны использовать .rules() метод для добавления правил программно, если / когда поле генерируется.

Примеры здесь и здесь.

Если это не практично, то вы можете просто использовать required а также TableDialog1_Frequency так как классы на поле и плагин jQuery Validate подберут их автоматически. Этот подход лучше всего работает с правилами, которые имеют логический параметр.

<input name="foo234" type="text" class="required TableDialog1_Frequency" ....

name не имеет значения, пока:

  • поле содержит name
  • name является уникальным для form

Я также подвергаю сомнению Ваш выбор именования для пользовательского метода. Если правило проверяет ввод как формат времени, то, возможно, его следует назвать более общим, как time, Пользовательские правила можно использовать на неограниченном количестве полей.

Другие вопросы по тегам