Why does form calculation work with text but not with select fields?

I'm using an order form where clients may update quantity in a text field.

To make it more customers friendly, I would like to have the field with the select format.

But doing so in the form, the javascript is not doing anymore.

Can anyone have a look and let me know what to change in the script to have it working with select fields in place of the text fields?

Thank you

Expand|Select|Wrap|Line Numbers

 
<html>

<head>

<title>My Untitled Document</title>

<script type="text/javascript" language="javascript">

<!--

function calcVals() {

    var form = document.form1;

    var total = document.getElementById("valTotal");

    var currentTotal = total.value.replace('$','');

     // document.pgCartOrder.calculatedTotal.value='0';

    var tempTotal = 0;

    var totalFields = eval(form.elements.length-1);

    //alert (totalFields);

      for (i=0; i < totalFields; i++) {

        if(form.elements[i].type == 'submit'){

        }else if(form.elements[i].type == 'text'){

            if(form.elements[i].value > 0){  

                tempTotal = tempTotal + parseFloat(form.elements[i].title * parseInt(form.elements[i].value));

            }else if(form.elements[i].value = 'NaN'){

                form.elements[i].value = "";

            }

        }

      }
 
    if (String(total) != 'NaN') {

        form.valTotal.value = "$"+ tempTotal;

    } else {

        form.valTotal.value = 'ERROR';

    }

}

form.valTotal.value = round(form.valTotal.value, 2);

-->

</script>
 
</head>
 
<body onload="calcVals()">

 <? if ($_POST['send']){ ?>

    <? echo floor($_POST['textfield']) ;?>

    <? echo "<br>";?>

    <? echo floor($_POST['textfield1']) ;?>

    <? echo "<br>";?>

    <? echo floor($_POST['textfield2']) ;?>

    <? echo "<br>";?>
 
<? } ?>
 
<form id="form1" name="form1" method="post" action="" >

  $ 9.25<input type="text" name="textfield" value="1"  title="9.25" onkeyup="calcVals();"/><br/>

  $12.25<input type="text" name="textfield1"  title="12.25" onkeyup="calcVals();"/><br/>

  $ 5.00<input type="text" name="textfield2"  title="-5.00" onkeyup="calcVals();"/><br/>

  <input type="text" readonly="" name="valTotal" id="valTotal" value="$0"/>

  <input type="submit" name="send" value="SEND" />

</form>

</body>

</html>

Jan 24 '11 #1

Subscribe Post Reply

✓ answered by Dormilich

onkeyup is useless on <select>s, try onchange instead.

2015

Dormilich

8,658

Expert Mod 8TB

onkeyup is useless on <select>s, try onchange instead.

Jan 24 '11 #2

samuel jenny

With a few minor change it's working right now

But I still have a concern with it, I would like the total to display with forced 2 decimals, what should I change to my code ?

This is not doing any thing !

Expand|Select|Wrap|Line Numbers

form.valTotal.value = round(form.valTotal.value, 2);

Maybe something else to try ?

Expand|Select|Wrap|Line Numbers

 <html>

<head>

<title>My Untitled Document</title>

<script type="text/javascript" language="javascript">

<!--

function calcVals() {

    var form = document.form1;

    var total = document.getElementById("valTotal");

    var currentTotal = total.value.replace('$','');

     // document.pgCartOrder.calculatedTotal.value='0';

    var tempTotal = 0;

    var totalFields = eval(form.elements.length-1);

    //alert (totalFields);

      for (i=0; i < totalFields; i++) {

        if(form.elements[i].type == 'submit'){

        }else{

            if(form.elements[i].value > 0){  

                tempTotal = tempTotal + parseFloat(form.elements[i].title * parseInt(form.elements[i].value));

            }else if(form.elements[i].value = 'NaN'){

                form.elements[i].value = "";

            }

        }

      }
 
    if (String(total) != 'NaN') {

        form.valTotal.value = "$"+ tempTotal;

    } else {

        form.valTotal.value = 'ERROR';

    }

}
 form.valTotal.value = round(form.valTotal.value, 2);

-->

</script>
 
</head>
 
<body onload="calcVals()">

 <? if ($_POST['send']){ ?>

    <? echo floor($_POST['textfield']) ;?>

    <? echo "<br>";?>

    <? echo floor($_POST['textfield1']) ;?>

    <? echo "<br>";?>

    <? echo floor($_POST['textfield2']) ;?>

    <? echo "<br>";?>
 
<? } ?>
 
<form id="form1" name="form1" method="post" action="" >

  $ 9.25

  <select name="textfield" title="9.25" onchange="calcVals(this.form.form1)">

      <option value="1" selected="selected">1</option>

    <option value="2">2</option>

  </select>

  <br />

   $ 12.25

  <select name="textfield1" title="12.25" onchange="calcVals(this.form.form1)">

      <option value="0" selected="selected">As gift</option>

    <option value="1">1</option>

    <option value="2">2</option>

  </select>

  <br />

   $ -5.00

  <select name="textfield2" title="-5.00" onchange="calcVals(this.form.form1)">

      <option value="0" selected="selected">No</option>

    <option value="1">Yes</option>

  </select>

  <br />

  <input type="text" readonly="" name="valTotal" id="valTotal" value="$0"/>

  <input type="submit" name="send" value="SEND" />

</form>

</body>

</html>

Jan 24 '11 #3

Dormilich

8,658

Expert Mod 8TB

as far as I remember, there is no native round() function in JS (besides that this call is weird in JS*). try toFixed().

