ugrás a tartalomhoz

Jquery: Edit on place

zoliky · 2008. Szep. 10. (Sze), 16.30
Van egy jQuery kod amely lehetove teszi, hogy egy szoveget modositsak amikor raklikelek. A kovetkezot csinaltam. A weben talaltam egy demot: http://iamntz.com/wdb/EIP/pasul2.html

Az en kodom is mukodik, csak sajnos masodjara nem tudom hasznalni. Szoval modositom a szoveget azutan mar nem valaszol a $('.username').click(function()

Itt a HTML kodom:
<body>
  Username: <span class="username">Author Name</span>
</body>
es a jQuery:

$(document).ready(function() {
  $('.username').click(function() {
    var editBox = '<input type="text" value="' + $(this).html() + '" />';
    $(this).after(editBox).remove();
    $('input').focus();
    
    $('input').blur(function() {
      var edited = '<span class="username">' + $('input')[0].value; + '</span>';
      $(this).after(edited).remove();
    });
  });
});
Hogyan lehetne megcsinalni, hogy tobbszor tudjam editalni a szoveget ? Mindig ervenyes legyen a Click event.
‹ SELECT, több mező kiválasztása java script navigáció fájllista alapján ›
 ■
1

Nyilván nem működik...

tgr · 2008. Szep. 10. (Sze), 18.54
...mert kitörlöd az elemet, amire az eseménykezelőt tetted.

remove() helyett próbálj hide()-ot, az értéket pedig a már létező spanba írd bele pl. innerHTML-lel.
2

ok

zoliky · 2008. Szep. 10. (Sze), 19.16
Erdekes, mert ugyanolyan SPAN tagot hozok letre a vegen. De valoszinuleg jQuery eszleli a torlest.
Kiprobalom az innerHTML megoldast.
3

Ugyanolyan?

Poetro · 2008. Szep. 10. (Sze), 20.02
Az ugyanolyan az azert távol áll tőle, ugyanis nem UGYANAZ, azaz vagy klónozd, vagy pedig rejtsd el. A remove törli az element a hozzáadott eseményekkel együtt, amiket nem adsz hozzá az újonnan létrehozott elemhez.
4

INPUT

zoliky · 2008. Szep. 10. (Sze), 20.22
Ok de az input mezot torolhetem, ugye ? csak akkor van ra szukseg amikor modositom a szoveget.
7

Ha van rajta eseménykezelő

tolmi · 2008. Szep. 11. (Cs), 09.46
...akkor nem törölheted.
5

Sőt .clone(true);

Ustak · 2008. Szep. 10. (Sze), 20.54
imígyen fogja az eseménykezelőket is klónozni.
6

Ok, mukodik

zoliky · 2008. Szep. 11. (Cs), 00.53
A kovetkezo kodot irtam:
$(document).ready(function() {
  $('.username').click(function() {
    var editBox = '<input type="text" value="' + $(this).html() + '" />';
    $(this).after(editBox).hide();
    $('input').focus();
    
    $('input').blur(function() {
       var inputVal = $(this)[0].value;
       $(this).remove();
      
       $('.username').html(inputVal).show();
    });
  });
});
Most mukodik szepen, de van egy kerdesem.
Ha szeretnem lementeni az adatot modositas utan (amikor a .blur bekapcsolodik) el kell kuldenem az adatot egy PHP szkriptnek es az beleirja adatbazisba ? Ezt nevezik AJAX-nak ?
8

Ezt

tolmi · 2008. Szep. 11. (Cs), 09.47
Igen és igen.