How to use JQuery in C# Project with example


         It’s very easy to integrate JQuery in your C# project. Let us learn it step by step in this tutorial with a clear example.

Step 1: 
       Download JQuery Library from https://jquery.com/download/ and copy the files to one of your project folders as below. I have added minified version of JQuery here, you can add the full version if you want.


 Step 2: 
         Add a Web Form to the website as below and name it as Home.aspx.


Step 3: 
        Add reference of JQuery file to Home.aspx as shown below.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>

Step 4: 
        Now create a separate JavaScript file, and add its reference to the Home.aspx, just as you did for JQuery library file, as below.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
    <script src="Scripts/Scripts.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>

Step 5: 
        To run your project, click on the “Debug” option at the top of the Visual Studio.


You can run the project in two different ways, one is with debugging, and the other is without debugging. If you want to run in the debugging mode, select “Start Debugging” option as shown above or hit F5.This option would allow you to debug the code by putting breakpoints. Or of you want to run in the non-debugging mode select “Start Without Debugging” option as shown above or hit Ctrl+F5.Both the options runs your project on ASP.NET server ,and opens the website in the default browser.

That’s it, now open the JavaScript file you created and start using the services that JQuery is offering.

Hope this tutorial helps you to better understand how to use JQuery in C# projects. 




Reactions:

0 comments :

Post a Comment