Solved

Web Form manipulation

Posted on 2004-09-03
11
173 Views
Last Modified: 2011-09-20
I have a form that I built in asp.net with over 40 textboxes that take in mostly dollar amounts but also rates and number of days or miles.  Here is an example of javascript I have in place to work with three textboxes in my form;
<SCRIPT LANGUAGE="JavaScript">
function SetPDTotal() {
      var PDTotal = 0.00;
      var PDRate = 0.00;
      PDRate = document.getElementById("txtPDRate").value;
      PDRate = PDRate.toFixed(2);      
      document.getElementById("txtPDRate").value = PDRate.toFixed(2);
      PDTotal = document.getElementById("txtPDDays").value * document.getElementById("txtPDRate").value;
      document.getElementById("txtPDTotal").value = "$" + PDTotal.toFixed(2);      
                        }
</SCRIPT>

So the point is to make txtPDTotal = what's entered in PDDays * what's entered in PDRate and make it look like a currency.  This part works great but I also want whatever is entered into PDRate to be manipulated into a double, thus the line: PDRate = PDRate.toFixed(2);
When I run the program I enter a number in txtPDDays and then a number in txtPDRate, the txtPDTotal is popualated with the correct amount from the multiplication but txtPDRate is not formatted and I get the JS error at the line where I have PDRate = PDRate.toFixed(2);:
"Object doesnt support this property or method"
First I tried just doing document.getElementById("txtPDRate").value = document.getElementById("txtPDRate").value.toFixed(2);    but that gave the same error.  Ideas?  
0
Comment
Question by:jacobymatt
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 3
11 Comments
 
LVL 36

Expert Comment

by:Zyloch
ID: 11977313
Hi

Well, toFixed is Javascript1.5 meaning only IE5.5+ and NS6+. You might also want to try this:

PDRate = parseFloat(PDRate,10).toFixed(2);

Regards,
Zyloch
0
 

Author Comment

by:jacobymatt
ID: 11977441
That gave the same error, and if you look at the code I posted I use .toFixed to format my PDTotal and that part works fine.  The code is nearly identical to what I'm doing to PDRate but its bombing out with PDRate.  So
 document.getElementById("txtPDTotal").value = "$" + PDTotal.toFixed(2);  works fine but
document.getElementById("txtPDRate").value = PDRate.toFixed(2);  gives me this error.  What gives?  I thought one might be influencing the other but I tried them in different orders and it's always the line with document.getElementById("txtPDRate").value = PDRate.toFixed(2); that gives this javascript error:
"Object doesnt support this property or method"
0
 
LVL 36

Expert Comment

by:Zyloch
ID: 11977516
This is my test code:

Works like a charm:

<SCRIPT LANGUAGE="JavaScript">
function SetPDTotal() {
     var PDTotal = 0.00;
     var PDRate = 0.00;
     PDRate = document.getElementById("txtPDRate").innerHTML;
     PDRate = parseFloat(PDRate,10).toFixed(2);    
     document.getElementById("txtPDRate").innerHTML = PDRate;
     PDTotal = document.getElementById("txtPDTotal").innerHTML * document.getElementById("txtPDRate").innerHTML;
     document.getElementById("txtPDTotal").innerHTML = "$" + PDTotal.toFixed(2);    
                    }
</SCRIPT>
<div onclick="SetPDTotal();">jlsdf</div>
<div id="txtPDTotal">
5
</div>
<div id="txtPDRate">
5
</div>

All I did was switch value for innerHTML which shouldn't change anything. Because PDTotal was multiplied, it was considered a number already so you can do toFixed. However, PDRate was never considered a number, so parseFloat fixed things.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:jacobymatt
ID: 12002712
My html:
<SCRIPT LANGUAGE="JavaScript">
function SetPDTotal() {
      var PDTotal = 0.00;
      var PDRate = 0.00;
      PDRate = document.getElementById("txtPDRate").innerHTML;
      PDRate = parseFloat(PDRate,10).toFixed(2);      
      document.getElementById("txtPDRate").innerHTML = PDRate;       
      PDTotal = document.getElementById("txtPDDays").innerHTML * document.getElementById("txtPDRate").innerHTML;
      document.getElementById("txtPDTotal").innerHTML = "$" + PDTotal.toFixed(2);      
                        }
</SCRIPT>
and my code behind:
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load      
        txtPDRate.Attributes.Add("onblur", "SetPDTotal();")
    End Sub

and now when I type a number in txtPDRate and then click out of it I get the js error "Unknown Runtime Error" at the line that I have "document.getElementById("txtPDRate").innerHTML = PDRate;"

Those div controls you used were just for testing, right?  And I don't have to let the new attribute for txtPDRate know that its new function is a javascript function?  
0
 

Author Comment

by:jacobymatt
ID: 12007287
Anyone?
0
 
LVL 36

Expert Comment

by:Zyloch
ID: 12011806
Sorry, I was in school and fell asleep at 7 last night. Anyways, what is the code your ASP ends up outputting, meaning after the page loads, use View Source and paste the HTML.
0
 

Author Comment

by:jacobymatt
ID: 12016502
<HEAD>
            <title>RezApprove :: powered by ADTRAV</title>
            <SCRIPT language="JavaScript">
function SetPDTotal() {
      var PDTotal = 0.00;
      var PDRate = 0.00;
      PDRate = document.getElementById("txtPDRate").innerHTML;
      PDRate = parseFloat(PDRate,10).toFixed(2);      
      document.getElementById("txtPDRate").innerHTML = PDRate;       
      PDTotal = document.getElementById("txtPDDays").innerHTML * document.getElementById("txtPDRate").innerHTML;
      document.getElementById("txtPDTotal").innerHTML = "$" + PDTotal.toFixed(2);      
                                          }
            </SCRIPT>

then in my form:
<input name="txtPDRate" type="text" id="txtPDRate" tabindex="10" onblur="SetPDTotal();" style="width:64px;" />

Does the onblur="SetPDTotal()"'; need to have "javascript:" in front of it or does it know to look for it in the javascript already.  

And the js error is "unkown runtime error" at line: document.getElementById("txtPDRate").innerHTML = PDRate;

thanks for the help, this is becoming urgent!      
0
 

Author Comment

by:jacobymatt
ID: 12016680
nevermind about putting "javascript:" before the function.  I was slow to see that it is obviously picking up on the function or it wouldn't be erroring on the js function.  When I removed the line document.getElementById("txtPDRate").innerHTML = PDRate;
just to see what would happen it gave the same error at the line :
document.getElementById("txtPDTotal").innerHTML = "$" + PDTotal.toFixed(2);    
so it looks like it's having issues writing these values to the textboxes; just thought that might help.
0
 

Author Comment

by:jacobymatt
ID: 12017599
finally got it to work using this method:
<SCRIPT language="JavaScript">
function SetPDTotal(form) {
      var PDTotal = 0.00;
      var PDRate = 0.00;
      PDRate = eval(form.txtPDRate.value);
      PDRate = parseFloat(PDRate,10).toFixed(2);      
      form.txtPDRate.value = PDRate;       
      PDTotal = eval(form.txtPDDays.value) * PDRate;
      form.txtPDTotal.value = "$" + PDTotal.toFixed(2);
                                    }
            </SCRIPT>

go figure
0
 

Accepted Solution

by:
CetusMOD earned 0 total points
ID: 12057098
Closed, 100 points refunded.
CetusMOD
Community Support Moderator
0

Featured Post

Instantly Create Instructional Tutorials

Contextual Guidance at the moment of need helps your employees adopt to new software or processes instantly. Boost knowledge retention and employee engagement step-by-step with one easy solution.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question