# j-FixedModal

> Conținutul j-FixedModal este împărțit în 3 părți: șir, corp și picioare. Fiecare parte trebuie definită. Componentul adaugă clase CSS la fiecare parte, de exemplu prima div va conține un modal fixat

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

- Funcționează numai cu `+v17`
- Componenta mișcă conținutul acestui component sub eticheta `<body>` (datorită poziționării)


__Configurarea__:

- `width {Number}` modală max-width
- `if {String}` condiţia de a arăta modalitatea, este comparată cu valoarea din interiorul `path`
- `reload {String}` este conectat la o funcție globală și este executat dacă formularul este afișat
- `submit {String}` este conectat la o funcție globală și este executat dacă se prestează butonul de depunere
- `cancel {String}` se conectează la o funcție globală și este executată dacă este apăsat butonul de anulare
- `enter {Boolean}` captează în mod automat cheia `enter` și efectuează depunerea (default: `false`)
- `autofocus {Boolean/String}` poate concentra o intrare. `String` === `jQuery selector` pentru intrarea
- `default {String}` este un alias scurt pentru `DEFAULT(default, true)`
- `zindex {Number}` poate afecta indexul z (default: `12`)

__bine să știi__:

Conținutul de la `j-FixedModal` Este împărțit în trei părți: `header`, `body` şi `footer`Fiecare parte trebuie definită. componenta adaugă clase CSS fiecărei părți, de exemplu, în primul rând `div` Va conține `ui-fixedmodal-header`În al doilea `ui-fixedmodal-body` şi a treia `ui-fixedmodal-footer`.

---

Acest component susține evaluarea dinamică a conținutului `<script type="text/html">`. exemplul de mai jos conține un script cu HTML și componenta evaluează conținutul dacă va fi afișat j-Modal (numai o dată).

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

Utilizați-l cu `<ui-component name="fixedmodal">`Când componenta nu este încă încărcată, jComponent Descărcați-l la prima utilizare de la adresa `DEF.fallback` (în cazul Componentator Autor: Peter Širka. sursă: Componentator Componente de stocare, MIT licență.

```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>
```