Problem running jquery on textbox exit

I have a situation where I have several textboxes.  All of which should run a calculation on each other when one of the textboxes is exited.  So I have a total charge amount that has to be distributed to other textboxes.  After each textbox is left I need to calculate the amount that is left to distribute.  I also do not want the button to be enabled until I have distributed the entire amount to Zero.  

This is on a master page and on a update panel is where textboxes are loaded.  I have sent the html markup.  Because of the master page each item is called  $('#MainContent_ControlName').

  <asp:UpdatePanel runat="server" ID="pnlDetails">
                    <ContentTemplate>
                         <div class="row">
                            <div class="col-xs-2 text-right">
                              
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Holder Name:</asp:Label>
                                
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                  <asp:TextBox ID="txtCHName" runat="server" CssClass="form-control" TabIndex="10">
                                   
                                </asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" text="*" ControlToValidate="txtCHName" ErrorMessage="Card Holder Name is required." ValidationGroup="Main"></asp:RequiredFieldValidator>
                                      </div>
                           

                         
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server"  CssClass="mylabel" Font-Bold="true">Billing Phone No:</asp:Label>
                            </div>
                            <div class="col-xs-3">
                                <asp:TextBox ID="txtCHPhone" runat="server" CssClass="form-control" TabIndex="11"></asp:TextBox>
                            </div>
                        
                        </div>
                        <br />
                        <div class="row">
                             <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Holder Email:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox ID="txtCHEmail" runat="server" CssClass="form-control" TabIndex="12"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtCHEmail" text="*" ErrorMessage="Resident Email is required." ValidationGroup="Main"></asp:RequiredFieldValidator>
                                <asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server" ControlToValidate="txtCHEmail" ErrorMessage="Invalid email address" 
									ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                            </div>
                           
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server"  CssClass="mylabel" Font-Bold="true">Billing Zip Code:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox ID="txtCHZip" runat="server" CssClass="form-control" TabIndex="13"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator19" runat="server" ControlToValidate="txtCHZip" ErrorMessage="Zip Code is required" ValidationGroup="Main">*</asp:RequiredFieldValidator>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" ControlToValidate="txtCHZip" ErrorMessage="Invalid Zip Code" ValidationExpression="\d{5}(-\d{4})?" ValidationGroup="Main">*</asp:RegularExpressionValidator>
							
                            </div>
                        </div>
                        <hr />

                        <div class="row">
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Number:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox runat="server" ID="txtCardNo" CssClass="form-control" TabIndex="14"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtCardNo" ErrorMessage="Card Number is required" 
									ValidationGroup="Main">*</asp:RequiredFieldValidator>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server" ControlToValidate="txtCardNo" ErrorMessage="Invalid Card Number, must be 14-16 numbers" ValidationExpression="\d{14,16}" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                            </div>
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">CVC Code:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox runat="server" ID="txtCVC" CssClass="form-control" TabIndex="15"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator17" runat="server" ControlToValidate="txtCVC" ErrorMessage="CVC is required" ValidationGroup="Main">*</asp:RequiredFieldValidator>
								</span>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator8" runat="server" ControlToValidate="txtCVC" ErrorMessage="Invalid CVC Code" ValidationExpression="\d{3,4}" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                            </div>
                       </div>

                        <br />
                        <div class="row">
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Expiration</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:DropDownList runat="server" ID="ddMonth" CssClass="form-control" width="100px" TabIndex="16" >
                                    <asp:ListItem Value="01">January</asp:ListItem>
									<asp:ListItem Value="02">Febuary</asp:ListItem>
									<asp:ListItem Value="03">March</asp:ListItem>
									<asp:ListItem Value="04">April</asp:ListItem>
									<asp:ListItem Value="05">May</asp:ListItem>
									<asp:ListItem Value="06">June</asp:ListItem>
									<asp:ListItem Value="07">July</asp:ListItem>
									<asp:ListItem Value="08">August</asp:ListItem>
									<asp:ListItem Value="09">September</asp:ListItem>
									<asp:ListItem Value="10">October</asp:ListItem>
									<asp:ListItem Value="11">November</asp:ListItem>
									<asp:ListItem Value="12">December</asp:ListItem>
									<asp:ListItem Selected="True" Value="00">Month</asp:ListItem>
                                </asp:DropDownList><asp:RangeValidator ID="RangeValidator1" runat="server" Text="*" ErrorMessage="Please Select Expiration Month" ControlToValidate="ddMonth" MaximumValue="13" MinimumValue="1" SetFocusOnError="False" ValidationGroup="Main" Type="Integer"></asp:RangeValidator>
                            <span>/</span>
                               
                                     <asp:DropDownList runat="server" ID="ddYear" CssClass="form-control " width="150px" TabIndex="17">
                                    <asp:ListItem>2015</asp:ListItem>
									<asp:ListItem>2016</asp:ListItem>
									<asp:ListItem>2017</asp:ListItem>
									<asp:ListItem>2018</asp:ListItem>
									<asp:ListItem>2019</asp:ListItem>
									<asp:ListItem>2020</asp:ListItem>
									<asp:ListItem>2021</asp:ListItem>
									<asp:ListItem>2022</asp:ListItem>
                                    <asp:ListItem>2023</asp:ListItem>
                                    <asp:ListItem>2024</asp:ListItem>
                                    <asp:ListItem>2025</asp:ListItem>
									<asp:ListItem Selected="True" Value="00">Year</asp:ListItem>

                                </asp:DropDownList>
                                <asp:RangeValidator ID="RangeValidator2" runat="server" Text="*" ErrorMessage="Please Select Expiration Year" ControlToValidate="ddyear" ValidationGroup="Main" Type="Integer" MaximumValue="2026" MinimumValue="2015"></asp:RangeValidator>
                               
                            </div>
                             <div class="col-xs-2 text-right">
                                   <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Convenience Fee?</asp:Label>
                                </div>
                            <div class="col-xs-3">
                                <asp:CheckBox runat="server" ID="chkFee" TabIndex="18"   />
                            </div>
                           

                          <%--  <div class="col-xs-2">
                                <asp:Label runat="server" CssClass="control-label" Font-Bold="true">CVC Code:</asp:Label>
                            </div>
                            <div class="col-xs-3">
                                <asp:TextBox runat="server" ID="TextBox3" CssClass="img-rounded"></asp:TextBox>
                            </div>--%>
                       </div>
                        <br />
                            <div class="row">
                                <div class="col-xs-2 text-right">
                                    <asp:Label runat="server"  CssClass="mylabel"  >Description:</asp:Label>
                                </div>
                                <div class="col-xs-6 text-nowrap">
                                    <asp:TextBox runat="server" ID="txtDescrip" CssClass="form-control" TabIndex="19">

                                    </asp:TextBox>

                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator21" runat="server" ControlToValidate="txtDescrip" ErrorMessage="Description is required" text="*"
									ValidationGroup="Main"></asp:RequiredFieldValidator>

                                </div>
                                </div>
                        <br />
                        <div class="row">
                                <div class="col-xs-2 text-right">
                                    <asp:Label runat="server" CssClass="mylabel">
                                        Property Email:
                                    </asp:Label>
                                </div>
                                <div class="col-xs-6 text-nowrap">
                                    <asp:TextBox runat="server" ID="txtPropEmail" CssClass="form-control" TabIndex="20" >

                                    </asp:TextBox>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtPropEmail" text="*" ErrorMessage="Property Email is required." ValidationGroup="Main"></asp:RequiredFieldValidator>
                                <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="txtPropEmail" ErrorMessage="Invalid email address" 
									ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                                </div>
                            </div>
                        <hr />

                        
                        <div class="row">
                            <div class="col-xs-12">
                                <div class="row">
                                    <div class="col-xs-2 text-right">
                                        <asp:Label runat="server" CssClass="mylabel" Font-Bold ="true">Amount of Charge</asp:Label>
                                    </div>
                                    <div class="col-xs-4">
                                          <asp:TextBox runat="server" ID="txtChargeAmt" TabIndex="21"></asp:TextBox>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator16" runat="server" ControlToValidate="txtChargeAmt" ErrorMessage="Charge Amount is requried" 
									ValidationGroup="Main">*</asp:RequiredFieldValidator>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ControlToValidate="txtChargeAmt" ErrorMessage="Invalid Amount" 
									ValidationExpression="^\$?([0-9]{1,3},([0-9]{3},)*[0-9]{3}|[0-9]+)(.[0-9][0-9])?$" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                                    </div>
                                    <div class="col-xs-6 text-center">
                                         <asp:Label runat="server" Font-Bold="true" ForeColor="red">Apply Charge amount to Accounts below
                                         </asp:Label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xs-2 text-right">
                                         <asp:Label runat="server" CssClass="mylabel" ForeColor="blue">Convenience Fee
                                                                   </asp:Label>
                                        </div>
                                        <div class="col-xs-3">
                                            <asp:Label runat="server" ID="lblLeft" ForeColor="red"></asp:Label>
                                        </div>
                                    

                                </div>
                                <div class="row">
                                    <div class="col-xs-5"></div>
                                    <div class="col-xs-3 text-right">
                                        <asp:Label runat="server" Font-Bold="true">Application Fee</asp:Label>
                                    </div>
                                    <div class="col-xs-2">
                                         <asp:TextBox runat="server" ID="txtAppAmt" Text="$0.00" TabIndex="22"></asp:TextBox>
                                    </div>
                                </div>
                                 <div class="row">
                                    <div class="col-xs-2 text-right">
                                        <asp:Label runat="server" Font-Size="Large" CssClass="mylabel" ForeColor="red">Amt left to Apply</asp:Label>
                                    </div>
                                    <div class="col-xs-3">
                                        <asp:Label runat="server" CssClass="mylabel" Font-Size="Large" Text="$0.00" ForeColor="red"></asp:Label>
                                    </div>

                                   
                                    <div class="col-xs-3 text-right">
                                       <asp:label runat="server" Font-Bold="true" >Rent</asp:label>
                                    </div>
                                    <div class="col-xs-2">
                                          <asp:TextBox runat="server" ID="txtRentAmt" Text="$0.00" TabIndex="23"></asp:TextBox>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xs-5"></div>
                                    <div class="col-xs-3 text-right">
                                        <asp:Label runat="server" Font-Bold="true">Security Deposit</asp:Label>
                                    </div>
                                    <div class="col-xs-3 ">
                                        <asp:TextBox runat="server" ID="txtSecDep" Text="$0.00" TabIndex="24"></asp:TextBox>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xs-3 text-right">
                                        <asp:Button runat="server" ID="btnProcess" text="Process" CssClass=" button btn-success" ValidationGroup="Main" OnClick="btnProcess_Click" TabIndex="27"/>
                                    </div>
                                    <div class="col-xs-2 ">
                                        <asp:Button runat="server" ID="btnCancel" text="Cancel" CssClass="button btn-danger" OnClick="btnCancel_Click" TabIndex="28"/>
                                    </div>
                                    <div class="col-xs-3 text-right">
                                <asp:label runat="server" Font-Bold="true" >Security Pet</asp:label>
                            </div>
                            <div class="col-xs-3">
                                 <asp:TextBox runat="server" ID="txtSecPet" Text="$0.00" TabIndex="25"></asp:TextBox>
                            </div>

                                </div>
                                <div class="row">
                                    <div class="col-xs-5">
                                                                              
                                    </div>
                                     <div class="col-xs-3 text-right">
                                <asp:label runat="server" Font-Bold="true" >Collections</asp:label>
                            </div>
                            <div class="col-xs-3 ">
                                 <asp:TextBox runat="server" ID="txtCollAmt" Text="$0.00" TabIndex="26"></asp:TextBox>
                            </div>
                                </div>

                            </div>
                        </div>
                        <asp:ValidationSummary ID="ValidationSummary1" runat="server" ValidationGroup="Main" ShowMessageBox="True" ShowSummary="False" />
                        <hr />
                        <div class="row">
                            <div class="col-xs-12">
                              <span style="color:red">
                                  If the payment is for anything other than an application fee and/or down payment on move-in money to reserve the apartment, be sure to check this box so that the convenience fee will be billed to the account in eSite. 
                              </span> 


                            </div>
                        </div>
                        <script type ="text/javascript">
                            $('#MainContent_txtCHPhone').watermark("(xxx)-xxx-xxxx");
                            $(function () {
                                $('#MaintContent_txtChargeAmt').Change(function () {
                                    alert('changed');
                                });
                            });

                        </script>
                    </ContentTemplate>
            </asp:UpdatePanel>

