• Joomla 5.0

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

Вы можете встроить проверку на стороне клиента в свои формы, выполнив следующие 3 шага:

1. Включите библиотеку Joomla validate javascript через Web Asset Manager :

Factory::getApplication()->getDocument()->getWebAssetManager()->useScript('form.validate');

Если вы записываете эту строку в файле tmpl, то обычно у вас будет Document Доступно:

$this->document->getWebAssetManager()->useScript('form.validate');

Эта строка приведет к тому, что файл media/system/js/fields/validate.js будет отправлен в клиентский браузер.

2. Укажите, что вы хотите, чтобы проверка выполнялась в вашей форме, добавив класс form-validate:

<form class="form-validate"> ... </form>

3. Укажите проверку, которую вы хотите применить к полю формы. Вы делаете это в XML-файле определения формы, добавляя класс validate-... в поле. Например, чтобы указать, что поле телефонного номера должно быть числовым:

<field 
    name="telephone"
    type="telephone"
    class="inputbox validate-numeric"
    ... />

Существует 4 типа проверки, которые вы можете использовать:

• validate-username
• validate-password
• validate-numeric
• validate-email

Все они используют регулярное выражение javascript для проверки значения, введенного пользователем. (Если вам нужно проверить детали используемого регулярного выражения, вы можете посмотреть в media/system/js/fields/validate.js, в конструкторе класса JFormValidator).

Обратите внимание, что если вы используете поле формы type="email" затем validate-email класс будет добавлен автоматически. (Однако вам все равно придется добавить шаги 1 и 2 выше, чтобы это сработало).

Также, если вы укажете, что это поле является обязательным, например:

<field 
    name="telephone"
    type="telephone"
    required="true"
    ... />

Затем javascript также проверит, что в поле было введено значение.

Проверка выполняется всякий раз, когда вы нажимаете на кнопку в форме, которая относится к сохранению данных, например:

<button type="button" class="btn btn-primary" onclick="Joomla.submitbutton('myform.submit')">Submit</button>

и проверка запускается в функции Javascript Joomla.submitbutton.

У вас также может быть кнопка отмены, которая не запускает проверку:

<button type="button" class="btn btn-primary" onclick="Joomla.submitbutton('myform.cancel')">Cancel</button>

При создании кнопок панели инструментов только те, которые связаны с сохранением данных, имеют class="form-validation" атрибут добавлен к HTML-элементу кнопки. Когда кнопка нажата, ее class атрибут отмечен. Если form-validation класс присутствует, тогда javascript Joomla.submitbutton функция вызывается с помощью validate параметр установлен на true. В противном случае он вызывается с помощью validate установлено значение false.

Пользовательская проверка с использованием шаблона

Для таких полей , как type="text" и type="telephone" (которые относятся к html <input> элемент) вы можете указать регулярное выражение javascript, которому должны соответствовать введенные пользователем данные. Например

<field 
    name="message"
    type="text"
    pattern="[^x]+"
    ... />

данные будут отклонены, если в поле есть буква "x".

Это относится только к проверке на стороне клиента! Это не влияет на проверку на стороне сервера!

Пользовательская процедура проверки

Вы можете написать свою собственную функцию проверки на javascript следующим образом.

1. Шаг 1 Напишите функцию js. (Хотя ниже используется регулярное выражение, вы, очевидно, не ограничены этим).

jQuery(function() {
    document.formvalidator.setHandler('message',
        function (value) {
            regex=/^[^y]+$/;
            return regex.test(value);
        });
});

Вы должны хранить все файлы js в папке media, например, как media/js/validate-message.js в структуре каталогов разработки вашего компонента.

2. Предполагая, что вы пишете это для компонента com_example, включите файл js в свой список ресурсов media / joomla.asset.json. Код зависит от form.validate ввод и выполнение jquery:

{
      "name": "com_example.validate-message",
      "type": "script",
      "uri": "com_example/validate-message.js",
      "dependencies": [
        "form.validate", "jquery"
      ],
      "attributes": {
        "defer": true
      },
      "version": "1.0.0"
    } 

3. Включите ваш актив в свой код, например, в ваш файл tmpl: 

$this->document()->getWebAssetManager()->useScript('com_example.validate-message');

4. В вашем XML-файле определения формы укажите поле, к которому должна быть применена эта проверка

<field 
    name="message"
    type="text"
    class="inputbox validate-message"
    ... />

Это относится только к проверке на стороне клиента! Это не влияет на проверку на стороне сервера!