A tableselect és a kijelölt sorok száma?

Schmidt Attila képe

A Drupal form API tableselect segítségével összeraktam egy űrlapot, ahol több sorban checkboxok jelennek meg:

  1. $form['nodes'] = array(
  2. '#type' => 'tableselect',
  3. '#header' => $header,
  4. '#options' => $options,
  5. '#multiple' => TRUE
  6. )

A felhasználó egy vagy több elemet is bejelölhet.

Szeretném az űrlapon annak újra betöltése nélkül, a táblázat alatt a kijelölt sorok számát (is) folyamatosan kijelezni. Eddig -hiába kerestem, ajax, stb, nem találtam olyan megoldást, amit működésre tudtam volna bírni.

Mivel lehet ezt megcsinálni?

Taxonomy upgrade extras: 
Melyik modulhoz, modulokhoz kapcsolódik a téma?: 
Drupal verzió: 
Schmidt Attila képe

Kérdésem túl nehéz, vagy túl triviális? :-)

0
-3
aruna képe

- Egy eseményfigyelő-kezelő függvényt kell hozzáadnod a checkbox-okhoz jquery-el.
google: jquery checkbox checked event

- Az eseménykezelő függvényben le kell kérdezni a kijelölt checkbox-ok számát.
google: jquery selected checkbox count

- Ha megvan a kb. egysoros megoldás, akkor frissítened kell a label-t (div-et vagy akármit), amit kiírja számlálót.
google: jquery change div content

------------

Elvileg ez a megoldás logikája.

Egyedi javascript-et (amiben a fentieket megcsinálod) pl. modul-ból tudsz hozzáadni: http://api.drupal.org/api/drupal/includes%21common.inc/function/drupal_a...

1
0
Schmidt Attila képe

...és nem jutottam egyről kettőre. :-(

0
0
Sk8erPeter képe

Szemléltetésként készítettem neked egy demót (kimásoltam a Devel modul Generate content menüjében látható tableselectjének kódját), felraktam ide:

http://jsfiddle.net/Sk8erPeter/kxrTS/

A Drupal behaviors elveinek megfelelően kellene használnod mindezt a saját modulodban, és természetesen csak a szükséges oldalakra betöltve a JS-fájlt.

Az érdemi kód ennyi, a namespace-en belül:

  1. var $checkboxes = $('#devel-generate-content-form td input[type="checkbox"]');
  2.  
  3. $checkboxes.change(function(){
  4. var countCheckedCheckboxes = $checkboxes.filter(':checked').length;
  5. $('#count-checked-checkboxes').text(countCheckedCheckboxes);
  6. });

Természetesen az id-ket cseréld le a kódban a sajátodra.

3
0
Schmidt Attila képe

1.) Létrehoztam egy teszt.js fájlt.
2.) Abba bemásoltam a fenti kódot.
3.) Átírtam a #devel-generate-content-form -ot modulom_form -ra
4.) A count-checked-checkboxes -nak megfelelő ID chechboxot létrehoztam a formon, ellenőriztem a generált html kódot, ezzel a névvel ott lett.
5.) A modulom.module -ban a <?php után beírtam:
drupal_add_js('/sites/all/modulom/js/teszt.js'

És üríthetem a gyorsítótárat, nyomkodhatom az F5-öt, nem történik semmi...

Hibaüzenet nincs, a js filet betölti, mert ha átnevezem akkor reklamál, hogy file not found.

Egyenlőre feladom. DE... nem végleg!

0
0
Sk8erPeter képe

„1.) Létrehoztam egy teszt.js fájlt.
2.) Abba bemásoltam a fenti kódot.”

Kapásból nem jó, direkt mondtam, hogy a Drupalos konvencióknak megfelelően rakd be a kódot (lásd behaviors). :)
Így nem akkor fog lefutni a kód, amikor kell.

Ezt fusd át:
http://drupal.org/node/756722#using-jquery
meg ezt:
http://drupal.org/update/modules/6/7#javascript_compatibility

Valahogy így rakd be a modulod JS-fájljába:

  1. (function ($) {
  2.  
  3. Drupal.behaviors.MODULODNEVECSERELDLE = {
  4. attach: function (context, settings) {
  5. var $checkboxes = $('#devel-generate-content-form td input[type="checkbox"]');
  6.  
  7. $checkboxes.change(function () {
  8. var countCheckedCheckboxes = $checkboxes.filter(':checked')
  9. .length;
  10. $('#count-checked-checkboxes')
  11. .text(countCheckedCheckboxes);
  12. });
  13. }
  14. };
  15.  
  16. })(jQuery);

