Archive for the ‘ASP.NET Ajax’ Category

Web Page Loading in Steps – ASP.NET Solution By Petr Pechovic

Posted by Ramani Sandeep on February 23, 2010

The common scenario to reach the desired page on the internet is to write the URL to a browser and press Enter. Basically say the browser asks a server for the requested page. The server builds the page (HTML) and sends the result back to the browser. The browser displays the result to the user and makes HTTP requests to other content like images, etc. Let’s jump back to the stage when the server is building the content of the page. Some parts of the page are usually static data immediately available to use. Another data of the page could be dynamic, either from huge database heavy for calculation or from another server like RSS channel. The point is that some of the data is quickly available and some of the data need time to be loaded. The HTML build by server isn’t sending to the browser until it is completely created. That is obvious.

Hope this will help

Jay Ganesh

Posted in ASP.NET 3.5, ASP.NET Ajax, JQuery | Tagged: Web Page Loading in Steps | 4 Comments »

The Controls collection cannot be modified because the control contains code blocks (i.e. ).

Posted by Ramani Sandeep on February 16, 2010

Today one of my team mate faced a strange problem while copying pages from one project to another.

What happen it shows the error like

"The Controls collection cannot be modified because the control contains code blocks (i.e. <% … %>)”.

The Same pages are working fine in previous place & run perfectly but after moving the pages we are facing the error shown above.

Now When i saw the error initially i thought there was problem in Ajax Control because it was redirecting me to the AjaxToolkit Base Class library javascript file.

But i was not able to figure out the problem so i typed this error in Google & got some of the solutions but the following solution by LeeDumond helped me to solve the issue i was facing.

So i decided to share it with you.

Problem

If you’re using Master Pages in ASP.NET and trying to resolve <script> or <style> references in the page head, you may have run into this this show-stopper. If so, here’s why it’s happening, and here’s an easy way to fix it.

If you’ve worked with ASP.NET Master Pages, you’ve no doubt taken advantage of automatic URL re-basing within the HtmlHead control.

Hope this will help

Jay Ganesh

Posted in ASP.NET Ajax | Tagged: The Controls collection cannot be modified because the control contains code blocks (i.e. ) | Leave a Comment »

Best Practices for Speeding Up Your Web Site

Posted by Ramani Sandeep on January 30, 2010

The Exceptional Performance team has identified a number of best practices for making web pages fast. The list includes 34 best practices divided into 7 categories.

1) Content

Minimize HTTP Requests

Reduce DNS Lookups

Avoid Redirects

Make Ajax Cacheable

Post-load Components

Preload Components

Reduce the Number of DOM Elements

Split Components Across Domains

Minimize the Number of iframes

2) Server

Use a Content Delivery Network

Add an Expires or a Cache-Control Header

Gzip Components

Configure ETags

Flush the Buffer Early

Use GET for AJAX Requests

3) CSS

Put Stylesheets at the Top

Avoid CSS Expressions

Choose <link> over @import

Avoid Filters

4) Javascript

Put Scripts at the Bottom

Make JavaScript and CSS External

Minify JavaScript and CSS

Remove Duplicate Scripts

Minimize DOM Access

Develop Smart Event Handlers

5) Cookie

Reduce Cookie Size

Use Cookie-free Domains for Components

6) Images

Optimize Images

Optimize CSS Sprites

Don’t Scale Images in HTML

Make favicon.ico Small and Cacheable

7) Mobile

Keep Components under 25K

Pack Components into a Multipart Document

Posted in ASP.NET, ASP.NET 3.5, ASP.NET 4.0, ASP.NET Ajax, Css, JavaScript, Performance | Tagged: Best Practices for Speeding Up Your Web Site, Performance | Leave a Comment »

Lazy Loading

Posted by Ramani Sandeep on December 11, 2009

Introduction

Lazy loading is a design pattern commonly used in computer programming to defer initialization of an object until the point at which it is needed. It can contribute to efficiency in the program’s operation if properly and appropriately used. The opposite of lazy loading is Eager Loading.

Article – 1: jQuery Tabs and Lazy Loading by Malcolm Sheridan

