[js][php] Obliczenia matematyczne - dodawanie pola, Dodawanie dodatkowego pola a obliczenia w locie Opcje

[smarcz]

Witam! Mam taki problem: chciałbym napisać skrypt, który w locie obliczał by dane liczbowe w formularzu. Formularz ten składa się z trzech sekcji (pól input) np:
1.) Cena
2.) Zakup
3.) Koszty

Pole input 1 i 2 są stałymi, ale input z pola 3 można dodawać w zależności od sytuacji. Dodawanie nowego pola input odbywa się za pomocą php.

Jak napisać skrypt JS który obliczał by właściwie wypełnione pola input niezależnie od ilości dodanych nowych pól o nazwie koszty.

Dla stałych 3 parametrów potrafię napisać skrypt. Gorzej jeżeli idzie o dodatkowe pola input w dziale koszty.
Dodam, że pole koszty zbudowałem w sposób <input type="text" name="koszty[1]"> w zależności od dodanej liczby pól liczba w nawiasie się zmienia o 1 dla każdego kolejnego pola.

Jak napisać funkcję licz() obliczającą dane i wypisującą w dodatkowym polu input??

Dziękuję:)

[lord_t]

Podpowiedź:)

[HTML] pobierz, plaintext 
<script>
function licz()
{
var x=document.getElementsByName('box');
var suma=0;
for(i=0;i<x.length;i++)
 suma+=parseFloat(x[i].value);
alert(suma);
}
 
</script>
 
      <div onclick="licz()">Licz</div>
      <input type="text" name="box">
      <br>
      <input type="text" name="box">
 
      <input type="text" name="box">
[HTML] pobierz, plaintext 

(Dla JS znaczniki script powinny mieć odpowiednie atrybuty, ale nie chciało mi się ich pisać)

Ten post edytował lord_t 12.05.2008, 22:25:25

[smarcz]

OK! Zrobiłem coś takiego na podstawie przedstawionej podpowiedzi. Ale czemu to nie działa pod Firefoxem a tylko i jedynie pod Explorerem??

[HTML] pobierz, plaintext 
<script>
function licz()
{
var x=document.getElementById('cena');
var y=document.getElementById('sprzedaz');
 
x = parseFloat(x.value);
y = parseFloat(y.value);
 
 
var k=document.getElementsByName('box');
var licz=0;
for(i=0;i<k.length;i++){
licz+=parseFloat(k[i].value);
}
var suma = 0;
suma = y - x - licz;
//alert(suma);
 
maska = /^\d+$/;
  if (maska.test(y)) {
    dochod.value = suma;
  } else {
    dochod.value="";
  }
}
 
</script>
 
<div onclick="licz()">Oblicz <input type="text" name="dochod"></div>
 
 
<input type="text" name="sprzedaz" id="sprzedaz">Sprzedaz<br>
<input type="text" name="cena" id="cena" onkeyup="licz()">Zakup<br>
 
<input type="text" name="box" onkeyup="licz()">Koszt
<br>
<input type="text" name="box" onkeyup="licz()">Koszt
<br>
<input type="text" name="box" onkeyup="licz()">KOszt<!--Ostatni wiersz powinien zawierać zdarzenie onkeyup-->
[HTML] pobierz, plaintext 

Kurde nie mam pojęcia!?

[ferr]

Jak nie dziala w FF to z reguly konsola bledow pokazuje co i jak jest zle, nieprawdaz?

[smarcz]

Konsola błędów podaje ze dochod jest niezdefiniowany?? Kurcze i co zrobić aby w to pole wpisywał się wynik obliczeń??

[revyag]

Dodaj:

Kod

var dochod=document.getElementById('dochod');

Zmień

[HTML] pobierz, plaintext 
<input type="text" name="dochod" />
[HTML] pobierz, plaintext 

na

[HTML] pobierz, plaintext 
<input type="text" name="dochod" id="dochod" />
[HTML] pobierz, plaintext 

Odwołuj się poprzez id. Teraz robisz to przez zmienną globalną którą rozumie tylko ie. Takie praktyki są niewskazane.

[smarcz]

Bardzo dziękuję za odpowiedź. W między czasie zrobiłem coś takiego. Dodatkowo dołączyłem system poprawy przecinka "," na kropkę "." aby poprawnie wypełniać pola.

Z podpowiedzi zaraz skorzystam (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) . Tymczasem mój kod:

[HTML] pobierz, plaintext 
<script>
function licz(dochod)
{
var x=document.getElementById('cena');
var y=document.getElementById('sprzedaz');
 
l=x.value;
l=l.replace(',','.');
l=parseFloat(l);
 
r=y.value;
r=r.replace(',','.');
r=parseFloat(r);
 
 
var k=document.getElementsByName('box');
var licz=0;
for(i=0;i<k.length;i++){
 
z=k[i].value;
z=z.replace(',','.');
z=parseFloat(z);
 
licz+=z;
}
var suma = 0;
suma = r - l - licz;
//alert(suma);
 
    dochod.value = suma;
 
 
}
 
</script>
<form name="f1">
<div onclick="licz(document.f1.dochod)">Licz </div>
<input type="text" name="dochod"><br>
 
<input type="text" name="sprzedaz" id="sprzedaz">Sprzedaz<br>
<input type="text" name="cena" id="cena" >Zakup<br>
 
<input type="text" name="box" >
<br>
<input type="text" name="box" >
 
<input type="text" name="box" onkeyup="licz(document.f1.dochod)"><!--Ostatni wiersz powinien zawierać zdarzenie onkeyup-->
</form>
[HTML] pobierz, plaintext 

A to ten sam skrypt z wykorzystaniem podpowiedzi. Serdeczne dzięki (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

[HTML] pobierz, plaintext 
<script>
function licz(dochod)
{
var x=document.getElementById('cena');
var y=document.getElementById('sprzedaz');
var dochod=document.getElementById('dochod');
 
l=x.value;
l=l.replace(',','.');
l=parseFloat(l);
 
r=y.value;
r=r.replace(',','.');
r=parseFloat(r);
 
 
var k=document.getElementsByName('box');
var licz=0;
for(i=0;i<k.length;i++){
 
z=k[i].value;
z=z.replace(',','.');
z=parseFloat(z);
 
licz+=z;
}
var suma = 0;
suma = r - l - licz;
//alert(suma);
 
    dochod.value = suma;
 
 
}
 
</script>
<form name="f1">
<div onclick="licz()">Licz </div>
<input type="text" name="dochod" id="dochod"><br>
 
<input type="text" name="sprzedaz" id="sprzedaz">Sprzedaz<br>
<input type="text" name="cena" id="cena" >Zakup<br>
 
<input type="text" name="box" >
<br>
<input type="text" name="box" >
 
<input type="text" name="box" onkeyup="licz()"><!--Ostatni wiersz powinien zawierać zdarzenie onkeyup-->
</form>
[HTML] pobierz, plaintext