Showing posts with label ASP.Net Ajax. Show all posts
Showing posts with label ASP.Net Ajax. Show all posts

Monday, September 21, 2009

Ajax Modal Popup Extender and ASP.Net Grid View Control

Had gone through a couple of blogs about having the modal popup extender of ASP.Net AJAX invoked from the button click of Grid view rows.

Posts were not many serving this requirement, though there were some where the Modal Popup Extender had been used in the Item Template of the grid view controls and the requirement is getting met. I could see the appreciations flowing to the blog poster. Well, I too appreciate those who took initiative to put forth a solution for the problem which ASP.Net developers have been facing.Now listen what I have to say you. Do you think keeping a control in an item template is a good and wise idea? How many modal popup extender instances get created while rendering the grid view control if there are one hundred records, and hence one hundred rows? Am I making sense?
Come on. keeping the modal popup extender inside the gridview’s item tempate is an absolute ridicule in this scenario. because, it is an overhead for the page. There are some other ways to get it done. Yup, here is the alternative.

Here we go, add a grid view in the page. Data bind the primary set of data where the result set primary key is, say RequestId in my scenario. Remove auto generate fields property of the columns of the grid view and add template fields to bind the result set. Keep an empty item template where we will later add the button, on click of this the popup to be invoked)

Let the Model Popup Extender be out side the grid, in the page itself. Do the settings of the properties as it is required to have for the modal popup. I guess, I don’t have to go through the settings required for it in detail. (If not, take a sneak peak here in the ASP.Net AJAX site. It is quite explanatory.)

Keep a Button, in the page (Not in the Grid view control), which has to be referred as the Target Control for the modal popup.
asp:Button ID="BtnPopUp" runat="server" Text="BtnPopUp" Width="0px"
Notice the width of the button, it is set to zero, won’t be visible at all when page is rendered. Surprising?, come on, this is a tricky way of doing it!

Insert a panel to the page from the Visual Studio toolbox; Keep a table in the panel where you can arrange your controls quite decently. Type “Click and Drag Popup Here” in the first row of the table where the id of the element should be Id=”DragIt” and set the property runat=”server” for the TD element. This is to enhance the drag facility of the pop up throughout the page.

Keep your Controls (Another grid view control to show the details of each rows? Well, add it then), which have to be popped up on click of the buttons rendered in the grid view, in the table, inside the panel (Control id = PnlResponse), give fixed width for the panel, say 350px.. BtnCancel refers the ID of the button in the panel, on click of which the pop up disappears.


--cc1:ModalPopupExtender ID="MpeSendResponse" runat="server"
TargetControlID="BtnPopUp"PopupControlID="PnlResponse"
BackgroundCssClass="modalBackground"
DropShadow="true"
OkControlID="BtnCancel"
CancelControlID="BtnCancel"PopupDragHandleControlID="DragIt">
cc1:ModalPopupExtender

Well, now we need to add a button control in the Item Template of the Grid view control.(Button control id=”GridsButton”) This Button has no settings for Model Popup extender.

Keep it as it is and Edit Data Bindings of this button control and data bind the required PrimaryKey of the particular row. Ie, Set the command argument as Eval(“RequestId”).

Add a Command Event for this button and in the command event,

You can get


protected void GridsButton_Command(object sender, CommandEventArgs e)
{
Int64 RequestId = Convert.ToInt64(e.CommandArgument);
CallAnotherMethodToShowMoreDetails(RequestId);
MpeViewResponse.Show();
}
All you need to do is to just invoke the Show() method of modal popup extender.

protected void CallAnotherMethodToShowMoreDetails(string RequestId)
{
//Do whatever you want with the RequestId.
}
You can fetch another set of records from the database by passing RequestId as the input parameter and display the result set in another grid view control kept in the pannel control (PnlResponse). Yup your pop up shows the details of the records when you click on the buttons in the parent grid view control.

Doesn’t it make sense?

Tuesday, April 22, 2008

sys.WebForms.PageRequestManagerParserErrorException:

sys.WebForms.PageRequestManagerParserErrorException: The message receieved from server could not be parsed. Common causes for this error are when the response is modified by calls to Response filters, HttpModules, or server trace is enabled.

There are a couple of solutions available to this error:
Try to put yur Sumbit button out of the Update Panel.

do not use the HttpModule and rely on IIS compression, or move the application to the .NET Framework 3.5.
Remove the HttpModule from web.config
Assure ScriptResource is not compressed:
Open the IIS Manager
Right click on "Web Sites" folder > Properties
Click the "Services" tab
Check "Compress application files" and "Compress static files"
Apply and confirm all dialogs
Stop IIS
Open a command prompt and go to C:\Inetpub\AdminScripts
Run the following commands to add .js, .aspx and .axd to the compression list:
cscript adsutil.vbs set W3SVC/Filters/Compression/GZIP/HcFileExtensions "htm" "html" "txt" "js"
cscript adsutil.vbs set W3SVC/Filters/Compression/Deflate/HcFileExtensions "htm" "html" "txt" "js"
cscript adsutil.vbs set W3SVC/Filters/Compression/GZIP/HcScriptFileExtensions "asp" "dll" "exe" "aspx"
cscript adsutil.vbs set W3SVC/Filters/Compression/Deflate/HcScriptFileExtensions "asp" "dll" "exe" "aspx"
Restart IIS
You can also move the application to .NET Framework 3.5 instead, because the UpdatePanel control has been changed internally and now this problem should not happen anymore.

Friday, April 4, 2008

Difference between the Web.config of a ASP.Net Website and an ASP.NET AJAX Enabled Website

When you create a new AJAX-enabled Web site, you can use the Web.config file provided in the installation package to add the required configuration settings. In Visual Studio, the Web.config file for Microsoft ASP.NET AJAX is included in your project when you create a new ASP.NET AJAX-enabled Web Site. But in a Normal ASP.Net Ajax website, you need to add it manually by right clicking on the Website in the Solution explorer.

Adding ASP.NET AJAX Configuration Elements to an Existing Web Site
In an existing Web site, you typically have values in the Web.config file that you want to retain. In that case, you can add the new ASP.NET AJAX elements into the existing Web.config file.
The new elements are part of the following configuration sections:
The element
The element
The element
The element
The element
The element
The element