Solved

Web Form manipulation

Posted on 2004-09-03
11
162 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
  • 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
Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

 

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

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

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

When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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…

816 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

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now