Open in new window

mgmhicksAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Rainer JeschorCommented:
Hi,
not sure about your calculation logic, but the change function has to be lowercase:
$(function () {
                                $('#MaintContent_txtChargeAmt').change(function () {
                                    alert('changed');
                                });
                            });

Open in new window

(instead of .Change)

So where can we help?

Thanks
Rainer
0
mgmhicksAuthor Commented:
Here is the code again.  I'm trying that and I can not get the watermark to work or the change event to fire.  Syntax seems fine, any other ideas?  Thank you.



<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPages/Companion2015.master" AutoEventWireup="false" CodeFile="CCPayments.aspx.vb" Inherits="Shared_CCPayments" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
   
      <style type="text/css">
        .FormatRadioButtonList label
{
  margin-right: 15px;
  margin-left: -3px;
}
  
        input[type=checkbox] {width:20px; height:20px;}
        .mylabel {
            font-weight: bold;
           
        }
@media (min-width: 768px) {
  .modal-xl {
    width: 90%;
   max-width:1200px;
   text-align:left
  }
}

@media (min-width: px) {
  .modal-xl {
    width: 90%;
   max-width:1200px;
   text-align:left
  }
}

    </style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
    <p>&nbsp;</p>
    <br />
     <div class="container">
  <br />
                    <h3>Credit Card Payments</h3>
                                        
         

       
            <asp:UpdatePanel runat="server" ID="pnlProperty" UpdateMode="Always">
              
                <ContentTemplate>
                
            
            <p>&nbsp;</p>

            <div class="row">
                <div class="col-sm-1 text-right ">
                    <asp:Label runat="server" CssClass="mylabel "  >Locations</asp:Label>
                </div>
                <div class="col-sm-4">
                    <asp:DropDownList ID="ddLocations" runat="server"  AutoPostBack="True" CssClass="form-control"></asp:DropDownList>
                </div>
                <div class="col-sm-1">
                    &nbsp;
                </div>
                <div class="col-sm-1 text-right">
                    <asp:Label runat="server" CssClass="mylabel">Properties</asp:Label>
                </div>
                <div class="col-sm-4">
                    <asp:DropDownList ID="ddProperties" runat="server"  AutoPostBack="True" CssClass="form-control"></asp:DropDownList>
                </div>
            </div>
            
            <p>&nbsp;</p>

       <div class="row">
              <div class="col-xs-1 text-right">
                  <asp:Label runat ="server" CssClass="mylabel">Search Text</asp:Label>
              </div>
              <div class="col-xs-4">
                   <asp:TextBox runat="server" ID="txtSearch"    CssClass="form-control" ></asp:TextBox>
               </div>
            <div class="col-xs-1">
                &nbsp;
            </div>
            <div class="col-xs-4">
                <asp:RadioButtonList runat="server" ID="searchby" RepeatDirection="Horizontal" CellPadding="10" RepeatLayout="Flow"  CssClass="FormatRadioButtonList" AutoPostBack="true" >
                    <asp:ListItem Text="By Last Name" Value="0" Selected="true" ></asp:ListItem>
                    <asp:ListItem Text="By Email" Value ="1"></asp:ListItem>
                    <asp:ListItem Text="By Phone" Value ="2"></asp:ListItem>
                </asp:RadioButtonList>
            </div>


               <div class="col-xs-1">
                    <asp:Button ID ="btnSearch" runat="server" CssClass="btn-success" Text="Search"  />
               </div>
           </div>


                    <div class="row">
                        <div class="col-xs-6 col-xs-push-1">
                            <asp:Label runat="server" ID="lblHint" ForeColor="red"></asp:Label>
                        </div>
                    </div>


            <hr />


         <div class="modal " id="EntryScreen" tabindex="-1" role="dialog" aria-hidden="true">
             <div class="modal-dialog modal-xl">
                 <div class="modal-content">
                     <asp:HiddenField runat="server" ID="hfID" />

                     <div class="modal-header">
                         <button type="button" class="close" data-dismiss="modal" aria-hidden="false">Close</button>
                     </div>
                     <div class="modal-body">
                          <asp:GridView ID="gvResidents" runat="server"
                        AllowPaging="True" AutoGenerateColumns="False"  CssClass="table table-bordered table-striped table-responsive pagination-ys" EmptyDataText="No Records Found" >
                        <Columns>
                     <asp:TemplateField HeaderText="Full ID">
					
					<ItemTemplate>
							<asp:Label ID="lblFullID" runat="server" Text='<%# Bind("FullID") %>'></asp:Label>
					</ItemTemplate>
			</asp:TemplateField>
                              <asp:TemplateField HeaderText="Resident Name">
					
					<ItemTemplate>
							<asp:Label ID="lblResiName" runat="server" Text='<%# Bind("ResidentName") %>'></asp:Label>
					</ItemTemplate>
			</asp:TemplateField>	
                             <asp:TemplateField HeaderText="Phone 1">
					
					<ItemTemplate>
					    	    
							<asp:Label ID="lblPhone" runat="server" Text='<%# Bind("Phone1") %>'> </asp:Label>
					</ItemTemplate>
			</asp:TemplateField>	
			
			  <asp:TemplateField HeaderText="Email Address">
					
					<ItemTemplate>
							<asp:Label ID="lblEmail" runat="server" Text='<%# Bind("Email") %>'></asp:Label>
					</ItemTemplate>
			</asp:TemplateField>	
			 <asp:TemplateField HeaderText="Status">
					
					<ItemTemplate>
							<asp:Label ID="lblStatus" runat="server" Text='<%# Bind("ResiStatus") %>'></asp:Label>
					</ItemTemplate>
			</asp:TemplateField>	
			 <asp:TemplateField HeaderText="Lease Ends">
					
					<ItemTemplate>
							<asp:Label ID="lblEnds" runat="server" Text='<%# Bind("LeaseEndDate","{0:d}") %>'></asp:Label>
					</ItemTemplate>
			</asp:TemplateField>	
                            <asp:TemplateField ShowHeader="False">
                   <ItemTemplate>

                       <asp:ImageButton ID="btnImage" runat="server" ImageUrl="../images/check2.png" CommandArgument='<%# Container.DataItemIndex%>'  CommandName="Select" OnCommand ="btnImage_Command"  />

                       
                           
                   </ItemTemplate>
               </asp:TemplateField>


                        </Columns>
                    </asp:GridView>

                     </div>
                 </div>
             </div>
         </div>



                </ContentTemplate>
            </asp:UpdatePanel>



          <%-- <asp:updatepanel ID="Panel2" runat="server" UpdateMode="Always">
               <Triggers>
                   <asp:AsyncPostBackTrigger ControlID="btnSearch" EventName="Click"  />
                   
               </Triggers>
               <ContentTemplate>
            <div class="row">
                <div class="col-xs-12 col-sm-6">
                   
                </div>
            </div>

               </ContentTemplate>

           </asp:updatepanel>--%>
            <br />

            <asp:UpdatePanel runat="server" ID="pnlDetails">
                    <ContentTemplate>
                         <div class="row">
                            <div class="col-xs-2 text-right">
                              
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Holder Name:</asp:Label>
                                
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                  <asp:TextBox ID="txtCHName" runat="server" CssClass="form-control" TabIndex="10">
                                   
                                </asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" text="*" ControlToValidate="txtCHName" ErrorMessage="Card Holder Name is required." ValidationGroup="Main"></asp:RequiredFieldValidator>
                                      </div>
                           

                         
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server"  CssClass="mylabel" Font-Bold="true">Billing Phone No:</asp:Label>
                            </div>
                            <div class="col-xs-3">
                                <asp:TextBox ID="txtCHPhone" runat="server" CssClass="form-control" TabIndex="11"></asp:TextBox>
                            </div>
                        
                        </div>
                        <br />
                        <div class="row">
                             <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Holder Email:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox ID="txtCHEmail" runat="server" CssClass="form-control" TabIndex="12"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtCHEmail" text="*" ErrorMessage="Resident Email is required." ValidationGroup="Main"></asp:RequiredFieldValidator>
                                <asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server" ControlToValidate="txtCHEmail" ErrorMessage="Invalid email address" 
									ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                            </div>
                           
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server"  CssClass="mylabel" Font-Bold="true">Billing Zip Code:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox ID="txtCHZip" runat="server" CssClass="form-control" TabIndex="13"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator19" runat="server" ControlToValidate="txtCHZip" ErrorMessage="Zip Code is required" ValidationGroup="Main">*</asp:RequiredFieldValidator>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" ControlToValidate="txtCHZip" ErrorMessage="Invalid Zip Code" ValidationExpression="\d{5}(-\d{4})?" ValidationGroup="Main">*</asp:RegularExpressionValidator>
							
                            </div>
                        </div>
                        <hr />

                        <div class="row">
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Number:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox runat="server" ID="txtCardNo" CssClass="form-control" TabIndex="14"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtCardNo" ErrorMessage="Card Number is required" 
									ValidationGroup="Main">*</asp:RequiredFieldValidator>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server" ControlToValidate="txtCardNo" ErrorMessage="Invalid Card Number, must be 14-16 numbers" ValidationExpression="\d{14,16}" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                            </div>
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">CVC Code:</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:TextBox runat="server" ID="txtCVC" CssClass="form-control" TabIndex="15"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator17" runat="server" ControlToValidate="txtCVC" ErrorMessage="CVC is required" ValidationGroup="Main">*</asp:RequiredFieldValidator>
								</span>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator8" runat="server" ControlToValidate="txtCVC" ErrorMessage="Invalid CVC Code" ValidationExpression="\d{3,4}" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                            </div>
                       </div>

                        <br />
                        <div class="row">
                            <div class="col-xs-2 text-right">
                                <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Card Expiration</asp:Label>
                            </div>
                            <div class="col-xs-3 text-nowrap">
                                <asp:DropDownList runat="server" ID="ddMonth" CssClass="form-control" width="100px" TabIndex="16" >
                                    <asp:ListItem Value="01">January</asp:ListItem>
									<asp:ListItem Value="02">Febuary</asp:ListItem>
									<asp:ListItem Value="03">March</asp:ListItem>
									<asp:ListItem Value="04">April</asp:ListItem>
									<asp:ListItem Value="05">May</asp:ListItem>
									<asp:ListItem Value="06">June</asp:ListItem>
									<asp:ListItem Value="07">July</asp:ListItem>
									<asp:ListItem Value="08">August</asp:ListItem>
									<asp:ListItem Value="09">September</asp:ListItem>
									<asp:ListItem Value="10">October</asp:ListItem>
									<asp:ListItem Value="11">November</asp:ListItem>
									<asp:ListItem Value="12">December</asp:ListItem>
									<asp:ListItem Selected="True" Value="00">Month</asp:ListItem>
                                </asp:DropDownList><asp:RangeValidator ID="RangeValidator1" runat="server" Text="*" ErrorMessage="Please Select Expiration Month" ControlToValidate="ddMonth" MaximumValue="13" MinimumValue="1" SetFocusOnError="False" ValidationGroup="Main" Type="Integer"></asp:RangeValidator>
                            <span>/</span>
                               
                                     <asp:DropDownList runat="server" ID="ddYear" CssClass="form-control " width="150px" TabIndex="17">
                                    <asp:ListItem>2015</asp:ListItem>
									<asp:ListItem>2016</asp:ListItem>
									<asp:ListItem>2017</asp:ListItem>
									<asp:ListItem>2018</asp:ListItem>
									<asp:ListItem>2019</asp:ListItem>
									<asp:ListItem>2020</asp:ListItem>
									<asp:ListItem>2021</asp:ListItem>
									<asp:ListItem>2022</asp:ListItem>
                                    <asp:ListItem>2023</asp:ListItem>
                                    <asp:ListItem>2024</asp:ListItem>
                                    <asp:ListItem>2025</asp:ListItem>
									<asp:ListItem Selected="True" Value="00">Year</asp:ListItem>

                                </asp:DropDownList>
                                <asp:RangeValidator ID="RangeValidator2" runat="server" Text="*" ErrorMessage="Please Select Expiration Year" ControlToValidate="ddyear" ValidationGroup="Main" Type="Integer" MaximumValue="2026" MinimumValue="2015"></asp:RangeValidator>
                               
                            </div>
                             <div class="col-xs-2 text-right">
                                   <asp:Label runat="server" CssClass="mylabel" Font-Bold="true">Convenience Fee?</asp:Label>
                                </div>
                            <div class="col-xs-3">
                                <asp:CheckBox runat="server" ID="chkFee" TabIndex="18"  AutoPostBack="true"  />
                            </div>
                           

                          <%--  <div class="col-xs-2">
                                <asp:Label runat="server" CssClass="control-label" Font-Bold="true">CVC Code:</asp:Label>
                            </div>
                            <div class="col-xs-3">
                                <asp:TextBox runat="server" ID="TextBox3" CssClass="img-rounded"></asp:TextBox>
                            </div>--%>
                       </div>
                        <br />
                            <div class="row">
                                <div class="col-xs-2 text-right">
                                    <asp:Label runat="server"  CssClass="mylabel"  >Description:</asp:Label>
                                </div>
                                <div class="col-xs-6 text-nowrap">
                                    <asp:TextBox runat="server" ID="txtDescrip" CssClass="form-control" TabIndex="19">

                                    </asp:TextBox>

                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator21" runat="server" ControlToValidate="txtDescrip" ErrorMessage="Description is required" text="*"
									ValidationGroup="Main"></asp:RequiredFieldValidator>

                                </div>
                                </div>
                        <br />
                        <div class="row">
                                <div class="col-xs-2 text-right">
                                    <asp:Label runat="server" CssClass="mylabel">
                                        Property Email:
                                    </asp:Label>
                                </div>
                                <div class="col-xs-6 text-nowrap">
                                    <asp:TextBox runat="server" ID="txtPropEmail" CssClass="form-control" TabIndex="20" >

                                    </asp:TextBox>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtPropEmail" text="*" ErrorMessage="Property Email is required." ValidationGroup="Main"></asp:RequiredFieldValidator>
                                <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="txtPropEmail" ErrorMessage="Invalid email address" 
									ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                                </div>
                            </div>
                        <hr />

                        
                        <div class="row">
                            <div class="col-xs-12">
                                <div class="row">
                                    <div class="col-xs-2 text-right">
                                        <asp:Label runat="server" CssClass="mylabel" Font-Bold ="true" Font-Size="Large">Amount of Charge</asp:Label>
                                    </div>
                                    <div class="col-xs-4">
                                          <asp:TextBox runat="server" ID="txtChargeAmt" TabIndex="21"  Font-Size="Large"></asp:TextBox>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator16" runat="server" ControlToValidate="txtChargeAmt" ErrorMessage="Charge Amount is requried" 
									ValidationGroup="Main">*</asp:RequiredFieldValidator>
								<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ControlToValidate="txtChargeAmt" ErrorMessage="Invalid Amount" 
									ValidationExpression="^\$?([0-9]{1,3},([0-9]{3},)*[0-9]{3}|[0-9]+)(.[0-9][0-9])?$" ValidationGroup="Main">*</asp:RegularExpressionValidator>
                                    </div>
                                    <div class="col-xs-6 text-center">
                                         <asp:Label runat="server" Font-Bold="true" ForeColor="red">Apply Charge amount to Accounts below
                                         </asp:Label>
                                    </div>
                                </div>
                                <br />
                                <div class="row">
                                    <div class="col-xs-2 text-right">
                                         <asp:Label runat="server" CssClass="mylabel" ForeColor="blue" Font-Size="Large">Convenience Fee
                                                                   </asp:Label>
                                        </div>
                                        <div class="col-xs-3">
                                            <asp:Label runat="server" ID="lblConFee" ForeColor="blue" Font-Size="Large"></asp:Label>
                                        </div>
                                    

                                </div>
                                <div class="row">
                                    <div class="col-xs-5"></div>
                                    <div class="col-xs-3 text-right">
                                        <asp:Label runat="server" Font-Bold="true">Application Fee</asp:Label>
                                    </div>
                                    <div class="col-xs-2">
                                         <asp:TextBox runat="server" ID="txtAppAmt" Text="$0.00" TabIndex="22" OnTextChanged="txtAppAmt_TextChanged" AutoPostBack="True"></asp:TextBox>
                                    </div>
                                </div>
                                 <div class="row">
                                    <div class="col-xs-2 text-right">
                                        <asp:Label runat="server" Font-Size="Large" CssClass="mylabel" ForeColor="red">Amt left to Apply</asp:Label>
                                    </div>
                                    <div class="col-xs-3">
                                        <asp:Label runat="server" CssClass="mylabel" Font-Size="Large" Text="$0.00" ID="lblLeftToAppy" ForeColor="red"></asp:Label>
                                    </div>

                                   
                                    <div class="col-xs-3 text-right">
                                       <asp:label runat="server" Font-Bold="true" >Rent</asp:label>
                                    </div>
                                    <div class="col-xs-2">
                                          <asp:TextBox runat="server" ID="txtRentAmt" Text="$0.00" TabIndex="23" OnTextChanged="txtAppAmt_TextChanged" AutoPostBack="True"></asp:TextBox>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xs-5"></div>
                                    <div class="col-xs-3 text-right">
                                        <asp:Label runat="server" Font-Bold="true">Security Deposit</asp:Label>
                                    </div>
                                    <div class="col-xs-3 ">
                                        <asp:TextBox runat="server" ID="txtSecDep" Text="$0.00" TabIndex="24" OnTextChanged="txtAppAmt_TextChanged" AutoPostBack="True"></asp:TextBox>
                                    </div>
                                </div>
                                <%-- Buttons --%>
                                <div class="row">
                                    <div class="col-xs-3 text-right">
                                        <asp:Button runat="server" ID="btnProcess" text="Process" CssClass=" button btn-success" ValidationGroup="Main" OnClick="btnProcess_Click" TabIndex="27" Visible="false"/>
                                    </div>
                                    <div class="col-xs-2 ">
                                        <asp:Button runat="server" ID="btnCancel" text="Cancel" CssClass="button btn-danger" OnClick="btnCancel_Click" TabIndex="28"/>
                                    </div>
                                    <div class="col-xs-3 text-right">
                                <asp:label runat="server" Font-Bold="true" >Security Pet</asp:label>
                            </div>
                            <div class="col-xs-3">
                                 <asp:TextBox runat="server" ID="txtSecPet" Text="$0.00" TabIndex="25" OnTextChanged="txtAppAmt_TextChanged" AutoPostBack="True"></asp:TextBox>
                            </div>

                                </div>
                                <div class="row">
                                    <div class="col-xs-5">
                                                                              
                                    </div>
                                     <div class="col-xs-3 text-right">
                                <asp:label runat="server" Font-Bold="true" >Collections</asp:label>
                            </div>
                            <div class="col-xs-3 ">
                                 <asp:TextBox runat="server" ID="txtCollAmt" Text="$0.00" TabIndex="26" OnTextChanged="txtAppAmt_TextChanged" AutoPostBack="True"></asp:TextBox>
                            </div>
                                </div>

                            </div>
                        </div>
                        <asp:ValidationSummary ID="ValidationSummary1" runat="server" ValidationGroup="Main" ShowMessageBox="True" ShowSummary="False" />
                        <hr />
                        <div class="row">
                            <div class="col-xs-12">
                              <span style="color:red">
                                  If the payment is for anything other than an application fee and/or down payment on move-in money to reserve the apartment, be sure to check this box so that the convenience fee will be billed to the account in eSite. 
                              </span> 


                            </div>
                        </div>
                        <asp:HiddenField runat="server" ID="hfFullID" />


                        <%-- Are you sure screen --%>
                        <div class="modal " id="ConfirmScreen" tabindex="-1" role="dialog" aria-hidden="true">
                            <div class="modal-dialog modal-xl">
                                <div class="modal-content">
                                    <asp:HiddenField runat="server" ID="HiddenField1" />

                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-hidden="false">Close</button>
                                    </div>
                                    <div class="modal-body">
                                        <div class="row">
                                            <div class="col-xs-1">
                                                Resident ID
                                            </div>
                                            <div class="col-xs-3">
                                                <asp:label runat="server" ID="confirmFullID"></asp:label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                       
                       

                        
                    </ContentTemplate>
            </asp:UpdatePanel>


         <p>&nbsp;</p>

            </div> <%--Container--%>
        
        
     <script >
         function pageLoad() {
             $(function () {
                 $("#MainContent_txtChargeAmt").change(function () {
                     alert("Alert: Hello from jQuery!");
                 });
             });
             $('#MainContent_txtDescrip').watermark("Enter Description");

         }






                            </script>

    