In this article I will connect to the Northwind database using LINQ to SQL, and display customer and product information in separate tabs. I’ll also show you one way of lazy loading these tabs so the data is retrieved only once, not each time a tab is selected.

Article – 2: Lazy Loading jQuery Tabs with ASP.NET by Mikesdotnetting

This article looks at efficient use of jQuery tabs when displaying data. Specifically, it covers how to lazy-load data, so that it is only accessed and displayed if the tab is clicked.

Lazy Loading is a well-known design pattern that is intended to prevent redundant processing within your application. In the case of tabbed data, there seems little point retrieving and binding data that appears in a tabbed area that no one looks at. So, this examples covers how to defer data access and display until the user wants it – which is defined by them clicking the relevant tab.

Article – 3: Eager Loading and Lazy Loading in ADO.NET Data Services by Gil Fink

The default behavior of a data service’s .NET client is not to load the entities’ associated objects. When we request an entity we will get it from the service but its associated objects will not load up at all.

Lets say that I have two entities in my program

a course
a department

The associations between the entities are that a department can have a lot of courses and a course belongs to one department.

When I load a department it’s list of courses will be empty. trying to iterate the list of courses will give nothing because the courses will not load until we tell them to be loaded explicitly.

This is done by the LoadProperty method of the data service context.

I have a great learning experience thru this.

Now its your turn to have it.

Posted in ASP.NET, ASP.NET 3.5, ASP.NET Ajax, C# 3.0, JQuery, Linq | Tagged: Eager loading, Eager Loading and Lazy Loading in ADO.NET Data Services, jQuery Tabs and Lazy Loading, lazy loading, lazy loading .net, lazy loading asp.net, lazy loading in asp.net, Lazy Loading jQuery Tabs with ASP.NET | Leave a Comment »

Color Picker

Posted by Ramani Sandeep on November 6, 2009

There are lots of way show color picker on web site. Today I was search for such color picker which I want to use it in one of my website.

I have searched a lot of color picker that can be useful, so here I m writing about it.

ColorPicker AJAX Extender

ColorPicker is an ASP.NET AJAX extender that can be attached to any ASP.NET TextBox control. It provides client-side color-picking functionality with UI in a popup control. You can interact with the ColorPicker by clicking on a colored area to set a color. It requires a binary reference to the ASP.NET AJAX Control Toolkit.

ColorPicker extender is multi-browser compatible: it works with IE 6/7/8, Firefox, Safari and Goggle Chrome. ColorPicker is built on top of ASP.NET AJAX Control Toolkit and internally utilizes a Popup extender. ColorPicker is compatible with the UpdatePanel: can be placed inside the UpdatePanel.

ColorPicker is included in Ajax Control Toolkit since Release 30512. For those who use previous release of Ajax Control Toolkit this ColorPicker project will continue to evolve and stay in sync with the Ajax Control Toolkit.

Color Picker using javascript

This widget is used to select a color, in hexadecimal #RRGGBB form. It uses a color "swatch" to display the standard 216-color web-safe palette. The user can then click on a color to select it.

This script is very simple to implement, and can add a lot of style to your page that requires color values!

Because of the size of the table, this color picker may be slow on lower-end machines. Consider your target users when deciding whether or not it operates fast enough.

ASTreeView – A Powerful ASP.Net TreeView Control

Posted by Ramani Sandeep on October 23, 2009

ASTreeView is a powerful treeview with drag drop, ajax loading, context menu, xml import/export, checkbox, selection, add/editing/deleting nodes with ajax.

ASTreeView is developed on .NET framework 2.0. Demo project is a Visual Studio 2005 project.

ASTreeView is FREE! That means you can use it anywhere!

for more detail : click here

Posted in ASP.NET, ASP.NET Ajax | Tagged: A Powerful ASP.Net TreeView Control, ASTreeView, Treeview | 1 Comment »

Calling Web Service Methods Using ASP.NET AJAX

Posted by Ramani Sandeep on September 22, 2009

The Microsoft ASP.NET AJAX asynchronous communication layer enables a browser to call Web service methods on the server by using ECMAScript (JavaScript). It exposes APIs that JavaScript functions can use in any browser to call Web service methods on the server.

The page can call server-based methods without a postback and without refreshing the whole page, because only data is transferred between the browser and the Web server.

