Showing Adam users with a GridView

Using the DataSource controls provided by Adam makes it pretty easy to show data stored in Adam to the user. Combine this with rich controls that consume that data and you are able to create quickly a custom website that provide a specific task to a user.

This sample shows Users in a standard ASP.NET grid view, but it's pretty easy to show other type of objects provided by Adam, like Records, Classifications, fields....

Initial steps

First thing to do is to create a new website or web application project in Visual Studio. Start by using the template "ADAM Web Application (with DataSources)" or "ADAM Web Site (with DataSources)". This template contains a good starting point for a web project that requires access to Adam. It contains a prefilled web.config file and a login page, out-of-the box.

Note: If you do not see this template in Visual Studio, the installation instructions for these templates are described in the Adam help.

Now open the Default.aspx file in Design Mode and drag an ASP.NET GridView control onto the designer. From the smart-tag panel of the GridView, choose to create a new data source. This will prompt you with a list of available datasources where you can select the ADAM datasource.

Note: By default, the Adam controls are not set in the toolbox of Visual Studio. Right click on the toolbox and select 'Choose items...'. This will enable you to select the Adam.Web.dll, which contains the required controls.

Once selected the ADAM datasource, configure the datasource like this:

  1. Choose registration name: Keep the default settings
  2. Choose data provider: In this step of the wizard, you configure what type of objects you want to retrieve from Adam. In this sample, select 'User (Core)' to retrieve user objects from Adam.
  3. Configure Select: Select the 'All Objects' option
  4. Configure the DataOptions: Keep the default settings.

After clicking OK, the grid view control is bound to the Adam datasource and the available columns have been generated.

That's it. At least, this is the minimum you must to do create a table showing all users in your Adam registration. You can now fine-tune your page and add extra features, like setting up paging for the grid view, styling and more.

Edit a user object

The initial steps to create the grid view are covering the read-only viewing of the users in Adam. Adding edit functionality is as simple.

Select the grid view, open its smart-tag panel and select 'Edit columns...'. In the dialog, add a CommandField 'Edit, Update and Cancel'. And again, that's it. Users now get an 'Edit' button per user object shown in the grid view and clicking on that button switches the row into edit mode.

To handle errors that may occur in the update process of the user object, only a few lines of code are required. First of all, add an event handler for the RowUpdated event of the GridView. The implementation of that event handler is pretty straight forward:

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
protected void GridView1_RowUpdated(object sender, GridViewUpdatedEventArgs e)
{
    if (e.Exception != null)
    {
        // Handle the exception.
        // ...

        // Tell the grid view to stay in edit mode and that the exception has
        // been handled.
        e.KeepInEditMode = true;
        e.ExceptionHandled = true;
    }
}

Showing the display image of a user

Adam allows you to attach an image to a user. To enhance your grid view by displaying the image of that user is again pretty straight forward and can be achieved without writing a single line of code.

So lets add that to the grid view. First, add a new TemplteField to the grid view and name it 'Image'. After you have added this TemplateField to the grid view, select the 'Edit Templats...' in the smart-tag panel of the grid view and start editing the ItemTemplate for the Image column. Drag a standard ASP.NET Image control onto the ItemTemplate (You can use any control that is able to display an image, but this sample uses the standard control).

Next, you must instruct the Image control to display the image of the user. Do this by dragging a UserImageBinder onto the item template (this control is located in the Adam.Web.dll assembly) and set the TargetControlID to the ID of the image control. Et voila, you are now displaying the image of the user in the grid view.

If not all your users have an image, you probably wish to provide a default image to indicate this. This can be achieved by setting an ImageUrl property on the Image control, which servers as the default image for the UserImageBinder control. In the end, your template field should look like:

ASP.NET
1
2
3
4
5
6
7
8
<asp:TemplateField HeaderText="Image">
    <ItemTemplate>
        <asp:Image ID="imgUser" runat="server" 
                   ImageUrl="NoImage.jpg" />
        <awc:UserImageBinder ID="UserImageBinder1" runat="server" 
                             TargetControlID="imgUser" />
    </ItemTemplate>
</asp:TemplateField>

Displaying a user field

Adam provides the posibility to add custom fields to User objects. And showing these fields to an end user is of course a taks common to all Adam development. This last last topic describes on how to do this.

The approach is very similar to the one described for showing images.

Note: This sample assumes there is a user textfield set-up in Adam named 'UserGridTextField'.

First, add a new TemplateField to the grid view and give it a proper name, e.g. 'CustomField'. Next, edit the item template of this new column and drag a control that will be responsible for displaying the value of the field. In this sample, a simple ASP.NET Label control will do to display the content of the 'UserGridTextField'. field.

Now, instruct the the Label control to show the content of the field by dragging a GenericFieldBinder control to the item template, set the ControlTargetID to the ID of the Label control and set the FieldName to 'UserGridTextField'. At runtime, the field binder will fetch the value of the 'UserGridTextField' and pass it to the Label control.

Do the same for the edit item template of this column, but use a textbox instead, to enable editing of the field value.

For some objects (like Records and Files), fields are not guaranteed to be available on the object (e.g. a floating field or a classification dependant field). You can instruct the field binders behavior is those cases, by specifying the FieldAbsentAction to any of these values:

  • DisableTarget
  • HideTarget
  • Nothing
  • ThrowException
When you use the DisableTarget option, the value set at design-time on the target control will serve as default value to display.

In the end, your column should look like this:

ASP.NET
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<asp:TemplateField HeaderText="UserGridTextField">
    <ItemTemplate>
        <asp:Label runat="server" ID="Label1" 
                   Text="Field not available" />
        <awc:GenericFieldBinder ID="GenericFieldBinder1" runat="server" 
                   TargetControlID="Label1" 
                   FieldName="UserGridTextField" 
                   FieldAbsentAction="DisableTarget"  />
    </ItemTemplate>
    <EditItemTemplate>
        <asp:TextBox runat="server" ID="TextBox1" />
        <awc:GenericFieldBinder ID="GenericFieldBinder2" runat="server" 
                   TargetControlID="TextBox1" 
                   FieldName="UserGridTextField" 
                   FieldAbsentAction="DisableTarget"  />
    </EditItemTemplate>
</asp:TemplateField>

There you go, you can now edit a field of a user.

A complete solution containing this code is available for download in the sample code section of this article.

Sample Code

The article contains sample code project(s).
You must be logged in to view or download sample code.
Sign in now

Comments

Leave a comment
You must be logged in to post comments.
Sign in now
 
 
Technical
Business
rss feed