</asp:Content>

Open in new window

0
mgmhicksAuthor Commented:
Could my issue be the validation controls.
0
Cloud Class® Course: SQL Server Core 2016

This course will introduce you to SQL Server Core 2016, as well as teach you about SSMS, data tools, installation, server configuration, using Management Studio, and writing and executing queries.

mgmhicksAuthor Commented:
I am using this script and I did get the change event to work.  I got it to work with the .cal class.  so that is firing.  However when I get to the calculate function its coming up with no value on the  var fullamt = $('#MainContent_txtCollAmt').val(); even though I just type 10.00 in there.  The alert says 'Unidentified'



<script >
                            function pageLoad() {
                                $(function () {
                                    $("#MainContent_txtChargeAmt").change(function () {
                                        alert("Alert: Hello from jQuery!");
                                    });
                                });

                                $('.cal').change(function () {
                                    Calulate();
                                })

                                $('#MainContent_txtDescrip').watermark("Enter Description");

                                function Calulate() {
                                    var fullamt = $('#MainContent_txtCollAmt').val();
                                    alert(fullamt);
                                }


                            }






                            </script>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
mgmhicksAuthor Commented:
Figured it out, problem is that It wants me to use the $("#<%= txtChargeAmt.ClientID %>").val() and it works.

thanks
0
mgmhicksAuthor Commented:
I figured out the problem
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.