We Keep Coding

2 Modals in the same form but 1 button isn't going off

Problem
I'm creating a webshop and I want to use two different modals in one form in my masterpage, one modal is to create accounts and the other modal is to log users in.
The first modal works perfect, you can open the modal with the button, the buttons inside the modal also work perfect (e.g., register and close buttons). But the other modal (log in) doesn't work, you can open the modal and close the modal, but you can't log in. So the button log in inside the modal "log in" doesn't work, I have some C# code behind that button, but it never activated the code because the button doesn't go off. I put a breakpoint just after the BtnLogin_click, but even the breakpoint doesn't go off. The thing is if I put the second modal (register) in comment, the login modal works again or there must be something wrong in form right? Any tips or advice?
Attempt
The things I tried are:
Looked at the properties of the button, then event, and it said it's onclick with the correct name. Tried to create a new button, and a new onclick event.
HTML
The 2 buttons to open the modals
<input type = "button" id="btnShowLogin" class="btn btn-primary" value = "Login" />
<input type = "button" id="btnShowRegister" class="btn btn-primary" value = "Registreer" />
Modal 1 Login (not working)
<form id="form1" runat="server">
<div class="modal fade" id="LoginModal" tabindex="-1" role="dialog" aria-labelledby="ModalTitle"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×</button>
<h4 class="modal-title" id="ModalTitle">
Login</h4>
</div>
<div class="modal-body">
<label for="txtUsername">
Username</label>
<asp:TextBox ID="txtUsername" runat="server" CssClass="form-control" placeholder="Enter Username"
/>
<br />
<label for="txtPassword">
Password</label>
<asp:TextBox ID="txtPassword" runat="server" TextMode="Password" CssClass="form-control"
placeholder="Enter Password" />
<div class="checkbox">
<asp:CheckBox ID="chkRememberMe" Text="Remember Me" runat="server" />
</div>
<div id="dvMessage" runat="server" visible="false" class="alert alert-danger">
<strong>Error!</strong>
<asp:Label ID="lblMessage" runat="server" />
</div>
</div>
<div class="modal-footer">
<asp:Button ID="btnLogin" Text="Login" runat="server" OnClick="ValidateUser" CssClass="btn btn-default" Visible="true" />
<button type="button" class="btn btn-default" data-dismiss="modal">
Close</button>
</div>
</div>
</div>
</div>
Modal 2 register (working)
<div class="modal fade" id="RegisterModal" tabindex="-2" role="dialog" aria-labelledby="Registreer"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×</button>
<h4 class="modal-title" id="Registreer">
Registreer</h4>
</div>
<div class="modal-body">
<label for="TxtVnaam">
Voornaam</label>
<asp:TextBox ID="TxtVnaam" runat="server" CssClass="form-control" placeholder="Enter Voornaam"
/>
<label for="Txtnaam">
Achternaam
</label>
<asp:TextBox ID="Txtnaam" runat="server" CssClass="form-control" placeholder="Enter Achternaam"
/>
<br />
<label for="TxtNick">
Username</label>
<asp:TextBox ID="TxtNick" runat="server" CssClass="form-control" placeholder="Enter Username"
/>
<label for="txtEmail">
Email</label>
<asp:TextBox ID="txtEmail" runat="server" CssClass="form-control" placeholder="Enter Email"
/>
<br />
<asp:RequiredFieldValidator ErrorMessage="Required" Display="Dynamic" ForeColor="Red"
ControlToValidate="txtEmail" runat="server" />
<asp:RegularExpressionValidator runat="server" Display="Dynamic" ValidationExpression="\w+([-+.']\w+)*#\w+([-.]\w+)*\.\w+([-.]\w+)*"
ControlToValidate="txtEmail" ForeColor="Red" ErrorMessage="Invalid email address." />
<label for="txtWW">
Wachtwoord</label>
<asp:TextBox ID="TxtWW" runat="server" CssClass="form-control" placeholder="Enter Wachtwoord"
/>
<label for="bevestig">
Bevestig Wachtwoord</label>
<asp:TextBox ID="bevestig" runat="server" CssClass="form-control" placeholder="Enter Wachtwoord"
/><asp:CompareValidator ErrorMessage="Passwords do not match." ForeColor="Red" ControlToCompare="txtWW"
ControlToValidate="bevestig" runat="server" />
<label for="TxtGemeente">
Gemeente</label>
<asp:TextBox ID="TxtGemeente" runat="server" CssClass="form-control" placeholder="Enter Gemeente"
/>
<label for="TxtPC">
Postcode</label>
<asp:TextBox ID="TxtPC" runat="server" CssClass="form-control" placeholder="Enter Postcode"
/>
<br />
<label for="TxtAdres">
Adres</label>
<asp:TextBox ID="TxtAdres" runat="server" CssClass="form-control" placeholder="Enter adres"
/>
<br />
<label for="TxtTel">
Telefoonnummer</label>
<asp:TextBox ID="TxtTel" runat="server" CssClass="form-control" placeholder="Enter Telefoonnummer"
/>
<label for="TxtRek">
Rekeningnummer</label>
<asp:TextBox ID="TxtRek" runat="server" CssClass="form-control" placeholder="Enter rekeningnummer"
/>
<br />
</div>
<div class="modal-footer">
<asp:Button ID="Button1" Text="Registreer" runat="server" OnClick="RegisterUser" Class="btn btn-primary" />
<button type="button" class="btn btn-default" data-dismiss="modal">
Close</button>
</div>
</div>
</div>
</div>
</form>
JavaScript
<script type="text/javascript" src='https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js'></script>
<script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js'></script>
<script type="text/javascript">
$(function () {
$("#btnShowLogin").click(function () {
$('#LoginModal').modal('show');
});
});
$(function () {
$("#btnShowRegister").click(function () {
$('#RegisterModal').modal('show');
});
});
</script>
I expect that the button login inside the modal login will active so it can use the code I put behind it and validate the user.