This following code example shows how to expose a Web service method in an ASP.NET Web page.

Step 1: Create ASP.NET Ajax Enabled Web site

Step 2: Now Add New Item – Select Web Service from the List of Items and Name it WebService.asmx.

Step 3: Replace the WebService.cs with the following code:

Listing – 1

using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;

/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class WebService : System.Web.Services.WebService
{
    [WebMethod]
    public string HelloWorld()
    {
     return "This is Message From Server - Hello World - " + DateTime.Now.ToString();
    }
}

Note: We have added [ScriptService] tag and Replaced HelloWorld().

Step 4: Now come back on default.aspx page and and Update the ScriptManager with the following:

Listing – 2

    <asp:ScriptManager runat="server" ID="scriptManager">
         <Services>
            <asp:ServiceReference Path="WebService.asmx" />
         </Services>
    </asp:ScriptManager>

Here given the ServiceReference to WebService that we have just created.

Step 5: Add button control on page which will be used to call the webservice.

Listing – 3

    <div>
      <p>Calling a service that returns the current server time.</p>
       <input id="Button1" type="button" value="Call Web Service" onclick="HelloWorld()"/>
    </div>

Step 6: Add Javascript on the page with HelloWorld() function with will call the WebService & Return the Result.

Listing – 4

    <script type="text/javascript">
            function HelloWorld()
            {
                WebService.HelloWorld(OnSucceeded);
            }
            function OnSucceeded(result)
            {
                var myResult = document.getElementById("rst");
                myResult.innerHTML = result;
            }
        </script>

Step 7: finally put <spam> tag on page on which we will display our result.

Listing – 5

    <hr />
       <div>
           <span id="rst"></span>
       </div>

Reference:

http://www.asp.net/AJAX/Documentation/Live/overview/AsynchronousLayerOverview.aspx

Hope this will Help you !!!

Jay Ganesh

Posted in ASP.NET Ajax, C# 2.0 | Tagged: Call ASP.NET Ajax Page Methods, Call Web Service, Calling Web Service Methods Using ASP.NET AJAX | 2 Comments »

Basics of ASP.NET AJAX Version 1.0

Posted by Ramani Sandeep on September 22, 2009

Partial-Page Rendering

Partial-page rendering makes it unnecessary for the whole ASP.NET page to be refreshed as the result of a postback. Instead, only the region of the page that has to be refreshed is updated. As a result, users do not see the whole page reload with every postback, which makes user interaction with the Web page more seamless.

UpdatePanel Control

UpdatePanel controls work by specifying regions of a page that can be updated without refreshing the whole page. This process is coordinated by the ScriptManager server control and the client PageRequestManager class. When partial-page updates are enabled, controls can asynchronously post to the server. An asynchronous postback behaves like a regular postback in that the resulting server page executes the complete page and control life cycle. However, with an asynchronous postback, page updates are limited to regions of the page that are enclosed in UpdatePanel controls and that are marked to be updated. The server sends HTML markup for only the affected elements to the browser. In the browser, the client PageRequestManager class performs Document Object Model (DOM) manipulation to replace existing HTML with updated markup.

UpdateProgress Control

Provides visual feedback in the browser when the content of UpdatePanel controls is updated. The UpdateProgress control renders a <div> element that is displayed or hidden depending on whether an associated UpdatePanel control has caused an asynchronous postback. For initial page rendering and for synchronous postbacks, the UpdateProgress control is not displayed.

PageRequestManager Class

The PageRequestManager class exposes properties, methods, and events that enable you to customize partial-page updates with client script. The PageRequestManager class exposes a client page event model that you can use in a way similar to how you use the server page event model.

During partial-page updates initiated by asynchronous postbacks, the PageRequestManager class coordinates how the page content is incrementally updated in the browser. The UpdatePanel server control and PageRequestManager client class abstract much of the complexity of partial-page updates. When you use client script and members of the PageRequestManager class, you can customize the partial-page update behavior in the browser.

To use the PageRequestManager class in client script, you must put a ScriptManager server control on the Web page. The EnablePartialRendering property of the ScriptManager control must be set to true (which is the default). When EnablePartialRendering is set to true, the client-script library that contains the PageRequestManager class is available in the page.

