We help IT Professionals succeed at work.

(Probably easy) Help with javascript

Member_2_1242703
on
287 Views
Last Modified: 2014-11-29
I have a script that works great but I have a slight problem. I've added a new window.onload script outside of the one below, so now only the last one works. How can I run this code without using widow.onload?

<script type="text/javascript">
        window.onload = function calcPer() {
                document.getElementById("lbOverage").onchange = function calcPer() {
                document.getElementById("lblPercentOveralge").innerHTML = this.options[this.selectedIndex].text + '%';
                document.getElementById("lblOverageQty").innerHTML = Math.ceil((this.options[this.selectedIndex].text / 100) * document.getElementById("lblFinalOrderQuantity").innerHTML)
                var x = +document.getElementById("lblFinalOrderQuantity").innerHTML;
                var y = +document.getElementById("lblOverageQty").innerHTML;
                document.getElementById("lblActualProductionQuantity").innerHTML = x + y;
                document.getElementById("lblOverageQty").innerHTML = '(+' + document.getElementById("lblOverageQty").innerHTML + ')'
            }
        }
    </script>

Open in new window


<asp:ListBox ID="lbOverage" runat="server" CssClass="alwaysontop" onChange="calcPer();" Height="85px"

Open in new window


I have tried this:

<script type="text/javascript">
        function calcPer() {
                document.getElementById("lbOverage").onchange = function calcPer() {
                document.getElementById("lblPercentOveralge").innerHTML = this.options[this.selectedIndex].text + '%';
                document.getElementById("lblOverageQty").innerHTML = Math.ceil((this.options[this.selectedIndex].text / 100) * document.getElementById("lblFinalOrderQuantity").innerHTML)
                var x = +document.getElementById("lblFinalOrderQuantity").innerHTML;
                var y = +document.getElementById("lblOverageQty").innerHTML;
                document.getElementById("lblActualProductionQuantity").innerHTML = x + y;
                document.getElementById("lblOverageQty").innerHTML = '(+' + document.getElementById("lblOverageQty").innerHTML + ')'
            }
        }
    </script>

Open in new window


which works, however it does not work on the first selection. When a user makes a list box selection, it does nothing. Once they make a second selection, it runs as expected.
Comment
Watch Question

RobOwner (Aidellio)
CERTIFIED EXPERT
Most Valuable Expert 2015

Commented:
You're defining the onchange twice.  You only need to do it in the ListBox:
I've removed it from the code below
<script type="text/javascript">
function calcPer() {
	document.getElementById("lblPercentOveralge").innerHTML = this.options[this.selectedIndex].text + '%';
	document.getElementById("lblOverageQty").innerHTML = Math.ceil((this.options[this.selectedIndex].text / 100) * document.getElementById("lblFinalOrderQuantity").innerHTML);
	var x = +document.getElementById("lblFinalOrderQuantity").innerHTML;
	var y = +document.getElementById("lblOverageQty").innerHTML;
	document.getElementById("lblActualProductionQuantity").innerHTML = x + y;
	document.getElementById("lblOverageQty").innerHTML = '(+' + document.getElementById("lblOverageQty").innerHTML + ')';
}

    </script>

Open in new window

Owner (Aidellio)
CERTIFIED EXPERT
Most Valuable Expert 2015
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Author

Commented:
Works like a charm. Nice catch. Thanks Rob!
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.