you have to set ValidationGroup attribute for RequiredFieldValidator for registering .
for example :
<asp:RequiredFieldValidator ValidationGroup="register" ErrorMessage="Required" Display="Dynamic" ForeColor="Red"
ControlToValidate="txtEmail" runat="server" />
when use asp validators you should set ValidationGroup attribute because in your case you have 2 submit buttons and when you click on log in button validator of registration show the message in hidden modal and form will not submit.

Jquery uncheck RadioButtonList on TextBox change

I have a RadioButtonList inside a repeater and I want to clear the checked value on the OnChange of a textbox
<asp:Repeater ID="QuestionsRpt" runat="server">
<HeaderTemplate>
<div class="form-horizontal form-condensed">
</HeaderTemplate>
<ItemTemplate>
<div class="form-group">
<label class='col-sm-6 control-label' style="text-align:left"><span id="Question" runat="server"><%# Eval("Name_" + UserLanguage.ToUpper()) %></span> <i class="fa fa-question-circle" runat="server" visible='<%# Eval("Description_" + UserLanguage.ToUpper()).ToString() != ""%>' data-toggle="tooltip" title='<%# Eval("Description_" + UserLanguage.ToUpper()).ToString()%>'></i></label>
<div class="col-sm-6">
<asp:RadioButtonList ID="RadioButtonList" runat="server" CssClass="RadioButtonList" AutoPostBack="true"
DataSource='<%# (Eval("ListOfChoice_" + UserLanguage.ToUpper()).ToString()).Split(";".ToCharArray()) %>'
Visible='<%# (Convert.ToInt32(Eval("Type_IsSingleChoice")) == 1)%>'>
</asp:RadioButtonList>
<input type='text' id="OtherOptionTB" runat="server"
placeholder='<%# GetLocalResourceObject("Other Option") %>' class="form-control otherOption input-sm" value=''
autocomplete="off" visible='<%# Eval("AllowFreeText")%>' onchange="ResetRadioButtonList()"/>
</div>
</div>
<br />
</ItemTemplate>
<FooterTemplate>
</div>
</FooterTemplate>
Here is the jquery:
<script type="text/javascript">
function ResetRadioButtonList() {
$(event.target).closest('.form-group').find('.RadioButtonList').prop('checked', false);
}
When I log $(event.target).closest('.form-group').find('.RadioButtonList') I do get the the RadioButtonList but I can't seem to figure out how to clear it correctly.

I found the problem...
I need to access all the inputs in my RadioButtonList
Here is the updated Jquery:
function ResetRadioButtonList() {
$(event.target).closest('.form-group').find('.RadioButtonList').find('input:radio').prop('checked', false);}

Enable Required Field Validation In Only One Button Click

