We Keep Coding

How to bypass Asp.net control validation only for few control on button click?

I have an ASP.NET form that takes input from a user. There is a Save & Add button on the form to perform different functionalities. 
The problem I'm having is that on the form I have a set of  validators and when the Add button is pressed the form gets validated. There are 5 controls on the page but during Add button click , I need to validate only two controls. Only during Save button click, I should validate all controls.
How to ignore those 3 control validation during Add button click.
Any way around this?

To skip some of the validations I suppose you might want to use ValidatorEnable method in jquery to enable/disable. Something like this:
Email:
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="valEmail" ControlToValidate="txtEmail" runat="server"
ErrorMessage="*Required" ForeColor="Red" ValidationGroup="Group2" />
<br />
Enable Validation:
<input type="checkbox" id="CheckBox2 checked="checked" />
<br />
<asp:Button Text="Submit" runat="server" ValidationGroup="Group2" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).on("click", "#CheckBox2", function () {
var valEmail = $("[id*=valEmail]");
ValidatorEnable(valEmail[0], $(this).is(":checked"));
});
</script>
Here is the live Demo in case you want to test it before heading towards its implementation: https://www.aspsnippets.com/demos/642/
EDIT
To achieve this task using pure javascript and not jquery you can do something like this:
ValidatorEnable(document.getElementById('<%=yourValidator.ClientID%>'), false);

How to track asp:button click with Google Tag Manager

Let's say I've got an asp:button on a website which I'm trying to track to count how many times it has been clicked by different users.
<asp:Button ID="SubBtn" runat="server" OnClick="Button1_Click" runat="server" Text="Sub" />
In my code behind I've got a redirect link to a different page.
I'm aware that I need to include something like
<a href="#" name="button1" onclick="dataLayer.push({'event': 'button1-click'});" >Button 1</a>
Do I need to convert my asp:button to a html button to make this work?

You need to use attribute "OnClientClick":
<asp:Button ID="SubBtn" runat="server" OnClick="Button1_Click" runat="server" Text="Sub" OnClientClick="dataLayer.push({'event': 'button1-click'});" />
You can read more about this attribute on MSDN: https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.onclientclick(v=vs.110).aspx

C#, ASP.NET / Tutorial /Different Button

I was following this tutorial:
http://www.hongkiat.com/blog/css3-on-off-button/
I would like everything the same except I would like to change:
<section>
<a rel="external" href="#button" id="button"></a>
<span></span>
</section>
to:
<section>
<asp:Button CssClass="button" id="Button3" runat="server" OnClick="Button3_Click" Text=""\uf011;"" />
<span></span>
</section>
Because of simpler adding buttons and then programming them. Everything works OK, just when I click the button it doesn't become white and the red dot doesn't become green, I guess it's because in the tutorial is button used like a link, and if I add it with visual studio it's not a link, what could I do that i woul style the button like that even if I add it with visual studio.

If you want to have a hyperlink you should use LinkButton element. Button component shows a button element. LinkButton is rendered as a hyperlink with some extra properties.
<asp:LinkButton CssClass="button" id="Button3" runat="server" OnClick="Button3_Click" Text=""\uf011;"" />
Also you can try the following code in order to have code-behind capabilities for a stanrdard a tag.
<section>
<a rel="external" href="#button" id="button" runat="server"></a>
<span></span>
</section>
Another option is using HyperLink component
<section>
<asp:HyperLink Text="" rel="external" href="#button" id="button" runat="server"></asp:HyperLink>
<span></span>
</section>
You should pay attention to anchor's id attribute. I mean, The id attributes are prepended with MainContent_ if you have not set it to be shown only with the value you gave.
There are two options for this:
Change jQuery's selector from $('#button') to $('#MainContent_button')
Change .NET settings for showing your elements without prepending MainContent_ prefix.

Clear button should not required field HTML5

im creating the form include below code :
<asp:TextBox ID="txtPhone" required="required" runat="server" placeholder="Phone No. (eg. 999)"
CssClass="glowStyle"></asp:TextBox>
<br />
<asp:Button ID="btnAddDriver" Text="Add" runat="server" CssClass="button" />
<br />
<asp:Button ID="btnCnclAddDriver" Text="Clear" runat="server"
CssClass="cancelbutton" onclick="btnCnclAddDriver_Click" />
</form>
when i click the "Clear" button, the required (html5) still show up.
how to disable it for Clear button only.

