hx-vals

Атрибут hx-vals позволяет добавить параметры, которые будут отправлены с запросом AJAX.

По умолчанию значение этого атрибута представляет собой список значений имя-выражение в формате JSON (JavaScript Object Notation).

Если вы хотите, чтобы hx-vals вычисляло заданные значения, вы можете добавить префикс javascript: или js:.

  <div hx-get="/example" hx-vals='{"myVal": "My Value"}'>Get Some HTML, Including A Value in the Request</div>
  <div hx-get="/example" hx-vals='js:{myVal: calculateValue()}'>Get Some HTML, Including a Dynamic Value from Javascript in the Request</div>

При использовании вычисляемого кода вы можете получить доступ к объекту event. В этом примере включено значение последнего введенного ключа в поле ввода.

  <div hx-get="/example" hx-trigger="keyup" hx-vals='js:{lastKey: event.key}'>
    <input type="text" />
  </div>

Учет мер безопасности

• По умолчанию значение hx-vals должно быть валидным JSON. Оно не вычисляется динамически. Если вы используете префикс javascript:, имейте в виду, что вы вводите соображения по безопасности, особенно при работе с пользовательским вводом, таким как строки запроса или пользовательский контент, который может привести к уязвимости Cross-Site Scripting (XSS).

Примечания

• hx-vals наследуется и может быть размещено на родительском элементе.
• Объявление переменной в дочернем элементе переопределяет объявление в родительском элементе.
• Значения входных данных с одинаковым именем будут переопределены объявлением переменной.