I need to make a calculation in an asp page with the value from a usercontrol label.

the user control label is:

 <asp:Label ID="LblInvoicePriceValue" runat="server" ></asp:Label>

I include it like this:

<Controls:VehicleInformation ID="VehicleInformationControl" runat="server" />

And my jquery function is something like: Please see point 1 and 2.

<script type="text/javascript">
        $(document).ready(function () {
            alert('call function to do calculation here');
            // 1.   Find in the vehicle information user control the invoiced ammount label
            // 2.   Find the vat excluded value **after** it was typed in the textbox
            // 3.   If invoiced ammount is greater than zero, then
            // 3.a  Find Label Percentage 
            // 3.b  Label.Text = (AmmountWithoutVat/InvoicedAmmount)*100 + '%'
        });
  </script>

HTML generated:UPdate1

For the label:

 <span id="MainContent_VehicleInformationControl_LblInvoicePriceValue" class="bold"></span>

For the textbox:

<input name="ctl00$MainContent$TxtVatExcluded" type="text" id="TxtVatExcluded" class="calculation" />

Update 2:

<script type="text/javascript">
        $(document).ready(function () {
            alert('call function to do calculation here');

            $("#TxtVatExcluded").keypress(function() {
                var invoiceprice = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
                var vatexcluced = $("#TxtVatExcluded").val();
                var lblPercentage = $("#MainContent_LblPercentage");
                if (invoiceprice > 0) {
                    lblPercentage.text((vatexcluced / invoiceprice) * 100);
                }
            })

            // 1.   Find in the vehicle information user control the invoiced ammount label
            // 2.   Find the vat excluded value after it was typed in the textbox
            // 3.   If invoiced ammount is greater than zero, then
            // 3.a  Find Label Percentage 
            // 3.b  Label.Text = (AmmountWithoutVat/InvoicedAmmount)*100 + '%'
        });
  </script>

I need to make a calculation in an asp page with the value from a usercontrol label.

the user control label is:

 <asp:Label ID="LblInvoicePriceValue" runat="server" ></asp:Label>

I include it like this:

<Controls:VehicleInformation ID="VehicleInformationControl" runat="server" />

And my jquery function is something like: Please see point 1 and 2.

<script type="text/javascript">
        $(document).ready(function () {
            alert('call function to do calculation here');
            // 1.   Find in the vehicle information user control the invoiced ammount label
            // 2.   Find the vat excluded value **after** it was typed in the textbox
            // 3.   If invoiced ammount is greater than zero, then
            // 3.a  Find Label Percentage 
            // 3.b  Label.Text = (AmmountWithoutVat/InvoicedAmmount)*100 + '%'
        });
  </script>

HTML generated:UPdate1

For the label:

 <span id="MainContent_VehicleInformationControl_LblInvoicePriceValue" class="bold"></span>

For the textbox:

<input name="ctl00$MainContent$TxtVatExcluded" type="text" id="TxtVatExcluded" class="calculation" />

Update 2:

<script type="text/javascript">
        $(document).ready(function () {
            alert('call function to do calculation here');

            $("#TxtVatExcluded").keypress(function() {
                var invoiceprice = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
                var vatexcluced = $("#TxtVatExcluded").val();
                var lblPercentage = $("#MainContent_LblPercentage");
                if (invoiceprice > 0) {
                    lblPercentage.text((vatexcluced / invoiceprice) * 100);
                }
            })

            // 1.   Find in the vehicle information user control the invoiced ammount label
            // 2.   Find the vat excluded value after it was typed in the textbox
            // 3.   If invoiced ammount is greater than zero, then
            // 3.a  Find Label Percentage 
            // 3.b  Label.Text = (AmmountWithoutVat/InvoicedAmmount)*100 + '%'
        });
  </script>

• javascript
• jquery
• asp
• jquery-selectors

• 2 can you include the actuall HTML output (using view source would be sufficient) that the controls / label produces ... – Manse Commented May 16, 2012 at 9:11
• This shouldn't be too hard if you've read up on jQuery for about an hour or two. $("#theID").val() will get you the value of that id and $("#theID").blur( function () {}) will let you define what happens when the focus leave that field (assuming theID is an input element). – Niklas Commented May 16, 2012 at 9:19

3 Answers 3

var label_text = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
$("#TxtVatExcluded").val(label_text);

UPDATE If you want to check if the textfield is blank then only do copy the label then use following code

var label_text = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
var txt = $("#TxtVatExcluded").val();
if(txt.length==0)
{
  $("#TxtVatExcluded").val(label_text);
}

You can use the rendered ID of the elements to get the values using jQuery

var lbl = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
var tbox = $("#TxtVatExcluded").val();

Later when the calculation is plet, you can update the label text as

$("#MainContent_VehicleInformationControl_LblInvoicePriceValue").html("new label");

Update:

To use the logic, where the user types, you have to bind the function to keypress/keyup/keydown event

$("#myinputbox").keypress(function() {
    var lbl = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
    var tbox = $("#TxtVatExcluded").val();
    //... so on
}

Update 2:

Since, you are attempting to calculate with the values, it is safer to make sure, there are numbers in the first place. For that, you can use parseInt(), parseFloat() as needed.

        $("#TxtVatExcluded").keypress(function() {
            var invoiceprice = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
            var vatexcluced = $("#TxtVatExcluded").val();
            var lblPercentage = $("#MainContent_LblPercentage");
            if (invoiceprice > 0) {
                lblPercentage.text((parseInt(vatexcluced) / parseInt(invoiceprice)) * 100);
            }
        })

This will get you the value of the label control:

function Calculate()
{
    var InvoicedAmmount = $("#MainContent_VehicleInformationControl_LblInvoicePriceValue").text();
    var AmmountWithoutVat = $("#TxtVatExcluded").val();

    var Result = (AmmountWithoutVat/InvoicedAmmount)*100

    $("#OutputLabel").html(Result + " %");
}

You can attach and onBlur event to your text box to fire your calculation when they leave the text box - you wouldn't really want to re-calculate the amount as they typed.

$(document).ready(function () 
{ 
    $("#TxtVatExcluded").bind("blur",function(){ Calculate(); });
}