Strona 1 z 1

Dynamiczne dodawanie elementów!

Napisane: środa, 9 maja 2012, 18:37
przez neytiri
Dzisiaj nie mogę dojść do tego jak dobrać się do danych , które będę sobie generować dynamicznie na stronie na liście.

Code: Zaznacz cały

    $(function()
    {
    $('#dodaj').click(function()
    {
       var osoba = $('#nazwiska_osob :selected').html();
       var str = '<li>';
       str+= '<label>Osoba  : </label>'+osoba+' ';
       str+= '<input type="button" id ="remove" value="Usuń" class="btnm"/>';
       str+= '</li>';
       $('#osoba_ocen').append(str);
    });
    $('#remove').live('click',function()
    {
       $(this).parent('li').remove();
    });

    });

Z kodem jest ok.


Nie wiem jak dobrać się do tych danych, które wybrał uzytkownik i które pojawiły mi się w na liście. Rozumiem, że powinnam się podczepić pod jakiś button, który będzie akceptował wybrane osoby , tylko nie wiem jak dojść do tych danych.

Myślałam, żeby umieszczać je w jakimś tagu z id, ale nie wiem jak ustawić zmienną i kiedy ją incrementować? ID mogłoby być po prostu jakąś kolejną liczbą.

Dane chce odczytać w php, to już wiem jak je przesłać.
wiem, też że za pomocą funkcji each mogę sobie dynamicznie pododawać klasy np. Ale jakoś tego nie mogę koncepcyjnie ogarnąć - kiedy i w którym miejscu to robić?

Nie do końca też rozumiem od czego zależy gdzie pojawi się moja dynamiczna lista.
U mnie pojawia się ona tam gdzie trzeba, ale nie jestem pewna czy to przypadek.

Konstrukcja w html :

Code: Zaznacz cały

<fieldset>
<legend>Wybrane osoby</legend>
<table border=0 cellpadding=2 cellspacing=4 style="margin:5px;">
<tr>
<td><label>Nazwiska osób :<br /></label></td>
<td>
<ul id="osoba_ocen">
<select name="z_nazwiska_osob" id="z_nazwiska_osob">{html_options options=$s_nazwiska_osob selected=$f.nazwiska_osob}</select>
<input type="button" id="dodaj" class ="btnm" value = "+" ><input type="button"  class ="btnm" value = "OK" onDblClick = "ok();">
</ul>

tu pojawia się moja lista!!!!!!

</td>
</tr>

</table>
</fieldset>
Czy można jakoś sterować tym , gdzie mają się pojawiać te dane, pewnie można by dodać jakiegoś diva?

Re: Dynamiczne dodawanie elementów!

Napisane: czwartek, 10 maja 2012, 10:43
przez Morfidon
Lista doda się tam gdzie stwierdzisz, aby została dodana. Program nie zadziała inaczej, niżeli Ty mu zlecisz.

"$('#osoba_ocen').append(str);"

append funkcja z ang. dodać, dodaje po elemencie #osoba_ocen zawartość zmiennej str. Tu nie ma żadnej filozofii. W informatyce zawsze będzie tak jak podamy aby było.

Niestety pierwszego pytania nie do końca rozumiem. Kiedy zadajesz pytanie mi lub też innej osobie na jakimkolwiek forum musisz nauczyć się zapominać o tym co wiesz i wczuć się w rolę osoby czytającej. Ona nie zna Twojego problemu wcale i nie siedziała nad nim paru godzin ;)

Jeśli chcesz wyróżnić czymś dane z bazy danych to można np. tworzyć atrybut ID np. KL105, gdzie KL identyfikuje dane elementy, a 105 to np. ID rekordu z bazy danych przez co zachowa się na pewno unikalność elementów i ułatwi to również później wybór tych elementów. Musisz do tego napisać funkcję, która będzie analizowała string "KL000" i wybierała z niego numery.

Re: Dynamiczne dodawanie elementów!

Napisane: czwartek, 10 maja 2012, 13:02
przez neytiri
Dzięki , właśnie za wyjaśnienia.

Co do danych to chodzi mi już o wynik finalny : czyli po tym jak użytkownik wybrał już sobie odpowiednie dane, ja chcę je jakoś przesłać na serwer, aby je zapisać do bazy.
Na podstawie mojej funkcji otrzymam :

Code: Zaznacz cały

<li>
<label>Osoba : </label>
Kowalski Jan
<input id="remove" type="button" value="Usuń">
</li>
<li>
<label>Osoba  : </label>
Nowacki Kuba
<input id="remove" type="button" value="Usuń">
</li>
Jak przesłać te dane do php, aby je potem odczytać - jak je wyróżnić?

Re: Dynamiczne dodawanie elementów!

Napisane: czwartek, 10 maja 2012, 14:28
przez Morfidon
w span, lub diva i wybrać po nazwie klasy.

Re: Dynamiczne dodawanie elementów!

Napisane: wtorek, 15 maja 2012, 20:33
przez neytiri
Jakoś udało mi się to ogarnąć.

Mam tylko problem z inputem.
Może po kolei
1. w mojej funkcji wybieram sobie najpierw wybraną treść selecta i jego value, jako moje późniejsze id do inputa,

Code: Zaznacz cały

        var osoba = $('#lista_osob :selected').html();
	var id = $('#lista_osob ').val();
2.Jak wykonam alert na tych zmiennych - czyli osoba i id to wszystko jest ok, wynik jest taki jak oczekiwałam - czyli osoba - to Kowalski Jan, a id to 1.

3.następnie z tych danych tworzę dynamicznie inputa :

Code: Zaznacz cały

	var str = "<tr>";
	str+= "<td> <input type='text' class = 'wybrane_osob' readonly id="+id+" value ="+osoba+" />";
	str+= '<input type="button" id ="remove" value="Usuń" class="btnm"/></td>';
	str+= '</tr>';
Niestety w wyniku moich poczynań otrzymany input wygląda tak :

Code: Zaznacz cały

<tr>
<td>
<input id="1" class="wybrane_osob" type="text" jan="" value="Kowalski" readonly="">
<input id="remove"  type="button" value="Usuń">
</td>
</tr>
Jak widać pojawia się w nim atrybut jan="", co wpływa na to, że string osoba został tak dziwnie podzielony? Jak zrobić aby zmienna osoba została zapisana w całości do value????

Re: Dynamiczne dodawanie elementów!

Napisane: wtorek, 15 maja 2012, 21:47
przez Morfidon
Spróbuj tak?

Code: Zaznacz cały

str+= "<td> <input type='text' class = 'wybrane_osob' readonly id='"+id+"' value ='"+osoba+"' />";

Re: Dynamiczne dodawanie elementów!

Napisane: wtorek, 15 maja 2012, 22:17
przez neytiri
Tak, dzięki , to była wina tych """" i ''''''. Wszystko jest ok.