# Form 1.0.5+

# Form Draft

1.0.7+ | 1.1.2+

# Базовое использование

CM. PHP / Controller Plugin / Form Draft.

# TeslaCloud.Form.Draft (tc-form-draft)

# Параметры

Параметр	Тип	Значение по умолчанию	Описание
draftSaveUrl	string		URL для запросов на сохранение черновика.
draftLoadUrl	string		URL для запросов на загрузку черновика.
createTrigger	string	\| .js-tc-clib-createDraft	Селектор элемента-триггера для создания черновика.
updateTrigger	string	\| .js-tc-clib-updateDraft	Селектор элемента-триггера для обновления текущего черновика.
menuTrigger	string	\| .js-tc-clib-draftMenuTrigger	Селектор элемента-триггера меню черновиков.
draft	string	.js-draft	Селектор черновика в меню.
loadTrigger	string	.js-loadTrigger	Селектор элемента-триггера для загрузки черновика.
titleEditTrigger	string	.js-titleEditTrigger	Селектор элемента-триггера для редактирования названия черновика.
deleteTrigger	string	.js-deleteTrigger	Селектор элемента-триггера для удаления черновика.
noDraftsMessage	string	.js-noDraftsMessage	Селектор блока сообщения об отсутствии созданных черновиков.

# Inline edit

1.0.7+ | 1.1.2+

# Базовое использование

<xf:comment>Подключение JavaScript ниже требуется только для версий XenForo до 2.3.0</xf:comment>
<xf:js src="TC/ComponentLibrary/form.js" addon="TC/ComponentLibrary" min="1" />

<div class="block">
	<div class="block-container">
		<div class="block-body">
			<div class="block-row">
				<span>
					<span class="js-tc-clib-inlineEditable"
						  data-name="test_input">
                        Default value
                    </span>
					<xf:button class="button--plain button--iconOnly"
							   fa="fa-pen"
							   data-xf-click="tc-inline-edit"
							   data-edit-url="/" />
				</span>
			</div>
		</div>
	</div>
</div>

# TeslaCloud.Form.InlineEdit (tc-inline-edit)

# Параметры

Параметр	Значение по умолчанию	Описание
target	< :up \| .js-tc-clib-inlineEditable	Селектор элемента с редактируемым содержимым.
editUrl		URL для сохранения нового значения.

# Атрибуты полей ввода

Атрибут	Описание
data-name / name	Ключ, c которым будет передано новое значение при сохранении.

# Reset Input

# Базовое использование

<xf:comment>Подключение JavaScript ниже требуется только для версий XenForo до 2.3.0</xf:comment>
<xf:js src="TC/ComponentLibrary/form.js" addon="TC/ComponentLibrary" min="1" />

<xf:form class="block" data-xf-init="tc-reset-input">
	<div class="block-container">
		<div class="block-body">
			<xf:hiddenval name="hidden_val" value="Test hidden val" />

			<xf:radiorow name="radio"
						 label="Radio">
				<xf:option value="test1" data-default="true">Test 1</xf:option>
				<xf:option value="test2">Test 2</xf:option>
			</xf:radiorow>

			<xf:checkboxrow label="Check box">
				<xf:option name="checkbox[test1]" value="1"
						   data-default="true">Test 1
				</xf:option>
				<xf:option name="checkbox[test2]" value="1"
						   data-default="true">Test 2
				</xf:option>
			</xf:checkboxrow>

			<xf:selectrow name="select" label="Select">
				<xf:option value="test1">Test 1</xf:option>
				<xf:option value="test2" data-default="true">Test 2</xf:option>
				<xf:option value="test3">Test 3</xf:option>
				<xf:option value="test4">Test 4</xf:option>
			</xf:selectrow>

			<xf:selectrow name="select_multiple" label="Select multiple" multiple="true">
				<xf:option value="test1">Test 1</xf:option>
				<xf:option value="test2" data-default="true">Test 2</xf:option>
				<xf:option value="test3">Test 3</xf:option>
				<xf:option value="test4" data-default="true">Test 4</xf:option>
			</xf:selectrow>

			<xf:textboxrow name="text_box"
						   label="Text box"
						   data-default="Lorem ipsum dolor sit amet, consectetur adipiscing elit." />

			<xf:numberboxrow name="number"
							 label="Number"
							 data-default="1337" />

			<xf:passwordboxrow name="password"
							   label="Password" />

			<xf:dateinputrow name="date"
							 label="Date"
							 data-default="04-06-2010" />

			<xf:textarearow name="textarea"
							label="Textarea"
							size="5" />

			<xf:codeeditorrow name="code"
							  label="Code"
							  class="codeEditor--autoSize" />

			<xf:editorrow name="editor"
						  label="Editor"
						  data-min-height="100" />
		</div>

		<xf:submitrow icon="save">
			<xf:html>
				<xf:button class="js-tc-clib-inputResetTrigger">{{ phrase('reset') }}</xf:button>
			</xf:html>
		</xf:submitrow>
	</div>
</xf:form>

# TeslaCloud.Form.ResetInput (tc-reset-input)

# Параметры

Параметр	Значение по умолчанию	Описание
inputs	\| :input:not([type=hidden]):not(:button)	Селектор контейнера полей ввода.
resetTrigger	\| .js-tc-clib-inputResetTrigger	Селектор триггера сброса значений полей ввода.

# Атрибуты полей ввода

Атрибут	Описание
data-default	Значение для поля ввода по умолчанию. Если не указано, после сброса поле ввода будет пустым.

# TeslaCloud.Form

1.0.7+ | 1.1.2+

# Параметры сериализации

Параметр	Тип	Значение по умолчанию	Описание
skipEmpty	bool	true	Если `true`, будут сериализованы только элементы, имеющие непустые значения.
includePassword	bool	false	Если `false`, элементы с типом `password` не будут сериализованы.
includeHidden	bool	false	Если `false`, элементы с типом `hidden` не будут сериализованы.

# serializeArray

Сериализация формы в массив объектов, содержащих названия элементов формы и их значений.

serializeArray(elements, options = {})

# Параметры

Параметр	Тип	Значение по умолчанию	Описание
elements	HTMLFormElement\|NodeList\|HTMLCollection\|jQuery	true	Объект для сериализации. В качестве объекта jQuery может быть переданы только HTML-форма или её контейнер.
options	Object		См. Параметры сериализации.

# serializeFormData

Сериализация формы в объект FormData.

serializeArray(elements, options = {})

# Параметры

Параметр	Тип	Значение по умолчанию	Описание
elements	HTMLFormElement\|NodeList\|HTMLCollection\|jQuery	true	Объект для сериализации. В качестве объекта jQuery может быть переданы только HTML-форма или её контейнер.
options	Object		См. Параметры сериализации.

# serializeJSON

Сериализация формы в JSON-объект.

serializeArray(elements, options = {})

# Параметры

Параметр	Тип	Значение по умолчанию	Описание
elements	HTMLFormElement\|NodeList\|HTMLCollection\|jQuery	true	Объект для сериализации. В качестве объекта jQuery может быть переданы только HTML-форма или её контейнер.
options	Object		См. Параметры сериализации.

# deserialize

Десериализация формы.

deserialize(elements, data)

# Параметры

Параметр	Тип	Описание
elements	HTMLFormElement\|NodeList\|HTMLCollection\|jQuery	Объект для десериализации. В качестве объекта jQuery может быть переданы только HTML-форма или её контейнер.
data	Array\|FormData\|Object	Данные для десериализации.