* - JavaScript is a highly object oriented language.

Jan 24 '11 #4

samuel jenny

Thank you
Question resolved

Script below for some need the same

Expand|Select|Wrap|Line Numbers

 
<script type="text/javascript">
 
            function calcVals()

            {

                var

                    selects = document.getElementById('form1').getElementsByTagName('select'),

                    total   = 0,

                    i;
 
                for (i = 0; i < selects.length; i++) {

                    total += (isNaN(selects[i].value) ? 0 : Number(selects[i].value)) * (isNaN(selects[i].title) ? 0 : Number(selects[i].title));

                }

                document.getElementById('valTotal').value = '€ ' + total.toFixed(2);

            }
 
        </script>

Jan 25 '11 #5

Similar topics

Saving an ASP form to a text file

by: Kevin Ingram | last post by:

Ok, this is probably a silly question but I just keep hitting a brick wall here. I usually develop my sites entirely in ASP and use a database for data storage, works great for me. I also...

ASP / Active Server Pages

Problem - Parsing information using onchange in two select fields

by: please-answer-here | last post by:

Scenario: I'm having an asp page with a form with an action pointing to itself. The reason for that, it that the asp page depending on changes in any of two select fields with data from 2...

ASP / Active Server Pages

text select in textarea (regular expression)

by: Volt | last post by:

is there any way to select and mark part of text in textarea by regular expression? i need to select the first string in textarea whitch is like xxxxx,xxx where x is any character

Javascript

user friendly php form processor that includes sticky fields

by: sojo | last post by:

As a web designer with only very rudimentary php skills, I've looked all over for a user friendly php form processor that includes sticky fields. The best match for my needs, php form wizard...

PHP

Php search Form with two multi select list box and how to create Mysql query for data

by: jimjack145 | last post by:

Hi All, I have one form with two multi select list box. I want to create query when user select value from it and click for result page. However i search on net but not find any code example....

PHP

Form Calculation writes record to Audit Log

by: FrozenDude | last post by:

I've implemented Allen Browne's Audit Log and it works quite well (thanks). However, my form has a series of calculated fields that fire on the form OnCurrent event. The calculation causes a...

Microsoft Access / VBA

Form submission works in Firefox... but not in I.E. Go figure.

by: vozzek | last post by:

Okay, I've got a tiny little form that works fine in Firefox, but I.E. won't let me push the button to file it. Here is the code: <form method="post" action="/search_results.php"> <table> ...

HTML / CSS

Make form open with Text Boxes hidden.

by: Nagel Oxles | last post by:

My form has has seven Text Boxes to receive user input. Users fall into either of two categories, Current and New. 'Command_Button_New' changes the visible property of four text Boxes and their...

Microsoft Access / VBA

Filtering a form based on text in subform, OR max length of filter string = 255?

by: kcropper | last post by:

Hi, I’ve been trolling these forums for a while now, and while I’ve found other related threads (e.g., http://bytes.com/topic/access/answers/702416-search-code-how-filter-using-code-sql), nothing has...

Microsoft Access / VBA

Select fields

by: gidmakus | last post by:

I want three select fields where by each field is dependant on the other, what i mean is the first select field shows the values in the second while the second show the values in the the third field....

Javascript

How to find best mobile app development company in usa

by: Aliciasmith | last post by:

In an age dominated by smartphones, having a mobile app for your business is no longer an option; it's a necessity. Whether you're a startup or an established enterprise, finding the right mobile app...

Mobile Development

Can faster file sharing be achieved by connecting computers simultaneously via WiFi and LAN cables

by: tracyyun | last post by:

Hello everyone, I have a question and would like some advice on network connectivity. I have one computer connected to my router via WiFi, but I have two other computers that I want to be able to...

Networking - Hardware / Configuration

Energy Model code modification to account for year dependent interest rate

by: giovanniandrean | last post by:

The energy model is structured as follows and uses excel sheets to give input data: 1-Utility.py contains all the functions needed to calculate the variables and other minor things (mentions...

Python

Send Current Object to PDF

by: NeoPa | last post by:

Hello everyone. I find myself stuck trying to find the VBA way to get Access to create a PDF of the currently-selected (and open) object (Form or Report). I know it can be done by selecting :...

Microsoft Access / VBA

VBA Class Basics

by: NeoPa | last post by:

Introduction For this article I'll be using a very simple database which has Form (clsForm) & Report (clsReport) classes that simply handle making the calling Form invisible until the Form, or all...

Microsoft Access / VBA

Access Europe Meeting - Wed 1 Nov - Using SQL Server skills to extend Access

by: isladogs | last post by:

The next Access Europe meeting will be on Wednesday 1 Nov 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM) Please note that the UK and Europe revert to winter time on...

Microsoft Access / VBA

Finding a record, and then saving a new record after the record has been amended.

by: nia12 | last post by:

Hi there, I am very new to Access so apologies if any of this is obvious/not clear. I am creating a data collection tool for health care employees to complete. It consists of a number of...

Microsoft Access / VBA

Access Europe Meeting - Wed 6 Dec - Streamline Your Import/Export Spec Workflow with VBA Classes

by: isladogs | last post by:

The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...

Microsoft Access / VBA

Applying ComboBox filters Sequentially

by: SueHopson | last post by:

Hi All, I'm trying to create a single code (run off a button that calls the Private Sub) for our parts list report that will allow the user to filter by either/both PartVendor and PartType. On...

Microsoft Access / VBA