Sabiranje dva polja i upis u trece (ne radi)

Sabiranje dva polja i upis u trece (ne radi) 14.08.2018. u 20:05 · pre 99 meseci #1

Pozdrav.

Kopirao sam izvorni kod sa --> http://jsfiddle.net/g7zz6/ , medjutim, kod mene ne funkcionise ( trece polje za rezultat ne reaguje ni na jedan upis).

Gde gresim?

Code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>

<input type="text" class="input value1">
<input type="text" class="input value2">
<input type="text" disabled="disabled" id="result">

</body>
</html>

<script>
   $(document).ready(function(){
    $(".input").keyup(function(){
          var val1 = +$(".value1").val();
          var val2 = +$(".value2").val();
          $("#result").val(val1+val2);
   });
});
</script>

Re: Sabiranje dva polja i upis u trece (ne radi) 14.08.2018. u 20:19 · pre 99 meseci #2

a jel imas jquery ubacen ?

<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js" ></script>

Re: Sabiranje dva polja i upis u trece (ne radi) 14.08.2018. u 20:22 · pre 99 meseci #3

Da, pocetnicka greska.
Resilo je problem.

Ziv mi bio Nemnesicu

Re: Sabiranje dva polja i upis u trece (ne radi) 14.08.2018. u 20:32 · pre 99 meseci #4

I ti mi poziveo moj mogrinjo lepi!

Re: Sabiranje dva polja i upis u trece (ne radi) 18.08.2018. u 00:33 · pre 99 meseci #5

Da ne otvaram novu temu, s obzirom da se radi o istoj skripti, samo malo drugacijoj primeni

-----

Proizvod 1:

cena:
popust:
konacna cena (auto calculated):

Proizvod 2:

cena:
popust:
konacna cena (auto calculated):

Total (konacna P1 + konacna P2) =

-----

Skripta funkcionise savrseno prilikom prvog unosa, i total (konacna cena prozivoda 1 + proizvoda 2) ispisuje dobar zbir, medjutim, u koliko se vratim pa umesto 10% popusta stavim 5%, zbir u totalu se ne menja vec ostaje zakucan za prethodni iznos.
Iznos u totalu se azurira samo kada selektujem (ili TABujem) polje "konacna cena", nakon izmene cene ili popusta.

Kako bih mogao da u svakoj prilici imam live rezultat, bez obzira da li naknadno menjao procenat/cenu?

Re: Sabiranje dva polja i upis u trece (ne radi) 18.08.2018. u 02:25 · pre 99 meseci #6

1. napravi f-ju koja radi sta treba da radi od matematike (racun vrednost na osnovu cene i popusta);

2. u istoj ili drugoj f-ji postavi da se setuju vrednosti koje je potrebno setovati kao rezultat matematike tj. tacke 1.

3. dodeli za sve INPUT elemente, odredjene dogadjaje (ako je gornji kod aktuelan onda je to samo dogadjaj keyup) kao sto je vec uradjeno, da poziva istu f-ju za obracun.

Evo koda na fiddle-u varijanta zbir i cena sa popustom.

Takodje posto je u gornjem kodu stavljeno za sve INPUT elemente, date su obe varijante kad se 'hvata' event za sve ili samo za odredjene INPUT elemente.

Pored KEYUP moze da se koristi CHANGE event sto bi onda reagovalu na svaku promenu a ne samo nakon pritiska tastera na tastaturi.

Click here to see Fiddle example code

code dump za svaki slucaj

Code:

<div id="banner-message">
  <p>Matematika</p>
  <input type="text" id="value1" class="input value1">
  <input type="text" id="value2" class="input value2">
  <input type="text" id="result" disabled="disabled" id="result">
</div>

function RacunajZbir()
{

  var val1 = Number(+$(".value1").val());
  var val2 = Number(+$(".value2").val());
  var zbir = Number(val1+val2);

  $("#result").val(zbir);

}

