Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Advanced Search Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying ASP.NET jQuery Cookbook (Second Edition)
  • Table Of Contents Toc
  • Feedback & Rating feedback
ASP.NET jQuery Cookbook (Second Edition)

ASP.NET jQuery Cookbook (Second Edition) - Second Edition

By : Sonal Merchant, Aneel Allana
3.5 (2)
Buy this Book
close
close
ASP.NET jQuery Cookbook (Second Edition)

ASP.NET jQuery Cookbook (Second Edition)

3.5 (2)
By: Sonal Merchant, Aneel Allana
Buy this Book

Overview of this book

jQuery is a lightweight JavaScript library that has changed the landscape of client scripting in web applications. Developed by John Resig in 2006, it has taken the web by storm because of its cross-browser compatibility and the ability to get more done with less code. It has gained popularity with ASP.NET developers and is now distributed with Visual Studio and the NuGet package manager. ASP.NET jQuery Cookbook explores the wide range of utilities that the jQuery library provides. It teaches you the nitty-gritty of plugging in these features in ASP.NET web applications. It covers every aspect of interfacing the library, right from downloading and including jQuery on web pages to selecting controls, handling events, and creating animations. This book also walks you through DOM traversal and manipulation in ASP.NET and then through visual effects and graphics in ASP.NET sites. It explores advanced features such as posting AJAX requests and writing plugins. It will provide you with all the information you need to use this library confidently with ASP.NET.
Table of Contents (10 chapters)
close
close
close
Preface
Icon
Preface
Icon
What this book covers
Icon
What you need for this book
Icon
Who this book is for
Icon
Sections
Icon
Conventions
Icon
Reader feedback
Icon
Customer support
Lock Free Chapter
1
1. Getting Started with jQuery in ASP.NET
chevron up
Icon
1. Getting Started with jQuery in ASP.NET
Icon
Introduction
Icon
Downloading jQuery from jQuery.com
Icon
Understanding CDN for jQuery
Icon
Using NuGet Package Manager to download jQuery
Icon
Adding jQuery to an empty ASP.NET web project using a script block
Icon
Adding jQuery to an empty ASP.NET web project using ScriptManager control
Icon
Adding jQuery to an ASP.NET Master Page
Icon
Adding jQuery programmatically to a web form
Icon
Understanding jQuery reference in the default web application template
Icon
Hello World in a web project using jQuery
Icon
Bundling jQuery in ASP.NET MVC
Icon
Using CDN to load jQuery in MVC
Icon
Hello World in ASP.NET MVC using jQuery
Icon
Debugging jQuery code in Visual Studio
2
2. Using jQuery Selectors with ASP.NET Controls
Icon
2. Using jQuery Selectors with ASP.NET Controls
Icon
Introduction
Icon
Selecting a control using ID and displaying its value
Icon
Selecting a control using the CSS class
Icon
Selecting a control using HTML tag
Icon
Selecting a control by its attribute
Icon
Selecting an element by its position in the DOM
Icon
Enabling/disabling controls on a web form
Icon
Using selectors in MVC applications
3
3. Event Handling Using jQuery
Icon
3. Event Handling Using jQuery
Icon
Introduction
Icon
Responding to mouse events
Icon
Responding to keyboard events
Icon
Responding to form events
Icon
Using event delegation to attach events to future controls
Icon
Running an event only once
Icon
Triggering an event programmatically
Icon
Passing data with events and using event namespacing
Icon
Detaching events
4
4. DOM Traversal and Manipulation in ASP.NET
Icon
4. DOM Traversal and Manipulation in ASP.NET
Icon
Introduction
Icon
Adding/removing DOM elements
Icon
Accessing parent and child controls
Icon
Accessing sibling controls
Icon
Refining selection using a filter
Icon
Adding items to controls at runtime
5
5. Visual Effects in ASP.NET Sites
Icon
5. Visual Effects in ASP.NET Sites
Icon
Introduction
Icon
Animating the Menu control
Icon
Animating a Label control to create a digital clock
Icon
Animating the alt text of the AdRotator control
Icon
Animating images in the TreeView control
Icon
Creating scrolling text in a Panel control
Icon
Creating a vertical accordion menu using Panel controls
Icon
Showing/hiding the GridView control with the explode effect
6
6. Working with Graphics in ASP.NET Sites
Icon
6. Working with Graphics in ASP.NET Sites
Icon
Introduction
Icon
Creating a spotlight effect on images
Icon
Zooming images on mouseover
Icon
Creating an image scroller
Icon
Building a photo gallery using z-index property
Icon
Building a photo gallery using ImageMap control
Icon
Using images to create effects in the Menu control
Icon
Creating a 5 star rating control
Icon
Previewing image uploads in MVC
7
7. Ajax Using jQuery
Icon
7. Ajax Using jQuery
Icon
Introduction
Icon
Setting up Ajax with ASP.NET using jQuery
Icon
Consuming page methods
Icon
Consuming Web services
Icon
Consuming WCF services
Icon
Retrieving data from a Web API
Icon
Making Ajax calls to a controller action
Icon
Making Ajax calls to a HTTP handler
8
8. Creating and Using jQuery Plugins
Icon
8. Creating and Using jQuery Plugins
Icon
Introduction
Icon
Creating and using a simple plugin
Icon
Using the $ alias in the plugin
Icon
Calling methods on DOM elements
Icon
Providing default values
Icon
Providing method chaining
Icon
Adding actions to plugins
Icon
Using the form validation plugin
Icon
Downloading plugins using the NPM
9
Index
Icon
Index

Hello World in a web project using jQuery

Until now, all recipes have demonstrated different ways to add the jQuery library to web pages. This is the first step in making the page jQuery-ready. In this recipe, let's move on to the next step: writing the jQuery code inside a script block to manipulate controls in a web form. We will display a simple Hello World message on the web page by manipulating a Label control on a web form.

Getting ready

  1. Create a Web Application project by going to File | New | Project | ASP.NET Web Application. Select the Empty template. Name the project HelloWorld (or any other suitable name).
  2. Add a new Web Form to the project.
  3. Add the jQuery library files to the Scripts folder.
  4. Add a reference to the jQuery library on the web form using any method of your choice.
  5. Open the web form in the Design mode and drag and drop a Label control by navigating to the Toolbox | Standard controls. Change the properties of the Label control as follows:
    <asp:Label ID="lblMessage" runat="server" Text=""></asp:Label>

How to do it…

If a jQuery reference is added to the <head> element, then include the following <script> block in the <head> element. Otherwise, include the <form> element, preferably before the <form> tag is closed:

<script type="text/javascript">
   $(document).ready(function () {
      var fontStyle = "Arial";
      var fontSize = 28;
      $("#<%=lblMessage.ClientID%>").css("font-family", fontStyle);
      $("#<%=lblMessage.ClientID%>").css("font-size", fontSize);
      $("#<%=lblMessage.ClientID%>").text("Hello World!!");
});
</script>

How it works…

Following are the steps to print Hello World!! in a web project using jQuery:

  1. In the preceding jQuery code, the $ symbol is used to instantiate the jQuery object.
  2. The .ready() function is triggered when the DOM is ready. It is commonly used to execute the required jQuery code on the page.
  3. The Label control can be accessed from the jQuery code using ASP.NET's ClientID property and jQuery's #identifier selector.
  4. Using the .css() property of the jQuery object, the font style, size, and text of the Label control are manipulated so that the following output is displayed on running the application:
    How it works…

See also

The Hello World in ASP.NET MVC using jQuery recipe

Visually different images
CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
ASP.NET jQuery Cookbook (Second Edition)
End of Section 1
Next Section
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon