jquery currentScript.parent megoldás létezik?
Sziasztok!
szembekerültem egy problémával, nem találok megoldást, hátha van 5letetek.
A felület amit csinálok ajax alapú. jQueryt használok.
A formok ajaxban érkeznek, és értelem szerűen vannak form elemek, amikhez scriptek csatlakoznak. pl.:Teljesen jól működik, de belefutottam, hogy vannak olyan form elemek, melyeket ismételni kell, ha a user többet visz fel. pl.: számlánál a termékek.
A megoldás kézenfekvő. Az ilyen elem blokkokat beteszem egy divbe, és clónozom, a megfelelő eseményre - pl megnyom egy "új" gombot.
igen ám, de klónozáskor 2 ugyan olyan id lesz, ami szétüti a dolgot.
Erre megoldásként azt találtam ki, hogy jó lenne a scripteknél a célzást valahogy így megadni:ahol is a $.parent egy saját funkcó lenne. Megkeresné hol van az éppen futó script tag, annak a parentjét keresné, és azon BELÜL findelné a #kacsasult -et.
Sajnos azonban vagy rosszul keresek, vagy nincs olyan lehetőség, hogy egy éppen futó <script> tag helyét megtaláljam a dom ban.
Ötletek rá?
■ szembekerültem egy problémával, nem találok megoldást, hátha van 5letetek.
A felület amit csinálok ajax alapú. jQueryt használok.
A formok ajaxban érkeznek, és értelem szerűen vannak form elemek, amikhez scriptek csatlakoznak. pl.:
<select id="kacsasult"><option>Akármi</option></select>
<script>$("#kacsasult").select2()</script>
A megoldás kézenfekvő. Az ilyen elem blokkokat beteszem egy divbe, és clónozom, a megfelelő eseményre - pl megnyom egy "új" gombot.
igen ám, de klónozáskor 2 ugyan olyan id lesz, ami szétüti a dolgot.
Erre megoldásként azt találtam ki, hogy jó lenne a scripteknél a célzást valahogy így megadni:
<script>$.parent("#kacsasult").select2()</script>
Sajnos azonban vagy rosszul keresek, vagy nincs olyan lehetőség, hogy egy éppen futó <script> tag helyét megtaláljam a dom ban.
Ötletek rá?
Szerintem jobb lenne, ha azt
Például arra ne keress megoldást, hogy hogyan lehet egyszerre több elemnek ugyanaz az id-je, mert nem arra való. Ha több elemet ugyanazzal az "azonosítóval" kell előkeresni, arra a
class
a megfelelő eszköz.Benne volt, de kiemelem jobban
A "Még 1 termék felvitel" gombra kattintva klónozza az eredetit, és csinál egy új felviteli lehetőséget. És persze az új [name=termék] -re ráakaszkodik a select2 inicializálás. És CSAK arra. ;)
A probléma ott van, amit te kiemeltél. De nem megoldás CLASS ra cserélni a select2 célzását, mert az ráakaszkodna a már meglévő [name=termék] re is.
Azt a script elemet
script
elemet felesleges klónoznod. Amikor klónozol egy elemet, akkor van rá hivatkozásod és kereshetsz azon belül.Sajnos nem fog menni
Miért kell ahhoz nagy
Hát ehhez sokat kellene írnom. :)
Azért még picit várok, hátha van valami ilyesmit:
itt
tud ajánlani valaki.
Én lehet azt csinálnám a
Az egyetlen értelmes
Helyette ráraksz a selectre mondjuk egy "oh_please_call_select2_on_me" nevű classt, az AJAX hívás után pedig meghívsz egy függvényt, ami inicializálja a megfelelő jQuery plugineket, class alapján. Ugyanezt a függvényt meghívod klónozás után is. Az idket kukázod.
Gyorsan összedobtam egy occsó kis demót.
Kisbetűs rész: az onclick attribútumban és társaiban a "javascript:" nem jó semmire. Oda alapból Javascriptet ír az ember.
Sajnos nincs scope-os id
Az adott esetben 2 javaslatom van:
1: Amikor megjön a form ajaxban, még stringként, cseréld le benne regexp-pel az id="kacsasult" szöveget valamire, ami mindig egyedi lesz.
2: Akkor cseréld le az id-t, miután klónoztad, még mielőtt visszatennéd a végleges helyére a DOMban.
Így nem lesz soha két egyforma ID-d, és tudod azonosítani egyértelműen.
Igen, ez az egér út
Már akkor
Ekkor a
Pedig van, és ahogy írtam, erre tökéletesen jó a class (vagy bármilyen tetszőleges dolog, amivel a DOM adott elemét le lehet kérdezni, a célnak megfelelően):
element.querySelectorAll()
. És jQueryben is ugyanígy lehet szűkíteni a kereséseket adott elemre.De még az
element.querySelectorAll()
-ra és társaira sincs feltétlenül szükség, mert a documentre hívva is remek eredményt adhat egy ilyen kiválasztó:#some-parent > .some-child
.Szerk.:
Az
element.querySelectorAll()
előnye, hogy ha támogatja a böngésző, akkor a közvetlen gyerekek lekéréséhez nem kell tudni egy csak a szülőre illeszkedő kiválasztót, hanem lehet használni a:scope
pseudoclasst is::scope > .some-child
Persze
template
<template>
elem nem pont erre jó?Nem teljesen,
Üdv! Nekem csak tippem van
Nekem csak tippem van mit is szeretnél, de ha az jó, akkor szerintem újra kell gondolnod ezt az egész dolgot mert ebből nagy gányolás lesz...
Feltételezem olyasmit szeretnél, hogy ha a felhasználó rendel egy jó rántott sajtot tegyük fel, akkor legyen lehetősége hozzá tartárt is kérni. Tehát a lista amiről rendel mindig ugyan az, és ha ki választ egy tételt akkor legyen lehetősége újabb tételeket kiválasztani.
Úgy látom az a probléma, hogy nem tudod, hogy szúrj be úgy új option elemet, hogy az ne akadjon össze egy már meglévővel.
Készíts egy bevásárló kosarat ami session id alapján tárolja hányadig elem kerül a kosárba (legyen lehetőség ki venni is) és PHP-ben ennek megfelelő kimenetet gyárts.
Ez alatt azt értem, hogy pl mindig jön egy option AJAX-on amiknek a name jellemzőjét az alapján generálod le, hogy hány cuccot pakolt a kosárba, a value érték meg ami alapján számlázol a termék azonosítója pl. Ennek a logikai résznek nem kliens oldalon jsben kel megvalósulnia amit csinálsz. Szóval írj egy API-t amit csak hívogatsz (betesz, kivesz, fizet)
A betesz - berak egy új option-t a formba
A kivesz - kiveszi onnan
A fizet - meg elküldi a formot
Köszönöm mindenkinek, az ötletelést!
Karvaly: Nem teljesen, azt tudom hogy készítsek egy szerver oldali megoldást, és nem szeretnék újból és újból szerver oldalról töltögetni.
Az igazsághoz hozzátartozik, hogy kritikus hozzáállásom az ilyen problémákhoz az Angularral függ össze, mert mióta azt elkezdtem tanulmányozni (és sajnos ezt a projektet nem azzal csinálom) azóta kicsit átalakult az MVC gondolkodásom. :) Egyszerűen zavarnak az ilyen összevissza kliens-szerver megoldások.
Nincs para, legközelebbi projektemnél már csak a Model lesz szerver oldali, a View és a Controller kliens oldali lesz. Nem is csoda a php-s megoldás akadozik, hiszen az nincs közvetlen kapcsolatban a megjelenítővel. :(
Jelen pillanatban egy egyszerű megoldást fogok használni. A php form generátorba építek egy független class-t, aminek átadok egy HTML forrás elérést és adat listát és csupán ennyit printel a php. Így kiemelem a szerver oldali renderelésből az ilyen form elemeket. A forrást javascript betölti mint template, és egy kliens oldali template kezelővel megoldom a felépítést, és dom-ba fűzést.