ASP.NET jQuery Cookbook

ASP.NET jQuery Cookbook

By : Sonal Aneel Allana

Buy this Book

ASP.NET jQuery Cookbook

By: Sonal Aneel Allana

Buy this Book

Overview of this book

jQuery is a powerful, lightweight JavaScript library that simplifies various web development tasks. With the integration of jQuery with Visual Studio 2010, it has become increasingly popular for ASP.NET developers to use jQuery's awesome power in their applications. Combining jQuery and ASP.NET creates applications that are anything but lightweight. Using this Cookbook you will become adept at using this library in your ASP.NET web applications. This cookbook shares the most powerful, impressive, and just plain handy jQuery secrets for ASP.NET developers. From substitute server-side code to corresponding client script, it shows ASP.NET developers how to get the most from jQuery in a simple, effective, and easy manner. The cookbook takes a pragmatic approach in applying the jQuery library to ASP.NET applications. It will help you to master the use of jQuery with ASP.NET by taking you step-by-step through hands-on, practical recipes. With its help, you can learn to manipulate various ASP.NET controls like TextBox, CheckBoxList, DropDownList, BulletedList, Hyperlink, Image, and GridView as well as custom user controls. The book teaches client validation techniques thus providing a substitute for the server-side Validation Control. It explores various graphic and animation effects that can be accomplished very easily with the library to give a better interactive experience to the end user. It explores AJAX in depth and describes the use of Firebug to view / troubleshoot the corresponding request / response dialog. You will also learn to develop rich content using client scripting.

ASP.NET jQuery Cookbook

Credits

About the Author

About the Reviewers

www.PacktPub.com

Preface

Free Chapter

Working with ASP.NET Controls

Introduction

Creating default text for TextBoxes

Auto focus on the first TextBox and tab on the Enter key

Disallowing cut/copy/paste operations on a TextBox

Highlighting text in a TextBox and copying to the clipboard

Displaying selected items of a CheckBoxList

Selecting/deselecting all items in CheckBoxList

Getting selected text and value from DropDownList

Appending items at runtime to a DropDownList

Creating 'Back to Top' ASP.NET hyperlink

Updating URL of ASP.NET hyperlink at runtime

Validation of ASP.NET Controls

Introduction

Getting started

Validation of a sample user login form

Validation of basic field types in a user profile form

Character limit validation in Multiline ASP.NET TextBox

Validation of date range in ASP.NET Form

Validation of ASP.NET CheckBoxList

Validation of ASP.NET RadioButtonList

Validation of ASP.NET ListBox Control

Validation of ASP.NET DropDownList Control

Working with GridView Control

Introduction

Highlighting rows/cells of a GridView on hover

Removing GridView rows/cells on click

Removing a GridView column on clicking the header

Dragging and dropping GridView rows

Changing cursor style for selective rows of a GridView

Formatting a GridView and applying animation effect

Retrieving the content of a GridView cell on click

Working with Image Control

Introduction

Adding/removing hyperlinks on images

Displaying image captions

Changing image opacity on mouseover

Viewing enlarged images on mouseover on thumbnail

Swapping images on a page

Cropping images on a page

Creating an image gallery viewer

Zooming images on mouseover

Animations in ASP.NET

Introduction

Enlarging text on hover

Creating a fade effect on hover

Sliding elements on a page

Preventing animation queue buildup

Animating a panel

Chaining animations together

Hiding and displaying panels

Creating disappearing effect

AJAX and ASP.NET (Part I)

Introduction

Setting up AJAX with ASP.NET using jQuery

Using Firebug to view AJAX request/response

Consuming page methods with AJAX

Consuming web services with AJAX

Populating ASP.NET DropDownList using AJAX

Creating an auto complete search box

AJAX and ASP.NET (Part II)

Introduction

Displaying a progress indicator during AJAX calls

Reading XML data with AJAX

Catching and displaying AJAX errors

Using AJAX to load scripts in web pages

Cross site AJAX querying using jQuery

Using complex data types with AJAX

Client Templating in jQuery

Introduction

Using jQuery Templates to display data

Displaying arrays using nested templates

Calling JavaScript functions and conditional statements in templates

Creating an ASP.NET CheckBoxList in templates

Using templates to format data returned from web services

Using callback functions with jQuery templates

Calling external templates using jQuery

Index

Customer Reviews

5 star

4 star

3 star

2 star

1 star

Cropping images on a page

jQuery comes with a number of handy plugins to enhance the functionality of web controls. For applications requiring image cropping, a plugin called JCrop can be used with the Image control. In this recipe, we will use this plugin to crop images and display the co-ordinates of the crop area.

Getting ready

Add a new web form Recipe6.aspx to the current project.
Download the JCrop plugin from http://deepliquid.com/content/Jcrop.html.
Save the jquery.Jcrop.js file to the local js folder. Save the stylesheet file jQuery.Jcrop.css to the stylesheet folder css:

Add both the files we just saw to the page along with the jQuery library:

<link href="css/jquery.Jcrop.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="js/jquery.Jcrop.js" type="text/javascript"></script>

Add the following css class for the image:

.image
    {
      position:relative;
      width: 400px;
 ...

ASP.NET jQuery Cookbook

By : Sonal Aneel Allana

ASP.NET jQuery Cookbook

By: Sonal Aneel Allana

Overview of this book

Related Content you might be interested in

Current Title:

ASP.NET jQuery Cookbook

Cropping images on a page

Getting ready