Contents tagged with jQuery
-
Hide Web Form contents until the page is fully loaded
If your web forms consist of small amount of content they render quickly in the browser and user can start working with them almost immediately. However, when your web forms are bulky and render too much of content, the page is loaded in the browser slowly. Users can start using the partially loaded page and perform actions such as clicking on links or buttons. At times this is undesirable and you want users to wait till the complete page is loaded in the browser. You can accomplish this with the help of little client side script.
-
Create a Simple Task-List Application Using ASP.NET, WCF, and jQuery, Part 2
In the first part of this two-part series, published in the June 2011 issue, we developed a Windows Communication Foundation (WCF) service that takes data in and out of the Tasks table. We created a web form for displaying the tasks in a tabular format using the jQuery Templates plug-in. Finally, we developed a DatePicker plug-in to pick due dates. In this second part, we'll make the task-list application functional by writing jQuery code, including a few helper functions, code to call WCF service methods, and code to filter the task-list table.
-
Create a Simple Task List Using ASP.NET, WCF, and jQuery, Part 1
Maintaining a task list (or to-do list) is a common time management technique that keeps track of work items to be completed along with their priority and current status. No wonder that task manager is often an integral part of web and desktop calendaring applications. In this two part article we will build our own task list application using jQuery, ASP.NET and WCF. Though simple our task list application will illustrate how jQuery can interact with server data through WCF services. We will also get to use several jQuery concepts such selectors, AJAX calls and plug-ins.
-
Using Microsoft Ajax Minifier Tool to Minify JavaScript Files
The increased use of JavaScript and libraries based on JavaScript (such as ASP.NET AJAX and jQuery) results in a considerable amount of JavaScript being downloaded on the client side. The need for large amounts of JavaScript to be downloaded may result in your website getting a performance penalty for obvious reasons. In such cases it is recommended to reduce the size of JavaScript files by using minification techniques. To that end Microsoft Ajax Minifier, a tool to compress JavaScript and CSS files, can greatly reduce the size of such files thus improving the performance of your web application. In this article you will learn the basics of using Microsoft Ajax Minifier tool and certain programming recommendations to get most out of the minification process.
-
Using Microsoft Ajax CDN to Refer ASP.NET AJAX and jQuery Files
Modern web applications rely heavily on client side scripting to provide rich user experience. To that end ASP.NET AJAX and jQuery are popular choices amongst ASP.NET developers to render rich user interface. These libraries make use of client script physically stored in JavaScript (.js) files. When a client accesses a web form that makes use of these libraries the client browser first needs to download the required library files on the client side and then execute the client script. Developers often store these JavaScript files as a part of their web site and then refer to them in various web forms. Though this approach works, it's not the best approach to make use of such client side libraries. That is where Content Delivery Network or CDN comes into picture. As an ASP.NET developer it would be nice to know what a CDN is and how Microsoft Ajax CDN can be used in ASP.NET web sites to refer ASP.NET AJAX and jQuery files. The remainder of the article discusses these concepts.
-
Developing a Database Driven Accordion Menu Using WCF and jQuery
Web sites often use menus to display available options to the end user. The data required by these menus, such as menu text and URL, is frequently stored in XML files. Though this arrangement works great for small number of menu items, in certain applications it is required that you display menu options based on the security credentials of the current user. At times you may also need to display menus in Unicode character set. In such cases storing menu data in a database table can be more beneficial than maintaining separate XML files. In this article you will develop an Accordion menu that fetches data such as menu text, menu items and URL from a database table. An Accordion menu essentially displays menu options in collapsible panels. At a time only one menu and its options are expanded while other menus are collapsed. In order to develop our Accordion menu we will make use of ASP.NET, Windows Communication Foundation (WCF) and jQuery.
-
Creating and Using a jQuery Plug-in in ASP.NET Web Forms
Developers often resort to code reuse techniques in their projects. As far as ASP.NET framework server side programming is concerned classes, class libraries, components, custom server controls and user controls are popular code reuse techniques. Modern ASP.NET web applications no longer restrict themselves only to server side programming. They also make use of client side scripting to render rich web forms. No wonder that Microsoft Visual Studio 2010 includes jQuery library by default as a part of newly created web site. If you are using jQuery for client side scripting then one way to reuse your client side code is to create a jQuery plug-in. Creating a plug-in allows you to bundle your reusable jQuery code in a neat way and then reuse it across web forms. In this article you will learn how to create a simple jQuery plug-in from scratch. You will also learn about certain guidelines that help you build professional jQuery plug-ins.
-
Consuming ASMX and WCF Services using jQuery
In the previous part I demonstrated how jQuery animations can add some jazz to your web forms. Now let's see one of the most important feature of jQuery that you will probably use in all data driven websites - accessing server data. In the previous articles you used jQuery methods such as $.get() to make a GET request to the server. More powerful feature, however, is to make AJAX calls to ASP.NET Web Services, Page Methods and WCF services. The $.ajax() method of jQuery allows you to access these services. In fact $.get() method you used earlier internally makes use of $.ajax() method but restricts itself only to GET requests. The $.ajax() method provides more control on how the services are called.
-
Jazz up your web forms using jQuery animation effects
In this part I cover how to add jazz to your web forms using jQuery effects. jQuery provides a set of methods that allow you to create animations in your web pages. Collectively these methods are called as Effects. The effects they render include fading in and out, sliding in and out, changing opacity of elements, hiding and showing elements and so on. You can, of course, define custom animations. In this part we will use these effects to develop a tooltip, master-detail listing and progress indicator.
-
Event Handling in jQuery
In the previous part of this series I discussed how HTML DOM can be manipulated using jQuery. Now let's proceed with one of the most common task you do in JavaScript - handling events. jQuery streamlines the JavaScript event handling mechanism by providing you a uniform and easy way to wire events with their handlers without bothering about the cross browser issues. As an example we will create a custom context menu (shortcut menu or right click menu) that displays some options specific to our website instead of the normal context menu of the browser.