Yogesh
Yogesh

Reputation: 685

Changing Label Text on client side are not accessible on server side

I have below header label

Billed Amount:
<label >$</label>
<asp:Label ID="billed"  runat="server" Text="0.00"></asp:Label>

Also i have child repeater with text input like below

 <asp:Repeater runat="server" ID="rpt" >
     <HeaderTemplate>
         ....
     </HeaderTemplate>
     <ItemTemplate>
         <asp:TextBox ID="txtB" onchange="AmountChanged(this)" Text='<%# Bind("Billed") %>' />
     </ItemTemplate>
     <FooterTemplate>
         </table>
     </FooterTemplate>
 </asp:Repeater>

In AmountChanged JavaScript function i have written to sum all the repeater item billed amount and change value on header

But when i am getting label value its coming as previous value only. JavaScript changes are not working on server side.

Upvotes: 0

Views: 962

Answers (2)

Win
Win

Reputation: 62260

Easiest way is to add a HiddenField. Whenever you assign a value to billed label, you also assign it to BilledHiddenField HiddenField.

Then you can read BilledHiddenField.Value at server side instead of billed.Text.

<asp:Label ID="billed"  runat="server" Text="0.00"></asp:Label>
<asp:HiddenField id="BilledHiddenField" runat="server" />

Upvotes: 1

hardkoded
hardkoded

Reputation: 21607

Labels won't be persisted on postback. A good way to solve this would be recalculating the total on load:

We could add some data- attributes so we can easily id the elements

<asp:Label data-billed="" runat="server" ID="billed"></asp:Label>
<asp:TextBox runat="server" ID="txtB" data-amount="" Text='<%# Eval("Billed") %>'></asp:TextBox>

And then you calculate the total on load:

var amount = 0;

$("[data-amount]").each(function (index, el) {
    if ($(el).val()) {
        amount += parseInt($(el).val(), 10);
    }
});

$("[data-billed]").text(amount);

Upvotes: 0

Related Questions