Add formnovalidate attribute to your cancel/clear button.
Here you can find some more information about this attribute.

Do you actually require a server control to cancel ? A simple <input type="reset"> or a small javascript code can do the job in most situations.
If not, simple add CauseValidation="false" to your button :
<asp:Button ID="btnCnclAddDriver" CauseValidation="false" Text="Clear" runat="server"
CssClass="cancelbutton" onclick="btnCnclAddDriver_Click" />
(remove suggestion as it applies to asp.net validation)

You can set the autopostback option for btnCnclAddDriver button to False. And execute your server side code (btnCnclAddDriver_Click) by Ajax.

You can clear your TextBox(s) with javascript (jQuery) :
$('txtPhone').val('');
Or Javascript :
function name()
{
document.getElementById('txtPhone').value = "";
}
Hope this help.

Scroll down to the specific part of page when a linkbutton is clicked using MaintainScrollPositionOnPostBack

I have a lengthy asp.net page. An HTML table in the page has a link with <a>. when the link is clicked the page shows the textbox using javascript and takes me to the top part of the page. Instead, i want to see the part of the page that has the link and textbox. It should automatically scroll down to that part once the page refreshes. How is that possible?
I have tried using Linkbutton instead of but have issues with javascript.
Here is the code.
<script type="text/javascript">
$(document).ready(
function()
{
$("#aChangeDefault").click
(
function()
{
alert('hi');
//$("#<%=trChangeLoc.ClientID %>").fadeIn(1000);
$("#<%=rowChangeLoc.ClientID %>").fadeIn(1000);
}
)
$("#btnClose").click
(
function()
{
$("#<%=rowChangeLoc.ClientID %>").fadeOut(1000);
if(document.getElementById("<%=divSearchResult.ClientID %>").style.display != "none")
{
$("#<%=divSearchResult.ClientID %>").fadeOut(1000);
}
//$("#<%=trChangeLoc.ClientID %>").fadeOut(10);
}
)
}
);
The Linkbutton is here :
<asp:LinkButton id="aChangeDefault" runat="server" style="font-size: 12px;font-family:Arial;vertical-align:bottom;" ToolTip = "Click here to set your town as default location" Text ="Change Location" > </asp:LinkButton>
And the portion that shows up when the link is clicked is here:
<input id="btnClose" type="button" class="closeButton2" language="javascript" onclick="return btnClose_onclick()" />
<div style="display: inline-block;">
<span class="searchheadder" style="color: #000000; padding-right: 8px; padding-top: 4px;">
LOCATION: </span>
<asp:TextBox ID="txtChangedLocation" onkeyup="doCapitalize();" runat="server" Height="19px"
Width="200px" CssClass="textBox" Style="margin-right: 10px;"></asp:TextBox>
<cc1:AutoCompleteExtender ID="ACE1" runat="server" TargetControlID="txtChangedLocation" ServicePath="../AutoComplete.asmx" ServiceMethod="GetCompletionList" MinimumPrefixLength="2" CompletionSetCount="10" EnableCaching="true" CompletionInterval="0" ></cc1:AutoCompleteExtender>
<asp:Button ID="btnGetNewList" BorderWidth="0" CssClass="searchButton" runat="server" OnClick="btnGetNewList_Click" /> </div>
Appreciate all your help. Thank you!

MaintainScrollPositionOnPostBack only affects the position of the page in your browser when a PostBack occurs, and if you're using JavaScript you don't want a PostBack to happen. If you're doing everything in JavaScript, it sounds like the problem is that when you click a link, the browser's default behavior is to follow the link, even if it's to a location on the same page. In some browsers, for the click event to register on an <a> tag, the href property must have a value, so it's common practice to use a blank anchor name as the href:
<a onClick="MyJavaScriptFunction()" href="#">Click here</a>
What this is actually telling the browser to do is to call your function MyJavaScriptFunction() and unless that function evaluates to false, it will then follow the anchor to the top of the page, which is where href="#" takes you. You can either finish your onClick with return false; or else change your JavaScript function to always return false, either way it will keep the browser from following the link:
<a onClick="MyJavaScriptFunction();return false;" href="#">Click here</a>

I'm not sure I understand what you're trying to do, but if the page is reloading perhaps you can use a named anchor to have the browser go to the section of the page you want automatically.