Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Jan 2016
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript code not firing

    Hi guys

    I am totally new to .net and need to update a page that was created by someone else.

    Basically, I need the following to work:


    Code:
                      <asp:DropDownList ID="minprice" runat="server" class="form-control" onchange="sum();">
                        <asp:ListItem Text="0" Value="0" />
                        <asp:ListItem Text="500" Value="500" />
                        <asp:ListItem Text="1,000" Value="1000" />
                        <asp:ListItem Text="2,000" Value="2000" />
                        <asp:ListItem Text="3,000" Value="3000" />                 
                      </asp:DropDownList>
    
                      <asp:DropDownList ID="maxprice" runat="server" class="form-control" onchange="sum();"
                        <asp:ListItem Text="500" Value="500" />
                        <asp:ListItem Text="1,000" Value="1000" />
                        <asp:ListItem Text="2,000" Value="2000" />
                        <asp:ListItem Text="3,000" Value="3000" /> 
                      </asp:DropDownList>
    
    
    <asp:TextBox ID="newprice" runat="server" class="form-control" />
    
    
    <script>
    function sum() {
                var txtFirstNumberValue = document.getElementById('minprice').value;
                var txtSecondNumberValue = document.getElementById('maxprice').value;
                var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue);
                if (!isNaN(result)) {
                    document.getElementById('newprice').value = result;
                }
            }
    </script>

    What should happen is that the "newprice" textbox should populate with the total of the "minprice" and "maxprice" fields. I'm just clutching at straws here.

    Any help would be fully appreciated

    Best regards

    Rod from the UK
    Last edited by vinyl-junkie; 09-08-2017 at 05:19 PM. Reason: added code tags

  2. #2
    Regular Coder
    Join Date
    Sep 2014
    Posts
    198
    Thanks
    0
    Thanked 35 Times in 33 Posts
    Its been sometime since I touched ASPX so I am not sure if the requirement still applies.

    First, what is your Language, is it csharp or VB.

    Bring up your web page and then do a view source. You'll notice that the elements id is the the same as the id you specified in asp.

    eg.

    Code:
    <asp:DropDownList ID="minprice" runat="server" class="form-control" onchange="sum();">
    is translated to something like:
    Code:
    <select name="ctl00$MainContent$minprice" id="MainContent_minprice" class="form-control" onchange="sum();">
    What you do is stick the following statements in the <script> tag, right before the </body>. The property CLientID is the one assigned by aspx at run time.

    Code:
    <script type="text/javascript">
        //
        // note, you cannot put the following statements in a separated js file
        // as aspx parser will not see the ClientID
        //
        var elm_minprice = document.getElementById('<%= minprice.ClientID %>');
        var elm_maxprice = document.getElementById('<%= maxprice.ClientID %>');
        var elm_newprice = document.getElementById('<%= newprice.ClientID %>');
    
        // at this point you are free to put the next statements in a separate file.
    
        function sum() {
            alert("debug: function sum called");
            var txtFirstNumberValue = elm_minprice.value;
            var txtSecondNumberValue = elm_maxprice.value;
            var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue);
            if (!isNaN(result)) {
                elm_newprice.value = result;
            }
        }
    </script>
    You can view the source to see what aspx generated.

    Note, a minor problem in your second drop down. The closing '>' is not specified

    Code:
    <asp:DropDownList ID="maxprice" runat="server" class="form-control" onchange="sum();">


 

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •