# j-FixedModal

> Съдържанието на j-FixedModal е разделено на 3 части: заглавие, тяло и стъпка. Всяка част трябва да бъде дефинирана. Компонентът добавя CSS класове към всяка част, например първото div ще съдържа ui-фиксиран модул

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: bg
Content-SHA256: 93f046af5129c105b18dd95a1551a8d77d09174ac256afe5e78aabcb99519115
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

- Работи само с `+v17`
- Компонентът премества съдържанието на този компонент под етикета `<body>` (заради позиционирането)


__Конфигуриране__:

- `width {Number}` Моделът Max-width
- `if {String}` условие за показване на modal, той е в сравнение с стойността в рамките на `path`
- `reload {String}` свързва към глобална функция и се изпълнява, ако формулярът показва
- `submit {String}` свързва към глобална функция и се изпълнява, ако натиснете бутона за подаване
- `cancel {String}` свързва към глобална функция и се изпълнява, ако натиснете бутона за отмяна
- `enter {Boolean}` автоматично улавя ключа на `enter` и изпълнява подаването (предварително: `false`)
- `autofocus {Boolean/String}` може да се фокусира върху входа. `String` === `jQuery selector` за входа
- `default {String}` е кратък алиас за `DEFAULT(default, true)`
- `zindex {Number}` може да повлияе на z-индекс (предварително: `12`)

__Добре е да се знае__:

Съдържанието на `j-FixedModal` е разделено на 3 части: `header`, `body` и `footer`. Всяка част трябва да бъде дефинирана. Компонентът добавя класове CSS към всяка част, например първата `div` ще съдържа `ui-fixedmodal-header`, втората `ui-fixedmodal-body` и третата `ui-fixedmodal-footer`.

---

Този компонент поддържа динамична оценка на съдържанието на `<script type="text/html">`. Примерът по-долу съдържа скрипт с HTML и компонентът оценява съдържанието, ако j-Modal се показва (само веднъж).

```html
<ui-component name="fixedmodal" path="path" config="config">
	<script type="text/html">
		A CONTENT
	</script>
</ui-component>
```

Използвайте го с `<ui-component name="fixedmodal">`Когато компонентът все още не е зареден, jComponent Изтегляне на първия адрес в `DEF.fallback` (След това Componentator Източник: Питър Шерка Componentator Съставни съставки, лиценз на MIT.

```html example.html
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores illum quaerat quisquam voluptatem soluta necessitatibus accusamus possimus consequuntur nihil nam. Fugiat unde nemo, ratione magnam. Placeat minima, fugiat quo a. Esse commodi temporibus quos numquam suscipit! Mollitia accusantium temporibus nisi quibusdam alias provident rerum impedit, fuga officia non illum unde magni recusandae eos ducimus, maiores, dolore voluptates reiciendis accusamus odit quo ipsum veniam. Consectetur vitae minima dolor, possimus earum quae necessitatibus quia! Ex reiciendis nam eius adipisci harum ad. Atque fuga sint deleniti repellat quisquam. Deserunt laudantium maiores dicta, aliquid quidem id veritatis sint rem iusto. Ab similique culpa quasi!

<ui-component name="fixedmodal" path="common.form" config="if:folder;submit:folder_submit" class="hidden">

	<!-- HEADER -->
	<div>
		<i class="ti ti-folder orange"></i>
		<strong>New folder</strong>
		Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus qui facilis magni porro reiciendis.
	</div>

	<!-- BODY -->
	<div>
		CONTENT Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit illo rem dicta temporibus beatae quibusdam dolore fugit, quidem nostrum. Hic asperiores enim ipsum maxime. Hic nisi nulla iusto id commodi?
	</div>

	<!-- FOOTER -->
	<div>
		<button name="cancel">Cancel</button>
		<button name="submit"><i class="ti ti-plus"></i>Create folder</button>
	</div>

</ui-component>

<script>

	function folder_submit(hide) {
		alert('SUBMIT');
		hide();
	}

	var common = {};

	// Show the form
	common.form = 'folder';

</script>
```