„5.) A modulom.module -ban a <?php után beírtam:
drupal_add_js('/sites/all/modulom/js/teszt.js'

Megint nem jó. Csak úgy a levegőben nem lóghat a kódod. Ehhez implementálni kell pl. a hook_init() hookot. Ezenkívül az sem jó, hogy ilyen módon adod meg az útvonalat, hogy perjellel kezdődik (mi van, ha alkönyvtárban van a Drupalod?), és erre való a drupal_get_path().

Tehát valahogy így csináld:

  1. /**
  2.  * Implements hook_init()
  3.  */
  4. function MODULODNEVECSERELDLE_init(){
  5. $my_module_path = drupal_get_path('module', 'MODULODNEVECSERELDLE');
  6. drupal_add_js($my_module_path.'/js/teszt.js');
  7. }

Azt, hogy betöltődik-e a fájlod a megfelelő helyen, ne úgy csekkold, hogy átnevezed a fájlt, hogy kapsz-e file not found errort, hanem úgy, hogy megnézed a Source-t a böngészőben (általában Ctrl+U billentyűkombináció), hogy szerepel-e benne a fájl a tag src attribútumában.

A MODULODNEVECSERELDLE értelemszerűen mindenhol legyen lecserélve a saját modulod nevére.

1
0
Schmidt Attila képe

Az _ (aláhúzás) és - (kötőjel) karakterek okoztak kavarodást. megfigyeltem, hogy a generált html kódban az _ karakterek (nem mindenhol) lecserelélődtek - jelre.

Most eljutottam odáig, hogy a JS-ben egy alert-el ki tudom iratni az éppen bejelölt chkbox-ok számát, de a Drupal formon nem jelenik meg.

Ez a generált html kód:

  1. <div class="form-item form-type-textfield form-item-count-checked-checkboxes">
  2. <label for="edit-count-checked-checkboxes">count-checked-checkboxes <span class="form-required" title="Szükséges mező.">*</span></label>
  3. <input type="text" id="edit-count-checked-checkboxes" name="count-checked-checkboxes" value="0" size="60" maxlength="50" class="form-text required" />
  4. </div>

Ez pedig a JS:

  1. $('#edit-count-checked-checkboxes')
  2. .text(countCheckedCheckboxes);
  3. alert (countCheckedCheckboxes);

Szépen megjelenik egy alert üzenetben a bejelölt elemek száma, de a formon változatlan. Miért?

Egyébként NAGYON köszönöm a segitséged!

0
0
Sk8erPeter képe

Nálad az a gond, hogy input-mezőre a .text() függvényt használod, de az egyéb jellegű HTML-elemekre használható (pl. div, span, p, stb.).
Az input-mezőkre a jQuery .val() függvénye használandó.

Esetedben így:
$('#edit-count-checked-checkboxes').val(countCheckedCheckboxes);

A korábban mutatott demót update-eltem ennek megfelelően:
http://jsfiddle.net/Sk8erPeter/kxrTS/3/

U.i.: egyébként ha nem gond, szabad megkérdezni, ezt mire fogod használni? Csak hogy biztos kell-e egyáltalán ez a JS-alapú számolás (required mező). (PHP-vel is megkapod a bepipált elemek számát, JS nélkül pedig mindig 0 lesz elmentve (persze valszeg nem lesz olyan júzered, aki JS nélkül használja a böngészőjét :P); de persze nem ismerem a feladatot, ezért kérdezem ;) )

1
0
Schmidt Attila képe

...egy megrendelés űrlapon van szükségem. Túl a kijelölt sorok számán más adatokat is meg kell jeleníteni -pl. mindösszesen fizetendő, stb, de azt már a fentiek alapján -ha az működik, mindjárt kipróbálom, azt gondolom könnyű lesz. Vagynem... :-)

0
0
Sk8erPeter képe

Szerintem ezt a kalkulációt nem szabadna kliensoldalon (JavaScripttel) elvégezni. Ez szerveroldali feladat.

Kódoláskor mindig paranoiásnak kell lenni, és a legrosszabb esetekre számítani. :)

0
0
Schmidt Attila képe

de, a kliens oldalon megjelenő számok csak tájékoztató jellegűek, természetesen a submit után úgyis számolás jön szerver oldalon és visszaigazoló email. A JS-t az átlag nem kapcsolja ki. (szerintem)

Tudsz megoldást erre a feladatra JS nélkül?

0
0
Sk8erPeter képe

Ha csak tájékoztató jellegű, akkor viszont ne input-mezőbe rakd. Használd úgy, ahogy mutattam, rakd egy divbe, spanbe, p-be, stb., ízlés szerint.
Az input-mező kitöltendő adatokra való, nem arra, hogy egy automatikus kalkuláció megtörténjen vele, és adott esetben a felhasználó nyugodtan felül tudja bírálni, ha olyanja van.
A szerveroldali kódban meg a tömbbe begyűjtött elemek számát kell megszámolni, validálni, hogy tudd, hányat pipált be a checkboxok közül.
De ez már új kérdés témája. :)

0
0
Schmidt Attila képe

egy táblázatban összeraktam az adatokat, az input elem "csak" lett a teszt kedvéért..., akkor még nem tudtam, hogy ennek jelentősége lesz.

0
0
Schmidt Attila képe

KÖSZÖNÖM

0
0
Sk8erPeter képe

Ennek örülök!

1
0