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

Adding jQuery to an empty ASP.NET web project using a script block

To create ASP.NET 4 .6 Web Applications, Visual Studio provides various ready templates such as Empty, Web Forms, MVC, Web API, and so on. This recipe will use the Empty template, which provides the developer with an empty project structure that consists of only the web.config file.

Tip

Downloading the example code

You can download the example code files for this book from your account at http://www.packtpub.com. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.

Getting ready

Following are the steps to create a project by using Empty template:

  1. Create a new project in Visual Studio by going to File | New | Project..., as shown in the following screenshot:
    Getting ready

    Tip

    Website or web project?

    Instead of creating a new project, you can also create a new website. Unlike a project, a website does not contain a collective project file to track individual files in the application. To create a website, go to File | New | Web Site.... This will launch the New Website dialog box with the list of available templates. Select the ASP.NET Empty WebSite template.

  2. This will launch the New Project dialog box, as shown in the following screenshot. From the left-hand side panel, select your desired programming language, Visual C# or Visual Basic, and then, select ASP.NET Web Application from the middle panel:

    Getting ready

  3. Enter WebApplication1 (or any suitable name) in the Name field. Click on the Browse button to go to the desired Location where you would like to save the application. Click on OK.
  4. This will launch the Select a template dialog box, as shown in the following screenshot:
    Getting ready
  5. From ASP.NET 4.6 Templates, select Empty, and click on OK. Visual Studio will create an empty project in the Solution Explorer tab, as shown in the following screenshot:
    Getting ready

Note

In the remaining recipes, when asked to create a Web Application project using the Empty template, follow the steps listed in this section.

How to do it…

Following are the steps to include jQuery using script block:

  1. JavaScript files are usually placed in a folder named Scripts in the web application. So, in the Solution Explorer tab, right-click on the project and go to Add | New Folder from the menu:
    How to do it…
  2. Rename the folder to Scripts. Now, right-click on the Scripts folder, and go to Add | Existing Item... as shown in the following screenshot:
    How to do it…
  3. Now, browse to the location where you have saved the downloaded copy of the jQuery files (refer to the Downloading jQuery from jQuery.com recipe), and click on OK. It is recommended that you add both the uncompressed and compressed versions. The Scripts folder will be updated, as shown in the following screenshot:
    How to do it…
  4. Next, create a new web form in the project by right-clicking on the project and navigating to Add | New Item.... From the dialog box, select Web Form, and enter a suitable name for the web form, such as Default.aspx:
    How to do it…
  5. To use jQuery on the web form, simply drag and drop the required jQuery file, that is, uncompressed or compressed on the web form. Or alternatively, include the following <script> tag in the <head> element:

    For development mode, the code is as follows:

    <script src="Scripts/jquery-2.1.4.js"></script>

    For release mode, the code is as follows:

    <script src="Scripts/jquery-2.1.4.min.js"></script>
    How to do it…

See also

The Downloading jQuery from jQuery.com 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