function CenaSPopustom()
{

  var val1 = Number(+$(".value1").val());
  var val2 = Number(+$(".value2").val());
  var popust = Number((val2/100) * val1);
  var iznos = Number(val1-popust);

  $("#result").val(iznos);

}

$(document).ready(function()
{

  //RacunajZbir();
  //$(".input").keyup(function(){ RacunajZbir(); });
  //$(".value1").keyup(function(){ RacunajZbir(); });
  //$(".value2").keyup(function(){ RacunajZbir(); });

  CenaSPopustom();
  //$(".input").keyup(function(){ CenaSPopustom(); });
  $(".value1").keyup(function(){ CenaSPopustom(); });
  $(".value2").keyup(function(){ CenaSPopustom(); });

});

Re: Sabiranje dva polja i upis u trece (ne radi) 18.08.2018. u 22:58 · pre 99 meseci #7

Hm, nisam siguran da li sam te dobro ispratio.

U ovom slucaju sto si ti okacio, nalazi se jedno "result" polje koje prikazuje ukupno stanje.

Recimo da je "matematika" jedan proizvod, a ja imam jos dva, sto znaci da bi "result_total" polje kalkulisalo zbir izmedju "matematika 1 result", "matematika2 result" i "matematika3 result".

U ovom slucaju, kada koristeci tvoj kod to napravim, result_total prikaze ukupno stanje iz sva 3 proizvoda, ali ako npr u matematici 1 promenim popust, u mat1 resultu se prikazuje ali result_total ne menja cifru sve dok ne kliknem na "mat.1 result".

Re: Sabiranje dva polja i upis u trece (ne radi) 18.08.2018. u 23:41 · pre 99 meseci #8

@magarinjo --- Ja nisam razmueo vas poslednji post/odgovor.

Da ponovimo:

