Contare numero di righe in un form dinamico

asevenx

Utente Attivo
7 Nov 2009
312
0
16
Ciao ragazzi, volevo inserire un form dinamico nel mio sito che permetta di aggiungere e eliminare le caselle di input, cosa che faccio grazie ad uno script trovato in internet.

Avrei ora bisogno di contare le righe e riportarle create dinamicamente, visualizzando il risultato all'interno di un input del form, ma non saprei come fare dato che non capisco molto di javascript.

Il javascript:
Codice:
function addRow(tableID) {  
     var table = document.getElementById(tableID);  
	  
     var rowCount = table.rows.length;  
     var row = table.insertRow(rowCount);  
	  
     var cell1 = row.insertCell(0);  
     var element1 = document.createElement("input");  
     element1.type = "checkbox";  
     cell1.appendChild(element1);  
	  
     var cell2 = row.insertCell(1);  
     var element2 = document.createElement("input");  
     element2.type = "text";  
     cell2.appendChild(element2);  			
}  
  
function deleteRow(tableID) {  
     try {  
          var table = document.getElementById(tableID);  
          var rowCount = table.rows.length;  
	  
          for(var i=0; i<rowCount; i++) {  
               var row = table.rows[i];  
               var chkbox = row.cells[0].childNodes[0];  
               if(null != chkbox && true == chkbox.checked) {  
                    table.deleteRow(i);  
                    rowCount--;  
                    i--;  
                    }  
		  
               }  
          }catch(e) {  
          alert(e);  
     }  
}

Il form html:
HTML:
<div class="header">
    <input type="button" value="Aggiungi Riga" onclick="addRow('dataTable')" />
    <input type="button" value="Cancella Riga" onclick="deleteRow('dataTable')" />
    <input type="text" value= '' name="count" />
</div>  
				
    <table id="dataTable"><tr>
        <td><input type="checkbox" name="chk"/></td><td><input type="text" /></td>
    </tr></table>

In poche parole l'input con name "count" deve visualizzare in modo dinamico il numero di righe generate. Grazie a tutti.
 

WmbertSea

Utente Attivo
28 Nov 2014
205
32
28
Ciao, puoi inserire una funzione del genere:
Codice:
function aggiornaCount(){
  document.getElementsByName('count')[0].value = document.getElementById('dataTable').rows.length;
}
e richiamarla dove vuoi nel tuo script, ad esempio alla fine delle due funzioni che aggiungono/rimuovono le righe:
Codice:
function addRow(tableID) {
  // ... il contenuto della funzione
  aggiornaCount();
}

function deleteRow(tableID) {
  // ... il contenuto della funzione
  aggiornaCount();
}
 

asevenx

Utente Attivo
7 Nov 2009
312
0
16
Scusami, ho fatto una modifica togliendo gli inpunt iniziali per farle apparire solo cliccando su "aggiungi". Però il conteggio mi calcola sempre una riga in più.

HTML:
		<script language="javascript">
			function aggiornaCount(){
				document.getElementsByName('count')[0].value = document.getElementById('dataTable').rows.length;
			}		
		
			function addRow(tableID) {  
  				var table = document.getElementById(tableID);  
	  
				var rowCount = table.rows.length;  
				var row = table.insertRow(rowCount);  
	  
				var input_check = row.insertCell(0);  
				var checkbox = document.createElement("input");  
				checkbox.type = "checkbox"; 				
				input_check.appendChild(checkbox);  
	  
				var input_nome = row.insertCell(1);  
				var nome = document.createElement("input");  
				nome.type = "text";
				nome.name = "nome";
 				nome.placeholder = "Nome del prodotto"; 				
				input_nome.appendChild(nome);  	
				
				var input_descrizione = row.insertCell(2);  
				var descrizione = document.createElement("input");  
				descrizione.type = "text";
				descrizione.name = "descrizione";
 				descrizione.placeholder = "Descrizione del prodotto"; 				
				input_descrizione.appendChild(descrizione);  	

				var input_prezzo = row.insertCell(3);  
				var prezzo = document.createElement("input");  
				prezzo.type = "text"; 
				prezzo.name = "prezzo";
 				prezzo.placeholder = "Prezzo"; 
				prezzo.pattern = "[0-9,.]{1,}";
				prezzo.title = "Sono accettati solo numeri, punti e virgole";					
				input_prezzo.appendChild(prezzo);  					
				
				aggiornaCount();				
			}  
  
			function deleteRow(tableID) {  
				try {  
				var table = document.getElementById(tableID);  
				var rowCount = table.rows.length;  
	  
					for(var i=0; i<rowCount; i++) {  
						var row = table.rows[i];  
						var chkbox = row.cells[0].childNodes[0];  
						if(null != chkbox && true == chkbox.checked) {  
							table.deleteRow(i);  
							rowCount--;  
							i--;  
						}  
		  
					}  
				}catch(e) {  
					alert(e);  
				}  
				aggiornaCount();					
			}  
		</script>

