Přidání řádku do tabulky

Fórum › JavaScript, AJAX, jQuery

Toto vlákno bylo označeno za vyřešené — příspěvek s řešením.

Row0

Stálý člen

14. 2. 2012 #1

Dobry Den mohl by mi někdo prosím poradit jak v ve scriptu viz. níže udělám to že když se mi přidá řádek se třemi buňkami tak aby v každé buňce byl input s unikátním jménem.

například :
<tr>
<td><input name="nazev(unikatni cislo)" ... > </td>
<td><input name="mnozstvi(unikatni cislo)" ... > </td>
<td><input name="jednotka(unikatni cislo)" .... > </td>
</tr>

v JS jsem začátečník. Prosím o radu a zároveň o vysvětlení skriptu tak abych to pochopil jak tento skript pracuje.
Předem děkuji za opověd

Index.php ->

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

function addRow(id){
var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
var row = document.createElement("TR")
var td1 = document.createElement("TD")
td1.appendChild(document.createTextNode("f"))
var td2 = document.createElement("TD")
td2.appendChild (document.createTextNode("ff"))
var td3 = document.createElement("TD")
td3.appendChild (document.createTextNode("ss"))
row.appendChild(td1);
row.appendChild(td2);
row.appendChild(td3);
tbody.appendChild(row);
}

</script>

<form>

<tr><th>Název</th><th>Množství</th><th>Jednotka</th></tr>
<tr>
<td>
<input type="text" name="nazev" size="10">
</td>
<td><input type="text" name="mnozstvy" size="10"></td>
<td><input type="text" name="jednotky" size="5"></td>
</tr>

</table>
<a rel="nofollow" href="javascript:addRow('myTable')">Přidej řádek</a><br />

</form>

Nahlásit jako SPAM

IP: 88.101.240.–

darkwind+1

Newbie

14. 2. 2012 #2

Zajímavé

Vůbec ybch nepřidával unikátní ID, dělal bych to asi tak, že bych pojmenoval názvy inputů jako nazev[], mnozstvi[] a jednotka[].

Po odeslání to vytvoří tři array, které už jednodušše spojíš k sobě v PHP.

Nahlásit jako SPAM

IP: 62.77.119.–

Row0

Stálý člen

14. 2. 2012 #3

#2 darkwind

Spis bych to ted resil unikatnim value="XX" ale zajimame spise ten JS jak udelat pridani radku se tremi inputy

Nahlásit jako SPAM

IP: 88.101.240.–

darkwind+1

Newbie

14. 2. 2012 #4

toto ti nefunguje?

td1.appendChild(document.createTextNode('<input type"text" name="nazev[]" />'))

Nahlásit jako SPAM

IP: 62.77.119.–

Row0

Stálý člen

14. 2. 2012 #5

#4 darkwind
ne bere to jako textovy retezec takze se mi v prvni bunce objevi akorat <input type"text" name="nazev[]" />

nemuze byt treba nejaky priblem z funkci document.createTextNode ?

Nahlásit jako SPAM

IP: 88.101.240.–

darkwind+1

Newbie

14. 2. 2012 #6

aha, jasně, přemyšlet bych u toho mohl :) document.write by mělo fungovat

Nahlásit jako SPAM

IP: 62.77.119.–

Row0

Stálý člen

14. 2. 2012 #7

#6 darkwind
bohuzel to nefunguje aktualizuje se mi cela stranka a na ni se zobrazi pouze jeden input muzu poprosit aby si skusil upravit primo ten scipt popripade html jestli tam nemam nejakou syntaktickou chybu

Nahlásit jako SPAM

IP: 88.101.240.–

darkwind+1

Newbie

14. 2. 2012 #8

Zajímavé

#7 Row

function addRow(id){
	var table = document.getElementById(id);
	var row = table.rows[1];
	table.innerHTML += row.innerHTML; 
}

nahrad tu funkci za toto, zkopiruje to první řádek tabulky a vloží ho na konec tabulky

Nahlásit jako SPAM

IP: 62.77.119.–

Row0

Stálý člen

14. 2. 2012 #9

Mockrát děkuji za tvůj čas sem rád že se najde někdo takhle ochotný :)) a unikatni nazev tedy poresim php polem v inputu ? ve formulari ?

Nahlásit jako SPAM

IP: 88.101.240.–

darkwind+1

Newbie

14. 2. 2012 #10

Nejlepší odpověď

ještě jsem zjistil, že to při přidání smaže obsah původních inputů, to se Ti asi nehodí... :-)

navážu na ten tvůj původní js, i když by to asi šlo čistěji trochu

function addRow(id){
	var row = document.createElement('tr'); 
        var td1 = document.createElement('td'); 
        var td2 = document.createElement('td');
	var td3 = document.createElement('td');
        row.appendChild(td1); 
        row.appendChild(td2); 
	row.appendChild(td3); 
        td1.innerHTML = ('<input type"text" name="nazev[]" />');
        td2.innerHTML = ('<input type"text" name="mnozstvi[]" />')
	td3.innerHTML = ('<input type"text" name="jednotka[]" />')
        var table = document.getElementById(id); 
        table.appendChild(row); 
}

co se PHP týče, mel by si do něj dostat tři pole, jak jsem psal - $_POST['nazev'],$_POST['mnozstvi'],$_POST['jednotka'], tak je jen zkombinuj do jednoho

Nahlásit jako SPAM

IP: 62.77.119.–

← Zpět na seznam vláken ← Zpět do Fóra