Asp.net Ajax problem

Question

I installed the Asp.net Ajax toolkit. In my site I use the NummericUpDown from that toolkit. Now, I want that a label changes when the NummericUpDown Textboxes changes. I try to use JavaScript for this, but I always get the following error:

'ASP.orders_aspx' does not contain a definition for 'changeAmount' and no extension method 'changeAmount' accepting a first argument of type 'ASP.orders_aspx' could be found (are you missing a using directive or an assembly reference?)

This is my code:

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
    CodeFile="orders.aspx.cs" Inherits="orders" Title="the BookStore" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">

    <script type="text/javascript">

        function changeAmount()
        {
            var amount = document.getElementById("txtCount");
            var total = 10 * amount.value;

            document.getElementById("lblPrice").value = total;
        }


    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <ajaxToolkit:ToolkitScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager1" />

    <h1 id="H1" runat="server">
        Bestellen</h1>

    <asp:Panel ID="pnlZoeken" runat="server" Visible="true">

        <asp:ObjectDataSource ID="objdsSelectedBooks" runat="server" OnSelecting="objdsSelectedBooks_Selecting"
            TypeName="DAL.BooksDAL"></asp:ObjectDataSource>
        <h3>
            Overzicht van het gekozen boek</h3>
        <asp:FormView ID="fvBestelBoek" runat="server" Width="650">
            <ItemTemplate>
                <h3>
                    Aantal boeken bestellen</h3>
                <table width="650">
                    <tr class="txtBox">
                        <td>
                            Boek
                        </td>
                        <td>
                            Prijs
                        </td>
                        <td>
                            Aantal
                        </td>
                        <td>
                            Korting
                        </td>
                        <td>
                            Totale Prijs
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <%# Eval("TITLE") %>
                        </td>
                        <td>
                            <asp:Label ID="lblPrice" runat="server" Text='<%# Eval("PRICE") %>' />
                        </td>
                        <td>
                            <asp:TextBox OnTextChanged="changeAmount()" ID="txtCount" runat="server"></asp:TextBox>
                            <ajaxToolkit:NumericUpDownExtender ID="NumericUpDownExtender1" runat="server" TargetControlID="txtCount"
                                Width="50" Minimum="1" ServiceDownMethod="" ServiceUpMethod="" />
                        </td>
                        <td>
                            -
                        </td>
                        <td>
                            <asp:Label ID="lblAmount" runat="server" />
                        </td>
                    </tr>
                </table>
            </ItemTemplate>
        </asp:FormView>

        <asp:Button ID="btnBestel" runat="server" CssClass="btn" Text="Bestel" OnClick="btnBestel_Click1" />
        <asp:Button ID="btnReChoose" runat="server" CssClass="btnDelete" Text="Kies een ander boek"
            OnClick="btnRechoose_Click" />
    </asp:Panel>
</asp:Content>

Does anyone know the answer?

Thanks a lot, Vincent

David Neale · Accepted Answer · 2010-05-17 10:45:36Z

2

You're trying to assign a client-side method to the OnTextChanged event, which is a server-side event.

Also, your javascript is referencing the server id of the label and textbox. The WinForms engine appends characters to this depending where the control is nested. Use <%=myControl.ClientID%> to get around this.

You need to use some pure Javascript for this:

 window.onload=function(){
     //assign client method to textbox
     document.getElementById('<%=txtCount.ClientID%>').onChange = function(){
        var amount = document.getElementById('<%=txtCount.ClientID%>');
        var total = 10 * amount.value;

        document.getElementById('<%=lblPrice.ClientID%>').value = total;

     }
  }

Place that on your page instead of your current Javascript and get rid of the OnTextChanged="changeAmount()" attribute.

edited May 17, 2010 at 10:45

answered May 17, 2010 at 9:56

David Neale

17.1k6 gold badges64 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

chapluck · Accepted Answer · 2010-05-17 09:59:44Z

1

You set OnTextChanged for TextBox. It is refer to server method, that is fired on PostBack.

If you want to handle Up and Down events in background by method on your Page, you have to set properties ServiceUpPath and ServiceUpMethod for NumericUpDown tag.

If you want to handle client events - set custom Up and Down buttons and set property OnClientClick to them.

See http://www.asp.net/AJAX/AjaxControlToolkit/Samples/NumericUpDown/NumericUpDown.aspx

answered May 17, 2010 at 9:59

chapluck

5793 silver badges12 bronze badges

Collectives™ on Stack Overflow

Asp.net Ajax problem

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related