# j-ContextMenu

> Ha az értéket nem határozzák meg, akkor az összetevő a nevét értékként használja.

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

- 3 `left`, `center` és `right` orientációt támogat
- Szingapúr
- A Bootstrap Grid rendszer
- érintéssel dolgozik


__módszerek__:

Módszer: `component.show(orientation, targetElement, [items], clickCallback, [offsetX], [offsetY])`
- A `orientation {String}` lehet `left`, `center` vagy `right`
- `targetElement {Selector/jQuery/Element}` cél, ahol a komponens látható lesz
- A `items {Array}` opcionális, és ennek a szerkezetnek kell lennie: máskülönben a `[{ name: String, value: String, icon: String }]` az objektumok által olvasható `data-options` attribútum.
- A `callback(selectedValue) {Function}` akkor indítható, amikor a felhasználó kattintson az elemre
- A `offsetX {Number}` opcionális változtathatja az X-t
- A `offsetY {Number}` opcionális változtathat az offset Y-t

Módszer: `component.hide()`

__Attribútumok__:
A `targetElement` tartalmazhatja a `data-options="Name 1|fa-building|Value 1;Name 2|fa-github|Value 2;"` attribútumot a kontextusmenü minden elemével.

Ha a `value` nem meghatározott, akkor a komponens használata `name` mint `value`.

__Globális események__:

```javascript
ON('contextmenu', function(visible, component, target) {
    console.log('ContextMenu is', visible ? 'visible' : 'hidden');
});
```

Használja a `<ui-component name="contextmenu">`Amennyiben a készülék még nem tölthető le, jComponent letöltés az első felhasználásra a címről `DEF.fallback` (Azt a Componentator A szerző: Peter Širka. forrás: a Componentator Az összetevők raktár, MIT licenc.

```html example.html
<style>
	body { background-color: #F0F0F0; }
</style>

<ui-component name="contextmenu"></ui-component>

<div class="container">
	<a href="javascript:void(0)">Edit</a>
</div>

<script>
	$(document).on('click', 'a', function() {
		SETTER('contextmenu/show', 'left', this, [{ name: 'Print', icon: 'ti-print', value: 'print' }, { name: 'Copy', icon: 'ti-copy', value: 'copy' }, { name: 'Remove', icon: 'ti-times-circle', value: 'remove' }], function(item) {
			console.log('CLICK', item);
		});
	});
</script>
```