Thursday, June 28

ASP.Net FormView Control.

&t
I was posed with the problem of a showing a list of data, displaying the details of a particular enry in the list and letting the user edit/update the entry, all on one page. I have seen such an scenario implemented with gridview with an "Edit" button as a column on the gridview and displaying the details on a modal popup. the modal popup would be either a "showModalDialog" based window or an Telerik RadWindow.

I wanted to specifically avoid having popups due to cross browser issues (did not have Telerik suite available for this project). To implement all of this functionality on a page I decided to user the Master-Detail mode with either the GridView-DetailsView or the GridView-FormView.

I srated off with a DetailsView by using TemplateFields for editable fields. soon, I realized the I had no control over the layout of the DetailsView and since I wanted to keep evething in the 1024X768 boundry, I decided on using the FormView.

FormView is very much like the DetailsView, it displays data item by item with paging support. What it offers you over the DetailsView is the ability to control the layout of the elements of the Detail and it also aleviates the need to implement an TemplateField for eahc and every field that needs to be edited. 

It basically has an ItemTemplate & an EditTemplate, the contents/layouts of which are totally in the developers control.
  319         asp:FormView ID="fvExceptionDetails" runat="server"/asp:
  320         AllowPaging="true" DataKeyNames="Oid" 
  321         OnModeChanging="fvExceptionDetails_ModeChanging" 
  322         OnPageIndexChanging="fvExceptionDetails_PageIndexChanging" 
  323         OnItemUpdating="fvExceptionDetails_ItemUpdating">
  324             ItemTemplate
  325             /ItemTemplate
  326             EditTemplate
  327             /EditTemplate
  328         FormView>
Since I am well versed with the event model of the GridView, I felt FormView would be similar to use and implement. But it is a bit different than the GridView and here are the events that need to handled in order for the FormView to work.

Each entry in the list displayed in the GridView was associated with zero or more detail entries that needed too be displayed in the FormView. Hence use of paging was obvious choice and had to have an handler in place for the PageIndexChanging event. 

  261     protected void fvExceptionDetails_PageIndexChanging(object sender, 
  262         FormViewPageEventArgs e)
  263     {
  264         fvExceptionDetails.PageIndex = e.NewPageIndex;
  265         DataBindExceptionDetails();
  266     }

The ItemTemplate had a LinkButton that had an CommandName="Edit" that when pressed should transform the FormView in the "Edit" Mode. so had to handle the ModeChanging event. Since I had did not want the user to move to anoher while editing, I disabled the Paging when in this mode. Also, I found that it was critical to DataBind() again in this even handler.

One thing to note would be that, in order to be able to access any of the elements inside the EditItemTemplate, the FormView has to be in that mode before you try and find the control using .FindControl("txtComment"). Hence the first statement in the ModeChanging event handler is the the .ChangeMode() method call.
  267     /// 
  268     /// event invoked only when mode changed through UI.
  269     /// 
  270     /// 
  271     /// 
  272     protected void fvExceptionDetails_ModeChanging(object sender, 
  273         FormViewModeEventArgs e)
  274     {
  275         fvExceptionDetails.ChangeMode(e.NewMode);
  276         if (e.NewMode == FormViewMode.Edit)
  277         {
  278             fvExceptionDetails.AllowPaging = false;
  279         }
  280         else
  281         {
  282             fvExceptionDetails.AllowPaging = true;
  283         }
  284         if (e.NewMode != FormViewMode.Insert)
  285         {
  286             DataBindExceptionDetails();
  287         }
  288         SetJSonclickAttribute();
  289     }

The EditTemplate contained 2 buttons at the end, namely the "Update" and "Cancel". In order to implement the "Update" functionality I had to have implement the ItemUpdating event handler. 

  322     protected void fvExceptionDetails_ItemUpdating(object sender, 
  323         FormViewUpdateEventArgs e)
  324     {
  325         //perform update logic here.
  326         fvExceptionDetails.ChangeMode(FormViewMode.ReadOnly);
  327         fvExceptionDetails.AllowPaging = true;
  328;/span>         DataBindExceptionDetails();
  329     }  

I hope this implementation detail helps. One thing to note would be that I was not using an ObjectDataSource/SqlDataSource to populate the Detailsview.

Comments: Post a Comment

Subscribe to Post Comments [Atom]





<< Home

This page is powered by Blogger. Isn't yours?

Subscribe to Posts [Atom]