Prvi primer bi recimo bio (shodno potrebi je dato vise primera samo sto su neke linije koda iskljucene sa //)

Dole navedeni primer racuna cenu sa popustom, gde je:

- osnovna cena uneta vrednost u polje 'value1',

- popust u procentima uneta vrednost u polje 'value2'

- iznos cene sa popustom se obracunava pozivanjem f-je CenaSPopustom() i to:

- na pocetku kada je stranica ucitana i kada korisnik (client) pritisne i pusti bilo koje dugme u poljima 'value1' i 'value2';

- takodje je navedeno u prethodnom postu (odgovoru) da je moguce koristiti i dogadjaj (event) on 'Change', posto se u primeru s' pocetka koristi dogadjaj 'KeyUp';

Code:

<div id="banner-message">
  <p>Matematika</p>
  <input type="text" id="value1" class="input value1">
  <input type="text" id="value2" class="input value2">
  <input type="text" id="result" disabled="disabled" id="result">
</div>

function CenaSPopustom()
{

  var val1 = Number(+$(".value1").val());
  var val2 = Number(+$(".value2").val());
  var popust = Number((val2/100) * val1);
  var iznos = Number(val1-popust);

  $("#result").val(iznos);

}

$(document).ready(function()
{

  CenaSPopustom();
  $(".value1").keyup(function(){ CenaSPopustom(); });
  $(".value2").keyup(function(){ CenaSPopustom(); });

});

Re: Sabiranje dva polja i upis u trece (ne radi) 19.08.2018. u 16:57 · pre 99 meseci #9

Trebalo bi da radi kako se očekuje: https://jsfiddle.net/p2nLbvyq/10/
Naravno, treba dodati provere za popust (ne može biti veći od 100), dodati CSS, itd.
Takođe, upis rezultata ne bih vršio u onemogućeno input polje, već u običan span element, ali da bi to sve ličilo na nešto i dizajn polja bio ponzistentan, potrebno je dodati CSS.

Code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<script>
   $(document).ready(function(){
    $(".input").keyup(function(){
          var product1 = $(".product1").val();
          var product2 = $(".product2").val();
          var discount1 = $(".discount1").val();
          var discount2 = $(".discount2").val();
          var total1 = product1 * (100 - discount1)/100;
          var total2 = product2 * (100 - discount2)/100;
          $("#total1").val(total1);
          $("#total2").val(total2);
          $("#total").val((total1 + total2).toFixed(2));
   });
});
</script>
</head>
<body>

<input type="text" class="input product1">
<input type="text" class="input discount1">
<input type="text" disabled="disabled" id="total1"><br />
<input type="text" class="input product2">
<input type="text" class="input discount2">
<input type="text" disabled="disabled" id="total2"><br />
Total: <input type="text" disabled="disabled" id="total">

</body>
</html>

Potpis

Blessed are those who can laugh at themselves, for they shall never cease to be amused.

Re: Sabiranje dva polja i upis u trece (ne radi) 19.08.2018. u 17:30 · pre 99 meseci #10

Logika i sustina je data kroz primere vec, samo je trebalo preraditi isti da se dobije ono sto se hoce i zeli.

Validacija takodje.

Doradjeno u nastavku isto kod u fazonu prethodnog post-a

https://jsfiddle.net/p2nLbvyq/19/

Deo koda:

Code:

function VrednostPopusta(Cena,Popust)
{

  var nC = Number(Cena);
  var nP = Number(Popust);

  if (nP >= 100)
  {
      alert('Popust nije moguce obracunati.')
        return 0;
  }

  var nVP = Number((nP/100) * nC);
  var nI = Number(nC-nVP);

  return nI;

}

$(document).ready(function(){
    $(".input").keyup(function(){
          var product1 = $(".product1").val();
          var product2 = $(".product2").val();
          var discount1 = $(".discount1").val();
          var discount2 = $(".discount2").val();
          var total1 = VrednostPopusta(product1,discount1);
          var total2 = VrednostPopusta(product2,discount2);
          $("#total1").val(total1);
          $("#total2").val(total2);
          $("#total").val(total1 + total2).toFixed(2);
   });
});

Re: Sabiranje dva polja i upis u trece (ne radi) 01.09.2018. u 17:57 · pre 99 meseci #11

EDIT: Nije funkcionisalo jer je polje bilo "disabled"

Da, iskoristio sam vas kod, radi perfektno.

Ono sto me zanima je sledece, kada od cena i popust dobijem kalkulaciju koja se upise u odredjeno polje (polje: ukupno), tu vrednost nikako ne mogu da sacuvam u MySQL (koristeci PHP, prepared statement).
Jednostavno, nista se ne upise u bazu, ali kad izuzmem to polje od upisivanje, sve funkcionise kako treba.

Kako je moguce da on ne prepoznaje njegovu vrednost?

$( function () {

$( '#cena' ).on( 'input', function () {
calculate();
} );
$( '#popust' ).on( 'input', function () {
calculate();
} );

function calculate() {
var pPos = parseInt( $( '#ena' ).val() );
var pEarned = parseInt( $( '#popust' ).val() );
var perc = "";
if ( isNaN( pPos ) || isNaN( pEarned ) ) {
perc = " ";
} else {
perc = pPos - ( pPos * ( pEarned / 100 ) ).toFixed( 2 );
}

$( '#ukupno' ).val( perc );
}

} );

Re: Sabiranje dva polja i upis u trece (ne radi) 01.09.2018. u 23:21 · pre 99 meseci #12

A na koji nacin se to radi sad kod vas u PHP sto se tice preuzimanja vrednosti i cuvanje u bazu posto je dat sam JS kod?

Dodatak:
parsint vraca ceo broj a ne decimalni tako da recimo ako se kazes popust 12.5% ili cena 155.75 ce biti 12% tj. 155.
Evo malo info i oko toga da mnogo ja ne mudrujem:
https://www.w3schools.com/jsre...asp?filename=tryjsref_parseint

kao i deo koji je mozda bolji za JS:
https://www.w3schools.com/jsref/jsref_number.asp

number f-ja je po ECMAScript

1

Forum kao aplikacija na telefonu

Srodne teme