ugrás a tartalomhoz

Javascript form handling

robb83 · 2010. Júl. 16. (P), 22.08
Sziasztok,

Légyszives mutassatok példát arra, hogy kell a form kezelést kliensoldalon elvégezni, gondolok itt a form elemei feltöltése Objektumból, form "submit" eseménykor a form elemei objektumba töltés, validálás.

Szóval valami féle Binding megoldás érdekelne.
Jelenleg most JQuery-vel probálkozom, de ha tudtok valami jó framework-et amivel az ehhez hasonló kliens applikácók könnyen elkészíthetők azt külön megköszönném.

Köszönöm.
‹ CSS ul li több soros tartalom esetén szétcsúszás HTML hírlevél + képek ›
 ■
1

jQuery

Poetro · 2010. Júl. 16. (P), 22.22
A jQuery teljesen alkalmas erre, ha a submitot extrákkal akarod bővíteni, érdemes lehet a forms plugin beszerzése is. Egyébként eléggé triviális jQuery-vel formot feltölteni. Validálásra is léteznek pluginok.
var form = $('form').bind('submit', function () {
      // Validalom
      if (!valid) {
        // Nem valid, akkor a form submit-ját elnyeljük, 
        // azaz nem fogja a böngésző elküldeni a formot.
        return false;
      }
    }),
    feltoltes = {
      'nev1' : 'ertek1',
      'nev2' : 'ertek2'
    };
    
$.each(feltoltes, function (name, value) {
  form.find('input[name="' + name + '"]').val(value);
});
2

RE: jQuery

robb83 · 2010. Júl. 16. (P), 22.31
Igen, igen ezekre én is gyorsan találtam példát sőt feltöltésre itt egy egész igéretes plugin: http://makoto.blog.br/formFill/.

Ami engem most jobban izgat az, hogyan tudnám ugyanezt objektumba vissza tölteni (a többi form kezelés részt csak azért írtam hátha valaki komplexebb megoldást tud).

Engem most kicsit csak az fusztrál, hogy nem találtam még rá semmi plugint vagy kész megoldást, pedig tuti hogy ezzel már szembe került valaki.

De addig is most megpróbálom a formFill plugint visszafele elsütni.
3

visszatölteni

Poetro · 2010. Júl. 16. (P), 22.50
Ami engem most jobban izgat az, hogyan tudnám ugyanezt objektumba vissza tölten

Mit akarsz visszatölteni, milyen objektumba?
Alapból a jQueryben létezik a serializeArray ami egy formból készít egy tömböt, de a jQuery form plugin még több hasonló sőt ennél jóval bővebb tudású függvények vannak erre.
4

RE: visszatölteni

robb83 · 2010. Júl. 16. (P), 23.17
Bocsi lehet rosszul nézem, de az API-füllecsként csak olyan serializáló található ami a form elemeiből query stringet épít, hogy könnyen eltud küldeni a server oldalnak, nekem olyan megoldás kell ami a user objektumomat frissítené kliensoldalon.

Vagyis például, ilyesmi lépésekből állna az én megoldásom:

var user = {id: 1, name:"robb83", email:"robb83@localhost"};

$('#user_editor_form').fill(user); // form feltöltése adatokkal

$('#user_editor_form').submit(function()
{
    var formValues = $(this).getValues(); // vagy akár serializeArray(), adatok kinyerése a formból
    if ($(this).IsValid())
    {
        UpdateAndSave(user, formValues); // user objektum frissítése
    }
    return false;
});
5

Nagyobb ágyú

janoszen · 2010. Júl. 17. (Szo), 00.15
Ha esetleg egy kicsit nagyobb ágyúra vágysz, akkor nézd meg a YUI 2-t. Ha tüzérségre akarsz upgradelni, akkor esetleg ExtJS, de az pilótavizsgás.
6

:)

ironwill · 2010. Júl. 17. (Szo), 09.11
Ez tetszett.
Hogy rá se kelljen lőni.. a verebet a szívroham intézze el.. :)