Click here to Skip to main content
15,891,136 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi Guys,

I have asp.net website,

Where i have textboxes for Qty, Price and totalpirce each for Equipment, Person and Vehical.
In which i'm multiplying Qty * Price = totalprice.

For that i wrote javascript n used 'onkeyup=""' to call this js function.

But unfortunately its not working.

javascript
<script type="text/javascript">
        function GetTotalPrice(txtqty, txtprice, txtTotalPrice) {
            alert(txtqty + txtprice);
            var qty = txtqty.value;
            var price = txtprice.value;            
            var TotalPrice = (qty * price);
            txtTotalPrice.value = TotalPrice;
        }
    </script>


asp.net
<td>
<asp:Label ID="lbleprice" runat="server" Text="4"></asp:Label>
</td>
<td>
<asp:TextBox ID="txteqty" runat="server" onkeyup="GetTotalPrice(this, lbleprice, lbletprice)"></asp:TextBox>
</td>
<td>
<asp:Label ID="lbletprice" runat="server" ></asp:Label>
</td>


i have these three fields in Eq, person n vehical.

so that's why i want to call that function in that way...

Can any one plzzz check where i'm wrong.

Thanks
Posted
Comments
Saral S Stalin 17-Mar-15 7:01am    
lbleprice, lbletprice are ASP.net controls and not html control. You wont get the value directly. Use '<%=Control.ClientID%>' to get the rendered control ids and later use document.getElementById(control).value to get the value.
jaket-cp 17-Mar-15 7:12am    
also note asp:Label will generate span tags, so the .value will not work
you could use .innerHTML to the content of span tag
Sinisa Hajnal 17-Mar-15 7:26am    
You could use jQuery :) with closest selector to get closest (in the same row) span with the name ending on lbleprice...

Sarals answer is correct one, you should pass into your function ClientID of the control and get it by id.

XML
<table><tr>
<td>
    <asp:Label ID="lbleprice" runat="server" Text="4"></asp:Label>
    </td>
    <td>
    <asp:TextBox ID="txteqty" runat="server" onkeyup="GetTotalPrice(this, document.getElementById('lbleprice'), document.getElementById('lbletprice'))"></asp:TextBox>
    </td>
    <td>
    <asp:Label ID="lbletprice" runat="server" ></asp:Label>
    </td>
    </tr>
</table>
<script type="text/javascript">
    function GetTotalPrice(txtqty, txtprice, txtTotalPrice) {
        var qty = txtqty.value;
        var price = txtprice.innerHTML;
        var TotalPrice = (qty * price);
        if (isNaN(TotalPrice))
        {
            TotalPrice = '';
        }
        txtTotalPrice.innerHTML = TotalPrice;
    }


</script>
 
Share this answer
 
Sorry, your whole idea on how to use/handle events is wrong. The parameters to the actual GetTotalPrice call comes from nowhere, they don't exist in the context of your call. I don't even want to think how you handle will execute when called like that. You can see it under the debugger, but there is no a big need to waste time on that as it will always fail.

First parameter which can really be passed to event handler is the event object, which has a reference to the event target. In your case, you don't need it, but this is certainly not the numeric value and not a DOM object:
https://developer.mozilla.org/en-US/docs/Web/Events/click[^],
https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent[^].

You don't even need it, so you can write an event handler without arguments. As to the arguments txtqty, txtprice, txtTotalPrice, you will have to pass it via the outer context. But you need to create a certain context for your event handler, so you would rather need to set up the event handler in code, not in the HTML element attribute:
JavaScript
var txteqty = document.getElementById("txteqty");

// ...

txteqty.onclick = function() { // or onkeyup, but it looks a bit weird to me
    var txtqty = // calculate if somehow, based on your code in the 
                 // outside context
    var txtprice = //... same thing
    var txtTotalPrice = //... same thing
    GetTotalPrice(txtqty, txtprice, txtTotalPrice); 
    // better call is "ShowTotalPrice", because you are not returning a value
    // ...
}


If, for example, your three arguments come from other elements, you can calculate the string values using document.getElementById("appropriateId").value and then parse it to the number object, for example: http://www.w3schools.com/jsref/jsref_parseint.asp[^].

—SA
 
Share this answer
 
v3

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900