Introduction The JQuery is most popular word in this days in web development. Acutlly this is open source JAVA Script libaray. The advantage in JQuery , first is light weight size of the linaray file just 56KB in unzip format. You can download latest JQuery file from JQuery official web site http://jquery.com/. Next we need access JQuery script in our asp.net web project. To this we can add script file to project in different ways 1. Copy the file and paste on your project. 2.Right click on your porject and then select add existing item menu then point to that file , finaly click OK button to add in your project. Now we have script within project, but we can't access the method or property within the code. to this we need ad the script like followings ways HTML Code 1. Select Jquery Script file, then drag and drop to the Web page Head. {codecitation class="brush: html; gutter: true;" width="650px"} <head runat="server"> <title></title> <script type="text/javascript" src="Scripts/jquery-1.3.2.min.js"> </script> </head>
{/codecitation} 2. You we can add using server side code with RegisterClientscriptInclude method. {codecitation class="brush: c#; gutter: true;" width="650px"} protected override void OnPreRender(EventArgs e) {
ClientScript.RegisterClientScriptInclude("jQuery", "http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"); base.OnPreRender(e); } {/codecitation} Now we have JQuery library in our page. Then start to play with Jquery in your page.
Implementation First we need to welcome JQuery to the ASP.NET web application
{codecitation class="brush: html; gutter: true;" width="650px"} <form id="form1" runat="server"> <div id="Test"> <input id="Button1" type="button" onclick="javascript:Welcome();" value="button" /> </div> <div id="Welcome"> </div> </form>
<script language="javascript" type="text/javascript">
function Welcome() { $("#Welcome").append('Welcome To QJuery'); } </script> {/codecitation}
Look at above line. It is new to ones who are learning JQuery. $ is the symbol to access JQuery peroperties, method and etc.
Note:$ is imporant in Jquery and simply we can say that is the Jquery entry point.
What I have done in above line was, try to find the Div element which ID equal to "Welcome" then append welcome message to the element. You can understand how simple it is. One more thing is new here "#", before dev ID; this is for access the div only. Here more details and keywords to access elements and set CSS to html elements.http://docs.jquery.com/Main_Page Conclusion This tutorial focused on how to Incorporate JQuery in ASP.NET. Next article will explain how to set CSS control using JQuery in asp.net.
Thank you
| About the Author |
 | | RRaveen(Bsc,MCTS,MCPD,MCP) | - B.Sc. degree in Computer Science. - 4+ years experience in Visual C#.net and VB.net - Obsessed in OOP style design and programming. - Designing and developing Network security tools. - Designing and developing a client/server application for sharing files among users in a way other than FTP protocol. - Designing and implementing GSM gateway applications and bulk messaging. - Windows Mobile and Symbian Programming - Having knowledge with ERP solutions The summary of my skills: C#, VB.Net#,ASP.net, VC++, Java, WPF,WCF, Oracle, SQL Server, MS Access, Windows NT administration Occupation: Tech Lead Company: TGS Solutions
|
|
|