ScriptManager Control

The ScriptManager control manages client script for Microsoft ASP.NET AJAX pages. By default, the ScriptManager control registers the script for the Microsoft AJAX Library with the page. This enables client script to use the type system extensions and to support features such as partial-page rendering and Web-service calls.

You must use a ScriptManager control on a page to enable the following features of ASP.NET AJAX:

Client-script functionality of the Microsoft AJAX Library, and any custom script that you want to send to the browser.
Partial-page rendering
JavaScript proxy classes for Web services, which enable you to use client script to access Web services by exposing Web services as strongly typed objects.
JavaScript classes to access ASP.NET authentication and profile application services.

Timer Control

The Timer control performs postbacks at defined intervals. If you use the Timer control with an UpdatePanel control, you can enable partial-page updates at a defined interval. You can also use the Timer control to post the whole page.

The Timer control is a server control that embeds a JavaScript component into the Web page. The JavaScript component initiates the postback from the browser when the interval that is defined in the Interval property has elapsed. You set the properties for the Timer control in code that runs on the server and those properties are passed to the JavaScript component.

An instance of the ScriptManager class must be included in the Web page when you use the Timer control.

When a postback was initiated by the Timer control, the Timer control raises the Tick event on the server. You can create an event handler for the Tick event to perform actions when the page is posted to the server.

Set the Interval property to specify how often postbacks will occur, and set the Enabled property to turn the Timer on or off. The Interval property is defined in milliseconds and has a default value of 60,000 milliseconds, or 60 seconds.

Reference

I have Read the information & Compiled it to produce the following article from ASP.NET AJAX Documentation, so if you want to go deep in each topics please visit –> ASP.NET AJAX

Hope this will Help you !!!

Posted in ASP.NET Ajax | Tagged: AJAX Overview, ASP.NET AJAX Overview, Basics of AJAX, PageRequestManager Class, Partial-Page Rendering, ScriptManager Control, Timer Control, UpdatePanel Control, UpdateProgress Control | Leave a Comment »

If At First You Don’t Succeed – Retrying Mail Operations in .NET

Posted by Ramani Sandeep on September 21, 2009

Mail sent from your application didn’t go through? Don’t give up so easily! The majority of mail server interruptions are very temporary in nature, lasting only a few seconds. Instead of failing right away, why not give your SMTP client another shot?

As I’m sure you’re very aware, sending email from applications is an extremely common task. For example, just about every web site has a “Contact Us’ page of some sort. Yours are probably much prettier that the screenshot below, but the idea is the same.

If you only need to send mail from this one place, you might stick the required code directly in the code-behind of your contact page. However, most applications need to send mail for all kinds of reasons – to confirm new member signups, subscription requests, password changes and resets, and various other notifications based on your business rules. Therefore, it’s much more convenient to encapsulate the mail-sending logic and just call it from wherever you need to, as below.

What is Maximum Request size for asp.net application?

Posted by Ramani Sandeep on September 21, 2009

The default max request size is 4MB (4096).

You can change a setting in your web.config to allow larger requests.

Here is the example:

   1: <configuration>

   2:        <system.web>

   3:            <httpRuntime  maxRequestLength="4096"/>

   4:        </system.web>

   5: </configuration>

This is default setting, we have to change this to the size that you want to allow user to request like 5MB, 6MB…

Hope this will Help !!!

Posted in ASP.NET, ASP.NET Ajax, ASP.NET MVC | Tagged: httpRuntime, Limiting the File Upload Size in ASP.NET, maximum image upload size, Maximum limit for File Upload ASP.NET | 1 Comment »

« Previous Entries

	Pravin Varade on How to hide Gridview column…
	prashanth on Capture web page as image usin…
	linkonbaruaiiuc on How to hide Gridview column…
	Ramani Sandeep on Export Gridview to Excel
	Bhanu Prakash Inturi on Export Gridview to Excel

Ramani Sandeep's Blog

DotNetting – Fast , Easy Way of Developing Applications

Top Posts

Categories

New Posts

Archives

My Twitter

Blog Stats

Subscribe

Visitor Map

Useful links

Tags