HTML:
				<div class="header"><input type="button" value="Aggiungi prodotto" onclick="addRow('dataTable')" /><input type="button" value="Cancella prodotto" onclick="deleteRow('dataTable')" />
				<input name="count" type="text" />  
				
				
				<table id="dataTable"><tr><td><!-- qui la lista dei prodotti--></td></tr></table>
 

WmbertSea

Utente Attivo
28 Nov 2014
205
32
28
Ciao, .rows.length si riferisce al numero di righe dentro la tabella (cioè agli elementi <tr>). Il tuo codice html iniziale presenta già un <tr> dentro la tabella, questo sfalsa chiaramente il conteggio.
Se usi HTML5 puoi semplicemente lasciare vuota la tabella, così che il conteggio sia corretto:
Codice:
<table id="dataTable"><!-- qui la lista dei prodotti--></table>
 
Discussioni simili
Autore Titolo Forum Risposte Data
Monital Contare il numero di righe con php5 PHP 10
C Contare numero record uguali Database 3
xone [PHP] Contare numero dei giorni tra data_in e data_out PHP 11
S [RISOLTO]php contare numero delle query PHP 1
D Contare numero div con una determinata classe Javascript 2
R Contare il numero di click su un link PHP 2
A Contare gli elementi di un array PHP 13
maxnegri Contare sessioni aperte e creare condizione PHP 1
L contare record uguali in file csv PHP 3
B [MySQL] contare quante un oggetto e' presente MySQL 2
elpirata [RISOLTO][Mysql] Contare le occorrenze in un campo tipo varchar MySQL 2
P [PHP] Contare quante volte uno stesso id si ripete nella tabella PHP 12
P [PHP] Contare i mesi con timestamp. PHP 8
A Contare n° totale oggetti da mysql PHP 5
asevenx [Javascript] [AngularJS] contare opzioni selezionate di una select in un elenco ng-repeat Javascript 0
G [ACCESS2007]: contare li ultimi record con lo stesso valore in un campo, finchè il valore non cambia MS Access 2
zorro [PHP] Contare i record di una tabella PHP 6
F Contare le righe con php ad oggetti MySQL 0
F Miglior metodo per contare le righe di una query MySQL 2
S Contare valori uguali in una colonna PHP 2
N Contare post MySQL 2
L contare nodi figli di un determinato nodo madre XML 0
H Contare file presenti nella pagina PHP 3
L Contare determinati valori che si ripetono in una tabella per un detemrinato ID MySQL 2
M contare record db con valore specifico PHP 1
Shyson Contare i caratteri user e dominio Javascript 57
criric Contare le settimane di un mese Snippet PHP 3
nim contare record uguali in tabella PHP 10
anthares Contare record in tabella secondo certe condizioni PHP 21
Monital Contare valori uguali di un array e dividerli in una stringa PHP 12
nim contare frasi che si ripetono PHP 10
A contare iniziali dei nomi Java 3
G contare e sommare dopo JOIN Database 8
M non contare gli accessi dal tuo pc Supporto Mr.Webmaster 1
S Come contare i Download file .zip su html HTML e CSS 10
M Creare un campo input select quantità di un numero intero prelevato dal db PHP 3
M Numero random non ripetitivo Java 2
Cosina Mostrare immagini da una cartella, ma solo un numero definito PHP 12
Tommy03 Select in ordine per numero di record MySQL 7
C analisi numero parole Programmazione 2
A [PHP] calcolo numero di ore effettuate PHP 7
S [PHP] Convertire un orario in un numero decimale PHP 2
M [PHP] Visualizzare un array partendo dal numero 1 e non 0 PHP 5
L Xampp, wordpress e numero di porta Web Server 1
S [MS Access] trasformare un numero in lettere in un report MS Access 1
N [PHP] Conversione di un numero in ore PHP 2
C [PHP] Numero in formato 1e-5 PHP 0
D profilo fotografico e numero like Facebook 0
FacebookPrimeStore [VENDO] Profilo facebook con numero telefonico verificato. Occasione. Annunci servizi di Social Media Marketing 1
M VENDO ACCOUNT FACEBOOK DONNA CON NUMERO VERIFICATO Annunci servizi di Social Media Marketing 0

Discussioni simili