ugrás a tartalomhoz

Több Select-ből adatok kinyerése

cszlak · 2014. Okt. 10. (P), 09.17
Sziasztok.

Olyan problémám lenne, hogy van több dinamikusan létrejövő Select-em és Inputom.
Szeretnék adatokat kinyerni belőlük.

html:
  1. <script type="text/javascript">  
  2. function szamolo() {      
  3.     var price = 0;   
  4.     var units=0;  
  5.     var vat=0;  
  6.     var id = 0;  
  7.     var teszt =0;     
  8.   
  9.  $('.product').each(function() {     
  10.  id += parseFloat( $(this).val() );   
  11.  price += parseFloat ($('.product').find('option:selected').attr("id"));  
  12.  vat += parseFloat   ($('.product').find('option:selected').attr('class'));  
  13.   //teszt +=  parseFloat ($('.product').find('option:selected').attr("id"));  
  14.  } );  
  15.  $('.units').each(function() {      units += parseFloat( $(this).val() ); } );  
  16.  var szorzat = price * units;  
  17.  alert(id+': '+price + ' * '+units+ ' = '+szorzat+' | Vat:'+vat+' | teszt:'+teszt);  
  18.   $('#net_amount').prev('input').val(szorzat);  
  19. };    
  20. </script>  
  21.   
  22.   
  23. <form action="button2.php" method="post" enctype="multipart/form-data"    
  24. role="form" id="TextForm">  
  25.  <div class="form-group" style="padding-bottom:30px;" >  
  26.  <select class="form-control product" name="product[]" id="product"  style="width: 60%;" onChange="szamolo();">  
  27.   <option    selected="selected"    value="1" id="100" class="12.5">name100</option>  
  28.   <option      value="2"  id="200"  class="13">name200</option>  
  29.   <option      value="4"  id="300"  class="13">name300</option>  
  30. </select>   
  31. <input style="width: 50%; float:left;" name="unit[]" id="unit" type="text"  value="0"  class="form-control units" onChange="szamolo();" >  
  32. </div>  
  33.  <div class="form-group" style="padding-bottom:30px;" >  
  34.  <select class="form-control product" name="product[]" id="product"  style="width: 60%;" onChange="szamolo();">  
  35.   <option    selected="selected"    value="1" id="100" class="12.5">name100</option>  
  36.   <option      value="2"  id="200"  class="13">name200</option>  
  37.   <option      value="4"  id="300"  class="13">name300</option>  
  38. </select>   
  39. <input style="width: 50%; float:left;" name="unit[]" id="unit" type="text"  value="0"  class="form-control units" onChange="szamolo();" >  
  40. </div>  
Jelenleg a 'price' értéket duplán veszi be.
Gondolom ez a sor hibás:
  1. price += parseFloat ($('.product').find('option:selected').attr("id"));  
ha lecserélem erre:
  1. price += parseFloat ($(this).find('option:selected').attr("id"));  
Akkor NaN -t ad ki.
‹ ExtJS licenselés Parallax design ›
 ■
1

Mit ad vissza a

Poetro · 2014. Okt. 10. (P), 10.24
Mit ad vissza a $(this).find('option:selected').attr("id") ? Szerintem undefined-ot, ami miatt lesz NaN. Ezt az is okozhatja, hogy egyik sincs kiválasztva, vagy a kiválasztottnak nincs id attribútuma, vagy az nem szám. Jó lenne előbb kiíratni, hogy miket sikerült kiválasztani, és azoknak mi az id attribútuma. Ehhez legegyszerűbb a console.log-ot illetve a böngészőbe épített debugger-t használni.
3

console.log

cszlak · 2014. Okt. 10. (P), 10.45
kék karika 2 és 100
2

jsfiddle

Endyl · 2014. Okt. 10. (P), 10.32
Kicsit átkozmetikáztam jsfiddle-re; this-t használva sem ír NaN-t nálam, hacsak nem hagyom valamelyik mezőt üresen.

Meg amit Poetro írt; lépkedj végig a böngésző debuggerével a kódon, és meglátod, hogy mindenhol olyan értéket kapsz-e, mint amire számítasz.
4

Ez az hogy nem

cszlak · 2014. Okt. 10. (P), 10.49
Az első select dupla értéket ad, a többi meg simát.
5

Meg van a hiba

cszlak · 2014. Okt. 10. (P), 11.03
Egész más volt a probléma forrása, de a consol.log jó tipp volt.

A sorokat generáltam, és az új sorhoz mintát adtam meg neki (rejtve), és azt a mintát is hozzá vette.
Raktam a selectbe egy új sort elsőnek:
  1. <option  value="0" id="0" selected="selected"  class = "0" >Select product...</option>  
Ez így megoldotta a problémát.

Köszönöm a segítséget!!!!!