CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

overisen Novice

31. december 2015 - 17:08 Der er 7 kommentarer og
1 løsning

Beregning af tal i formular

Jeg vil gerne udvide spørgesmålet i http://www.eksperten.dk/spm/1008113
således beregningen sker i et vilkårligt antal søjler uafhængig af hinanden. Svaret i http://www.eksperten.dk/spm/1008113 virker fint for en søjle af tal

Synes godt om

olsensweb.dk Ekspert

31. december 2015 - 17:38 #1

kan du ikke lave 2 test tabeller ??

min umildbare tanke er at overføre parameterne i existerende function

afprøv denne, og forklar nærmere om det er dette du mener

 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style type="text/css">
body {
    background-color: #F4E4F9;
}
</style>
<script type="text/javascript">
function sumup(ar){    
    var sum = 0;    
    // http://stackoverflow.com/questions/18074868/getelementsbyname-with-array-like-name
    var ar_tal=document.querySelectorAll("input[name^='"+ar+"[']");    
    for(i=0, lng=ar_tal.length; i<lng;i++){            
        tal = (parseInt(ar_tal[i].value) ) ? ar_tal[i].value : 0 ;        
        sum  += parseInt(tal);
    }
    return sum;
    
}
</script>
</head>
<body>
<p>
Test
</p>
<form action='sender.php' method='POST' id='form_indtast'>
<input type='text' name='tal[stald]'><br>
<input type='text' name='tal[mark]'><br>
<input type='text' name='tal[andet]'><br>
<input type='submit' ><br>
</form>
sum:<span id='total'>0 </span>


<form action='sender1.php' method='POST' id='form_nr'>
<input type='text' name='nr[tal_r]'><br>
<input type='text' name='nr[kat]'><br>
<input type='text' name='nr[mus]'><br>
<input type='submit' ><br>
</form>
sum:<span id='total_nr'>0 </span>



<script type="text/javascript">
var sum = 0;

var el = document.getElementById("form_indtast");
el.addEventListener("change", function() {
    sum=sumup('tal');
    document.getElementById('total').innerHTML = sum;    
});


var elem = document.getElementById("form_nr");
elem.addEventListener("change", function() {
    sum=sumup('nr');
    document.getElementById('total_nr').innerHTML = sum;    
});
</script>

</body>
</html>

Synes godt om

olsensweb.dk Ekspert

31. december 2015 - 18:09 #2

kunne også godt være jeg har misforstået spm, og der er tale om en HTML tabel

http://jsfiddle.net/hibbard_eu/2PWP6/
http://stackoverflow.com/questions/10715256/dynamically-add-table-row-with-calculation-javascript
http://stackoverflow.com/questions/10533238/calculate-table-rows-and-populate-the-grand-total-field

så vis den html code du arbejder ud fra

Synes godt om

overisen Novice

01. januar 2016 - 12:34 #3

Din løsning er helt som jeg havde tænkt, bortset fra at det ikke er så godt at der sker en opdeling i to tabeller.

Det skyldes at 'sender.php' bruges til at sende de indtastede data til en mailadresse. Hvis der sker en opdeling i flere tabeller vil data blive overført via to mails

Der er ikke tale om html tabeller

Synes godt om

olsensweb.dk Ekspert

01. januar 2016 - 14:27 #4

skal du have del summer ??

hvis de bare skal ligge i sammen form kan du gøre sådan her

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style type="text/css">
body {
    background-color: #F4E4F9;
}
</style>
<script type="text/javascript">
function sumup(ar){    
    var sum = 0;
    for(k=0, antal_arrays=ar.length; k<antal_arrays; k++){
        array_name=ar[k];    
        // http://stackoverflow.com/questions/18074868/getelementsbyname-with-array-like-name
        var ar_tal=document.querySelectorAll("input[name^='"+array_name+"[']");    
        for(i=0, lng=ar_tal.length; i<lng;i++){            
            tal = (parseInt(ar_tal[i].value) ) ? ar_tal[i].value : 0 ;        
            sum  += parseInt(tal);
        }    
    }    
    return sum;
}
</script>
</head>
<body>
<p>
Test
</p>
<form action='sender.php' method='POST' id='form_indtast'>
<input type='text' name='tal[stald]'><br>
<input type='text' name='tal[mark]'><br>
<input type='text' name='tal[andet]'><br>

