Sunday, 20 April 2014

JQuery - Part II

Regular expression to validate phone number using jquery in asp.net

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function () {
$("#btnValidate").click(function () {
var phoneText = $("#txtPhone").val();
if ($.trim(phoneText).length == 0) {
alert("Please enter Phone Number");
return false;
}
if (validatePhone(phoneText)) {
alert('Valid Phone Number');
return true;
}
else {
alert('Invalid Phone Number');
return false;
}
});
});
function validatePhone(phoneText) {
var filter = /^[0-9-+]+$/;
if (filter.test(phoneText)) {
return true;
}
else {
return false;
}
}
</script>


<asp:TextBox ID="txtPhone" runat="server" />
<asp:Button ID="btnValidate" runat="server" Text="Validate" />


how to get-find ip address of client machine in asp.net using jquery

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#btnSubmit").click(function() {
$.getJSON("http://jsonip.appspot.com?callback=?",
function(data) {
alert("Your IP Address: " + data.ip);
})
.error(function() { alert("error"); })
});
});
</script>
<asp:button ID="btnSubmit" runat="server" Text="Get IP Address" />


JQuery disable right click on web page using asp.net

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(function() {
$(this).bind("contextmenu", function() {
return false
});
});
</script>


Disable right click on images using jquery in asp.net

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(function() {
$('img').bind("contextmenu", function() {
return false
});
});
</script>
<imgsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBoUlDbio8N25-Nfs7YSGd7Y8Z0rMg4nZtF3xbD2Q5P2YEjcwGg6vp7PhyphenhyphennnPPxMARK4MG-mf56RmykVa4JRI-GcivfwgQLEPHynsyzHmC3mwr-sm43aN1-mFGvDKnEX_U5MmJM05b85o/"alt="Aspdotnet-Suresh" />


how to get current datetime in jquery/JavaScript

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
var param1 = new Date();
var param2 = param1.getDate() + '/' + (param1.getMonth()+1) + '/' + param1.getFullYear() + ' ' + param1.getHours() + ':' + param1.getMinutes() + ':' + param1.getSeconds();
$('#lbltxt').text(param2)
})
</script>
<label id="lbltxt"/>

Get Current Datetime in JavaScript

<script type="text/javascript" language="javascript">
function GetDateTime()
{
var param1 = new Date();
var param2 = param1.getDate() + '/' + (param1.getMonth()+1) + '/' + param1.getFullYear() + ' ' + param1.getHours() + ':' + param1.getMinutes() + ':' + param1.getSeconds();
document.getElementById('lbltxt').innerHTML = param2;
}
</script>
<body onload="GetDateTime()">
<label id="lbltxt"/>


JQuery - How to Set Get Textbox Value using jQuery

// Get textbox value
$('#txtName').val()
// Set textbox value
$('#txtName').val("your message")
<input type="button" id="btnGet" value="Get Text" />


How to Add Fade In Effect to Webpage using JQuery in asp.net

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#fadediv').fadeIn(2000);
});
</script>
<div id="fadediv" style="display:none">



Best jquery password strength plugin Examples to show password strength


$(".password_adv").passStrength({
 shortPass:   "top_shortPass", //optional
 badPass:  "top_badPass",  //optional
 goodPass:  "top_goodPass",  //optional
 strongPass:  "top_strongPass", //optional
 baseStyle:  "top_testresult", //optional
 userid:   "user_id",  //required override
 messageloc:  0   //before == 0 or after == 1
});



Check Uncheck All Checkboxes in Gridview Using JQuery

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$('[id$=chkHeader]').click(function() {
$("[id$='chkChild']").attr('checked', this.checked);
});
});
</script>

or


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$('[id$=chkHeader]').click(function() {
$("[id$=chkChild]").attr('checked', this.checked);
});
$("[id$=chkChild]").click(function() {
if ($('[id$=chkChild]').length == $('[id$=chkChild]:checked').length)
{
$('[id$=chkHeader]').attr("checked", "checked");
}
else{
$('[id$=chkHeader]').removeAttr("checked");
}
});
});
</script>

or


// Header Checkbox click function
$('[id$=chkHeader]').click(function() {
if ($('[id$=chkHeader]:checked').length>0) {
$('[id$=chkChild]').parent().parent().addClass('highlightRow');
}
else {
$('[id$=chkChild]').parent().parent().removeClass('highlightRow');
}
$("[id$=chkChild]").attr('checked', this.checked);
});


// Child Checkbox click function
$("[id$=chkChild]").click(function() {
if(this.checked) {
$(this).parent().parent().addClass('highlightRow');
}
else {
$(this).parent().parent().removeClass('highlightRow');
}

if ($('[id$=chkChild]').length == $('[id$=chkChild]:checked').length) {
$('[id$=chkHeader]').attr("checked", "checked");
}
else {
$('[id$=chkHeader]').removeAttr("checked");
}

<style type="text/css">
.highlightRow
{
background-color:Green;
Color:White;
}
</style>



<div>
<asp:GridView ID="gvUserInfo" runat="server">
<HeaderStyle BackColor="#df5015" Font-Bold="true" ForeColor="White" />
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkHeader" runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkChild"  runat="server"/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>


protected void BindGridview()
{
SqlConnection con = new SqlConnection("Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB");
con.Open();
SqlCommand cmd = new SqlCommand("select TOP 10 UserName,LastName,Location from UserInformation", con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
gvUserInfo.DataSource = ds;
gvUserInfo.DataBind();
}



JQuery Validate RadioButtonList in Asp.Net Example

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('#btnSubmit').click(function() {
if ($('#rdbtnGender :radio:checked').length > 0) {
return true;
}
else {
alert('Please select Gender')
return false;
}
})
})

</script>


<asp:RadioButtonList ID="rdbtnGender" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Value="1" Text="Male" />
<asp:ListItem Value="2" Text="Female" />
</asp:RadioButtonList>
<asp:Button ID="btnSubmit" Text="Submit" runat="server" />


jQuery Validate CheckBoxList in Asp.Net Example

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('#btnSubmit').click(function() {
if ($('#chktech input:checked').length > 0) {
return true;
}
else {
alert('Please select atleast one technology')
return false;
}
})
});

</script>

<asp:CheckBoxList ID="chktech" runat="server" >
<asp:ListItem Value="1" Text="Asp.net" />
<asp:ListItem Value="2" Text="C#.NET" />
<asp:ListItem Value="3" Text="JQuery" />
<asp:ListItem Value="4" Text="JavaScript" />
<asp:ListItem Value="5" Text="SQL Server" />
</asp:CheckBoxList>
<asp:Button ID="btnSubmit" Text="Submit" runat="server" />



Validate DropdownList Using JQuery in Asp.Net

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('#btnSubmit').click(function() {
if ($("#ddlCountry").val()>0) {
return true;
}
else {
alert('Please select Country')
return false;
}
})
});
</script>


<asp:DropDownList ID="ddlCountry" runat="server">
<asp:ListItem Text="Select" Value="0" />
<asp:ListItem Text="Australia" Value="1" />
<asp:ListItem Text="India" Value="2" />
<asp:ListItem Text="England" Value="3" />
<asp:ListItem Text="USA" Value="4" />
<asp:ListItem Text="China" Value="5" />
</asp:DropDownList>
<asp:Button ID="btnSubmit" Text="Submit" runat="server" />


Posted by at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)