i am developing application in asp.net c#, in that i have a problem .
the problem is
i have three fields in a asp.net page, in that it having Bank Name, Branch, and IFSC Code, these three is mandatory to fill when i click save button,
but when i click search & clear button also it should ask to fill these fields.
how to restrict this when click other buttons
"please fill in this field"..
suppose if i search sbi bank only, it asks to enter every field.
MY CODE
Enter Bank
</div>
<div class="form-group col-md-3">
<label for="exampleInputEmail1">
Enter Branch</label>
<asp:TextBox ID="txtBranchName" runat="server" type="text" CssClass="form-control" PlaceHolder="Enter Branch" required />
</div>
<div class="form-group col-md-3">
<label for="exampleInputEmail1">
Enter IFSC Code</label>
<asp:TextBox ID="txtIFSCCode" runat="server" type="text" CssClass="form-control" PlaceHolder="Enter IFSC Code" required />
</div>
</td>
</tr>
</table>
<br />
<br />
<table border="0px" cellpadding="4px" cellspacing="4px" align="center" width="180px">
<tr>
<td>
<asp:Button ID="btnSave" runat="server" ValidationGroup="valInsert" Text="Save" OnClick="btnSave_Click" ToolTip="Save" CssClass="btn btn-success" />
</td>
<td>
<asp:Button ID="btnClear" runat="server" Text="Clear" OnClick="btnClear_Click" ToolTip="Clear / Refresh" CssClass="btn btn-default" />
</td>
<td>
<asp:Button ID="btnSearch" runat="server" ValidationGroup="valInsert" Text="Search" OnClick="btnSearch_Click" ToolTip="Search" CssClass="btn btn-success" /></td>
<td>
<asp:Button ID="btnPrint" runat="server" Text="Print" OnClientClick="return PrintPanel();" ToolTip="Print" CssClass="btn btn-default" />
</td>
</tr>
</table>

Try to put formnovalidate in your search button code
<asp:Button ID="btnSearch" runat="server" Text="Search" OnClick="btnSearch_Click" ToolTip="Search" CssClass="btn btn-success" formnovalidate />

Use the Validation Group in ASP.net
<asp:TextBox ID="txtCustomer" class="form-control" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfvName" runat="server"
ControlToValidate="txtCustomer" ForeColor="Red"
ToolTip="Please enter name" ValidationGroup="Validate" Display="Dynamic">* Required</asp:RequiredFieldValidator>
<asp:Button ID="btnSave" CssClass="btn btn-default" runat="server" Text="Save" ToolTip="Save Record" ValidationGroup="Validate" OnClick="btnSave_Click"/>
<asp:Button ID="btnClear" CssClass="btn btn-default" runat="server" Text="Clear" ToolTip="Clear / Refresh" OnClick="btnClear_Click" />
<asp:Button ID="btnClose" CssClass="btn btn-default" runat="server" Text="Close" ToolTip="Go To Main form." OnClick="btnCancle_Click" />

Try using jquery/javascript for validations.
Write button search and save click events in jquery and validate as you like.
$('#btnSave').click(function(){
//code for required field validation
});

The property of search and clear button ( causes Validation ) ..you should make it false ;)

How to ajaxify controls in Edit Form of RadGrid

I try to ajaxify RadNumericTextBoxs in Edit Form of Rad grid using (RadAjaxManager or RadAjaxManagerProxy) but i failed .
all i want to do is :
when text changed of (txt_CashAndEquivalents,txt_ShortTermInvestments) sum the values of both text boxes and set the result in txt_OneTotal without full postback .
<EditFormSettings EditFormType="Template">
<EditColumn UniqueName="EditCommandColumn1" FilterControlAltText="Filter EditCommandColumn1 column">
</EditColumn>
<FormTemplate>
<div class="FinancePositioncontainers">
<div class="FinancePosition-container" id="decorationZone">
<h4>Finance</h4>
<fieldset>
<legend>List</legend>
<div class="formRow" style="padding-right: 10px; padding-left: 10px;">
<h5>Bal</h5>
<label for="txt_CashAndEquivalents">bal1:</label>
<telerik:RadNumericTextBox ID="txt_CashAndEquivalents" runat="server" Text='<%# Eval("CashAndEquivalents")%>' Type="Number" DataType="System.Decimal" Width="160" NumberFormat-GroupSizes="3" AutoPostBack="True" TabIndex="1" OnTextChanged="txt_CashAndEquivalents_TextChanged"></telerik:RadNumericTextBox>
<div>
</div>
<label for="txt_ShortTermInvestments">bal2:</label>
<telerik:RadNumericTextBox ID="txt_ShortTermInvestments" runat="server" Text='<%# Eval("ShortTermInvestments")%>' Type="Number" DataType="System.Decimal" Width="160" NumberFormat-GroupSizes="3" TabIndex="2" AutoPostBack="True" OnTextChanged="txt_CashAndEquivalents_TextChanged"></telerik:RadNumericTextBox>
<div>
</div>
<hr />
<label for="txt_OneTotal">total :</label>
<telerik:RadNumericTextBox ID="txt_OneTotal" runat="server" ReadOnly="true" Type="Number" DataType="System.Decimal" Width="160" NumberFormat-GroupSizes="3"></telerik:RadNumericTextBox>
<div>
</div>
</div>
<asp:LinkButton ID="btnUpdate" runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'
ValidationGroup="Main" CssClass="btn btn-primary btn-xs white_cr"><span class="glyphicon glyphicon-floppy-disk"></span> <%# (Container is GridEditFormInsertItem) ? "Uppdate" %>
</asp:LinkButton>
<asp:LinkButton ID="btnCancel" runat="server" CausesValidation="False" CommandName="Cancel"
CssClass="btn btn-primary btn-xs white_cr"><span class="glyphicon glyphicon-ban-circle"></span>Cancel</asp:LinkButton>
<br />
<br />
</div>
</div>
</FormTemplate>
</EditFormSettings>