<input type='text' name='nr[tal_r]'><br>
<input type='text' name='nr[hund]'><br>
<input type='text' name='nr[kat]'><br>
<input type='text' name='nr[mus]'><br>

<input type='submit' ><br>
</form>
sum:<span id='total'>0 </span>

<script type="text/javascript">
var sum = 0;
var el = document.getElementById("form_indtast");
el.addEventListener("change", function() {
    sum=sumup(new Array('tal', 'nr') );
    document.getElementById('total').innerHTML = sum;    
});
</script>
</body>
</html>

hvis der skal delsumer, må der skulle et array mere over med navne på det det skal outputtes

det vil gøre det nemmere at kende den HTML du arbejder ud fra

Synes godt om

overisen Novice

01. januar 2016 - 15:10 #5

Tak for svaret.
Jeg vil gerne lave yderligere en søjle med indtastning af tal hvor der også beregnes en sum uafhængig af første søjle. Det hele skal sendes i samme form

Synes godt om

olsensweb.dk Ekspert

01. januar 2016 - 15:28 #6

hvilke HTML bruger du ??, lav en demo side, så simpel som mulig

man kan lave sub totaler sådan her

 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style type="text/css">
body {
    background-color: #F4E4F9;
}
</style>
<script type="text/javascript">

function array_sum(ar){
    var sum = 0;
    // http://stackoverflow.com/questions/18074868/getelementsbyname-with-array-like-name
    var ar_tal=document.querySelectorAll("input[name^='"+ar+"[']");    
    for(i=0, lng=ar_tal.length; i<lng;i++){            
        tal = (parseInt(ar_tal[i].value) ) ? ar_tal[i].value : 0 ;        
        sum  += parseInt(tal);
    }
    return sum;
}

function sumup(ar, sub_ar){    
    var sum = 0;    
    for(k=0, antal_arrays=ar.length; k<antal_arrays; k++){
        var sub_sum=0;            
        sub_sum=array_sum(ar[k]);
        sum +=sub_sum;            
        document.getElementById(sub_ar[k]).innerHTML = sub_sum;        
    }
    return sum;        
}
</script>
</head>
<body>
<p>
Test
</p>
<form action='sender.php' method='POST' id='form_indtast'>
<input type='text' name='tal[stald]'><br>
<input type='text' name='tal[mark]'><br>
<input type='text' name='tal[andet]'><br>
<hr>
<input type='text' name='nr[tal_r]'><br>
<input type='text' name='nr[hund]'><br>
<input type='text' name='nr[kat]'><br>
<input type='text' name='nr[mus]'><br>

<input type='submit' ><br>
</form>
sub1 sum:<span id='sub1'>0 </span><br>
sub2 sum:<span id='sub2'>0 </span><br>
total sum:<span id='total'>0 </span><br>

<script type="text/javascript">
var sum = 0;
var el = document.getElementById("form_indtast");
el.addEventListener("change", function() {
    sum=sumup( new Array('tal', 'nr'), new Array('sub1', 'sub2') );    
    document.getElementById('total').innerHTML = sum;        
});
</script>

</body>
</html>

Synes godt om

overisen Novice

02. januar 2016 - 09:11 #7

Super, Det var lige det der skulle til. Din metode er også flexibel, så den let kan udvides.

Jeg bruger: Dreamweaver CC 2015

Send et svar, så jeg kan give dig point

Synes godt om

olsensweb.dk Ekspert

02. januar 2016 - 09:57 #8

får du her

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Sæt vindue størrelse Af poulmadsen i JavaScript	1	08/10/202417:18	13/10/202412:33
Opgavestyring Af ingeman i JavaScript	1	15/09/202416:06	15/09/202420:40
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS