# j-Parts

> Questo contenuto può gestire più parti memorizzate nell'Array e concentrarsi su una parte specifica.

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

Questo contenuto può gestire più `parts` memorizzati nel `Array` e concentrarsi su una parte specifica.


__Configurazione__:

- L'area parentale di `parent {String}` a causa della dimensione parziale (default: `auto`)
- `margin {Number}` margine verticale (default: `0`)
- `create {String}` un collegamento al `function(part)`, viene eseguito se la parte è creata (noto una volta)
- `focus {String}` un collegamento al `function(part)`, viene eseguito se la parte è focalizzata
- `close {String}` un collegamento al `function(part)`, viene eseguito se la parte è chiusa

__Buono sapere 1__:

- Le frasi `~PATH~` saranno sostituite automaticamente da `item.path`
- Le frasi `~ID~` saranno sostituite automaticamente da `item.id`

__Specificazione degli articoli__:

- `item.id {String}` molto importante, parte identificatore
- `item.blur {String/Function(el, item)}` opzionale, un collegamento al `function(element, item)` se la parte è focalizzata
- `item.focus {String/Function(el, item)}` o `item.reload {String}` opzionale, un collegamento al `function(element, item)` se la parte è focalizzata
- `item.remove {String/Function(el, item)}` opzionale, un collegamento al `function(element, item)` se la parte è rimossa
- `item.html {String}` un contenuto HTML o utilizzo di `item.url`
- URL di `item.import {String}` per il contenuto della parte
- `item.path {String}` opzionale, sostituisce automaticamente tutte le frasi `~PATH~`
- `item.delay {Number}` un ritardo per la rimozione della classe `invisible`
- __NEW__ `item.attrd {Object}` aggiunge attributi `data-key` all'elemento

__Estensione del componente__:

- `item.focused {Boolean}` determina se la parte è focalizzata o meno
- `item.element {jQuery}` Parte di elemento

__Metodi__:

- `component.close(id)` chiude la parte
- `component.focus(id)` Il focus parte
- `component.rename(id, name, [icon])` riproduzione

Utilizzare con `<ui-component name="parts">`Quando il componente non è ancora caricato, jComponent Scarica il codice in prima utilizzazione dall'indirizzo `DEF.fallback` (Il Componentator La storia di Peter Širka.Fonte: il Componentator Ristorante dei componenti, licenza MIT.

```html example.html
<ui-component name="exec">

	<ui-bind path="myparts" config="template" class="block">
		<script type="text/html">
			{{ foreach m in value }}
			<button class="exec" data-exec="changepart" data-id="{{ m.id }}"><i class="ti ti-times exec mr5" data-prevent="true" data-exec="closepart"></i>{{ m.name }}</button>
			{{ end }}
		</script>
	</ui-bind>
	<br />

	<div style="width:600px;height:300px;border:1px solid #E0E0E0">
		<ui-component name="parts" path="myparts" config="parent:auto"></ui-component>
	</div>

</ui-component>

<script>
	var myparts = [];

	myparts.push({ id: '1', name: 'Part 1', html: '<div class="padding">Part 1</div>' });
	myparts.push({ id: '2', name: 'Part 2', html: '<div class="padding">Part 2</div>' });
	myparts.push({ id: '3', name: 'Part 3', html: '<div class="padding">Part 3</div>' });

	function changepart(el ,e) {
		var id = ATTRD(el);
		SETTER('parts/focus', id);
	}

	function closepart(el, e) {
		var id = ATTRD(el);
		SETTER('parts/close', id);
	}

</script>
```