One approach you can consider is to utilise the client event, OnValueChanged of RadNumbericTextBox control, instead of the server side event.
For example,
<telerik:RadNumericTextBox ID="txt_CashAndEquivalents" runat="server" Text='<%# Eval("CashAndEquivalents")%>' Type="Number" DataType="System.Decimal" Width="160" NumberFormat-GroupSizes="3" TabIndex="1">
<ClientEvents OnValueChanged="DoSum" />
</telerik:RadNumericTextBox>
<script type="text/javascript">
function DoSum(sender, eventArgs)
{
var txt_ShortTermInvestments = $find('<%=txt_ShortTermInvestments.ClientID %>');
var txt_OneTotal = $find('<%=txt_ShortTermInvestments.ClientID %>');
var val_CashAndEquivalents = sender.get_value();
var val_ShortTermInvestments = txt_ShortTermInvestments.get_value();
txt_OneTotal.set_value(val_CashAndEquivalents + val_ShortTermInvestments);
}
</script>
Above code is just demonstrating the idea and hasn't been tested. So give it a go and see if it works for you or not.
For more details on the available client side events, please refer to the following link.
http://docs.telerik.com/devtools/aspnet-ajax/controls/numerictextbox/client-side-programming/radnumerictextbox-client-object#radnumerictextbox-client-object

Input Value set with javascript retrieve in codebehind

So I have a repeater that creates <li> elements. This is the codebehind for the OnItemDataBound
var categoryList = (ProductCategoryObject) e.Item.DataItem;
var category = ((HtmlAnchor) e.Item.FindControl("category"));
category.HRef = "javascript:void(0);";
category.InnerText = categoryList.Name;
category.Attributes.Add("onclick", "javascript:$('#ProductCategory').val('" + categoryList.Id + "');$('button.product-categories span').text('" + categoryList.Name + "');");
This sets the value of an input of type hidden and now my question is how do I get that value on button click? It appears to disappear on postback and I've tried Request["ProductCategory"] and Request.Form["ProductCategory"]
Here is the markup:
<div class="input-group margin-bottom-30">
<div id="divCategories" runat="server" class="input-group-btn">
<button type="button" class="btn blue dropdown-toggle product-categories" data-toggle ="dropdown">
<asp:Label runat="server" ID="lblCategory">All Categories</asp:Label> <i class="icon-angle-down"></i>
</button>
<ul runat="server" ID="ulCategory" class="dropdown-menu">
<asp:Repeater runat="server" id="rptCategories" OnItemDataBound="CategoriesOnItemDataBound">
<ItemTemplate>
<li>
<a runat="server" id="category"></a>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
<input id="ProductCategory" type="hidden" />
</div>
<asp:TextBox runat="server" ID="txtSearch" CssClass="form-control"></asp:TextBox>
<div class="input-group-btn">
<asp:LinkButton ID="btnFilter" runat="server" CausesValidation="True" ValidationGroup="BaseValidationGroup" CssClass="btn green" OnClick="SearchBtnOnClick"> Search <i class="icon-search"></i> </asp:LinkButton>
</div>
</div>

So I figured it out, I had to change my the markup for my input control from
<input id="ProductCategory" type="hidden" />
to
<input id="ProductCategory" name="ProductCategory" type="hidden" />
So, essentially, I was missing the name tag which is needed for Request.Form["ProductCategory"] to work.