Book Image

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

By : Sonal Merchant, Sonal Aneel Allana
Book Image

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

By: Sonal Merchant, Sonal Aneel Allana

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.

Related Content you might be interested in

Current Title:

Small book image
ASP.NET jQuery Cookbook (Second Edition) - Second Edition
Sonal Merchant | Sonal Aneel Allana
Feb, 2016 | 478 pages
No titles found
Table of Contents (15 chapters)
ASP.NET jQuery Cookbook Second Edition
ASP.NET jQuery Cookbook Second Edition
Credits
Credits
About the Author
About the Author
About the Reviewer
About the Reviewer
www.PacktPub.com
www.PacktPub.com
Preface
Preface
Free Chapter
1
Getting Started with jQuery in ASP.NET
Getting Started with jQuery in ASP.NET
Introduction
Downloading jQuery from jQuery.com
Understanding CDN for jQuery
Using NuGet Package Manager to download jQuery
Adding jQuery to an empty ASP.NET web project using a script block
Adding jQuery to an empty ASP.NET web project using ScriptManager control
Adding jQuery to an ASP.NET Master Page
Adding jQuery programmatically to a web form
Understanding jQuery reference in the default web application template
Hello World in a web project using jQuery
Bundling jQuery in ASP.NET MVC
Using CDN to load jQuery in MVC
Hello World in ASP.NET MVC using jQuery
Debugging jQuery code in Visual Studio
2
Using jQuery Selectors with ASP.NET Controls
Using jQuery Selectors with ASP.NET Controls
Introduction
Selecting a control using ID and displaying its value
Selecting a control using the CSS class
Selecting a control using HTML tag
Selecting a control by its attribute
Selecting an element by its position in the DOM
Enabling/disabling controls on a web form
Using selectors in MVC applications
3
Event Handling Using jQuery
Event Handling Using jQuery
Introduction
Responding to mouse events
Responding to keyboard events
Responding to form events
Using event delegation to attach events to future controls
Running an event only once
Triggering an event programmatically
Passing data with events and using event namespacing
Detaching events
4
DOM Traversal and Manipulation in ASP.NET
DOM Traversal and Manipulation in ASP.NET
Introduction
Adding/removing DOM elements
Accessing parent and child controls
Accessing sibling controls
Refining selection using a filter
Adding items to controls at runtime
5
Visual Effects in ASP.NET Sites
Visual Effects in ASP.NET Sites
Introduction
Animating the Menu control
Animating a Label control to create a digital clock
Animating the alt text of the AdRotator control
Animating images in the TreeView control
Creating scrolling text in a Panel control
Creating a vertical accordion menu using Panel controls
Showing/hiding the GridView control with the explode effect
6
Working with Graphics in ASP.NET Sites
Working with Graphics in ASP.NET Sites
Introduction
Creating a spotlight effect on images
Zooming images on mouseover
Creating an image scroller
Building a photo gallery using z-index property
Building a photo gallery using ImageMap control
Using images to create effects in the Menu control
Creating a 5 star rating control
Previewing image uploads in MVC
7
Ajax Using jQuery
Ajax Using jQuery
Introduction
Setting up Ajax with ASP.NET using jQuery
Consuming page methods
Consuming Web services
Consuming WCF services
Retrieving data from a Web API
Making Ajax calls to a controller action
Making Ajax calls to a HTTP handler
8
Creating and Using jQuery Plugins
Creating and Using jQuery Plugins
Introduction
Creating and using a simple plugin
Using the $ alias in the plugin
Calling methods on DOM elements
Providing default values
Providing method chaining
Adding actions to plugins
Using the form validation plugin
Downloading plugins using the NPM
Index
Index

Using NuGet Package Manager to download jQuery

NuGet is a package manager available with Visual Studio. It simplifies the process of installing and upgrading packages. This recipe demonstrates the use of NuGet to download the jQuery library.

Getting ready

To launch NuGet for a particular project, go to Tools | NuGet Package Manager | Manage NuGet Packages for Solution... as shown in the following screenshot:

Alternatively, right-click on the project in the Solution Explorer tab, and select Manage NuGet Packages.

How to do it…

Perform the following steps to download jQuery using NuGet Manager:

  1. In the NuGet Package Manager, as shown in the following screenshot, select the jQuery package from the left-hand side panel. In the right-hand side panel, select the Version that you would like to use in your web project from the drop-down menu. Click on the Install button:

    Tip

    Searching for packages in NuGet

    If jQuery is not visible in the left-hand side panel, you need to search for it by keying in jQuery in the search box in the top left corner of the NuGet Manager screen.

  2. Click on OK when prompted for confirmation in order to make the required changes to the solution.

How it works…

The NuGet Package Manager downloads the selected version of jQuery in the Scripts folder. Any other version existing in the Scripts folder is deleted. The Scripts folder will look like the following screenshot:

The files downloaded by NuGet are as follows (the version numbers may change in the future):

  • The Intellisense file: jquery-2.1.4.intellisense.js

  • The debug version : jquery-2.1.4.js

  • The release version: jquery-2.1.4.min.js

  • The map file: jquery-2.1.4.min.map

See also

The Downloading jQuery from jQuery.com recipe

Previous Section
End of Section 5
Next Section