Hi Friends, in this I will explain about the JQuery.I search
in so many sites for the JQuery syntax and write the all the syntax in the
one program for the testing. I think it may useful to you.
JQuery:
jQuery is a JavaScript Library.
It simplifies the JavaScript programming.
jQuery is a lightweight
"write less, do more" JavaScript library.
It is a library of JavaScript
functions.
Adding the JQuery Library to Your Pages:
The jQuery library is
stored as a single JavaScript file, containing all the jQuery methods. It can
be added to a web page with the following mark-up:
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
|
Please paste the above <script> code in the head tag.
The following program shows the syntaxes of JQuery.
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default"
%>
<!DOCTYPE html
PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled
Page</title>
<script src="/JsFiles/jquery1.4.js" type="text/javascript"></script>
<script type = "text/javascript"
language ="javascript"
>
//
pageload event
$(document).ready(function() {
//onblur
event
$('#TextBox1').blur(function() { alert("haiiiiiiiiii1");
})
// onmouseover function
$('#Label1').mouseover(function() {
$('#divlabel').show();
})
//
onmouseout function
$('#Label1').mouseout(function() {
$('#divlabel').hide();
})
//for
tag name click
$('button').click(function() { alert("hai
iiii"); })
//
checkbox clicking
$('#CheckBox1').click(function() {
$('#display').toggle();
})
//
button clicking with id
$('#button1').click(function() {
//
retrieving textbox data
$textbox_data = $('#TextBox1').val();
//retrieveing
lable data
$lba_data = $('#Label1').html();
//assign
data to lable
$('#Label1').text("hello");
//retrieve
div data
$divdata = $('#display').html();
//assign
data to div
$('#display').text("hai this is for testing purpose 123");
//assign
data to textbox
$('#TextBox1').val("hellooooo");
//retrieveing
radiobutton value with groupname
$rbtcheck = $("[name='radiobutton1']:checked").val();
//div
hiding
$('#display').hide();
//div
showing
$('#display').show();
//retrieveing
dropdownlist value
$ddl1 = $('#dropdownlist1').val();
//assign
value to dropdownlist
$('#dropdownlist1').val("8");
//checking
a checkbox with id
$("#CheckBox2").attr('checked', 'checked');
//checking
wheather a checkbox is checked or not
if
($("#CheckBox2").attr('checked') == "true")
{ };
//checking
a radiobutton with id.
$('#RadioButton2').attr('checked', 'checked');
$a = 5;
$b = 10;
//for
printing data on the page
if
($a > $b) { $("body").html("<b>hai </b>"); }
//gridview
row count
$totalRows = $("#gvProducts tr").length;
alert($totalRows);
if
($totalRows > 0) {
//validating
for checking atleast one checkbox in gridview
if
(!$('#<%=gvProducts.ClientID%>
input[type="checkbox"]').is(':checked'))
{
alert("Please check at least one.");
return false;
}
//checking
all the checkboxes in the gridview
$("#<%=gvProducts.ClientID%>
input[id*='check1']:checkbox").attr('checked',
true);
alert("hai iiiiiiiiii");
//unchecking
all the checkboxes in the gridveiw
$("#<%=gvProducts.ClientID%>
input[id*='check1']:checkbox").attr('checked',
false);
}
//spliting
the string into array
$element = "hai this is for testing";
$arr1 = $element.split(" ");
alert($arr1[0]);
//for
radiobuttonlist checking.
$('.rbl').each(function() {
var
checked = $(this).find('input:radio:checked');
if
(checked.length == 0) {
alert("pls select atleast one radio button");
return;
}
else
{
if
(checked.val() == 1) { alert("checked 1");
}
if (checked.val() == 2) { alert("checked 2"); }
if (checked.val() == 3) { alert("checked 3"); }
}
});
//calling
ajax page
$.ajax({
url: "send.aspx",
type: "POST",
data: l,
success: function(a) { if (a
== "success") { } else { } },
error: function(a) { if (a
== "error") { } else { } }
})
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Text="rojalabel-roja"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<input type ="button" id='button1' runat = "server"
value = "button" />
<asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>
<asp:RadioButton ID ="RadioButton1" runat
= "server"
Value = "4"
GroupName =
"radiobutton1" />
<asp:RadioButton ID ="RadioButton2" runat
= "server"
Value = "5" GroupName
= "radiobutton1"
/>
<asp:RadioButton ID ="RadioButton3" runat
= "server"
Value = "6" GroupName
= "radiobutton1"
/>
<asp:DropDownList ID = "dropdownlist1"
runat = "server" >
<asp:ListItem value= "7">ddl1</asp:ListItem>
<asp:ListItem value= "8">ddl2</asp:ListItem>
</asp:DropDownList>
<asp:RadioButtonList ID="RadioButtonList1" class = "rbl" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Text = "sum1" Value = "1"></asp:ListItem>
<asp:ListItem Text = "sum3" Value = "3"></asp:ListItem>
<asp:ListItem Text = "sum2" Value = "2"></asp:ListItem>
</asp:RadioButtonList>
<asp:CheckBox ID="CheckBox1" runat="server" />
<asp:CheckBox ID="CheckBox2" runat="server" />
<div id ="display" >
hai this is for testing purpose
</div>
<button>hai</button>
<asp:GridView ID = "gvProducts"
runat = "server" AutoGenerateColumns="False" >
<Columns>
<asp:TemplateField HeaderText
= "check">
<ItemTemplate>
<asp:CheckBox ID = "check1"
runat ="server"
/>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText
= "userid">
<ItemTemplate>
<asp:Label ID = "label1"
runat = "server" Text
= '<%#
Eval("user_id") %>' ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<div id = 'divlabel' style = "display:none ;"> mouse pointer on
label</div>
</div>
</form>
</body>
</html>
|
If you like my
blog or articles, you can appreciate by leaving your comments or Liking my
Facebook page Aspdotnet-kishore, following on Google+ Aspdotnet-Kishore, Twitter on AspdotnetKishore, Linked in Aspdotnet-Kishore, stumbling my posts on stumble upon and subscribing on RSSfeed Aspdotnet-Kishore for free updates directly to your Email
inbox . Watch my blog for more articles."
No comments:
Post a Comment