Customizing List View Results in wMobile Phone: Change the Way You See Your Results

by Fred Block on March 31, 2015

In the wMobile Phone edition, Quick Search and Lookup Contact will be your "go to" methods for quickly finding contacts. After wMobile finishes searching, the contacts it finds are listed for you in a "List View". Since we all work a little bit differently, the fields that display in the List View may not be "exactly" what you prefer to see when reviewing your search results. No problem! In this blog article, we will walk through customizing the List View to have it show you the fields you deem most important and how the order of the data displayed can be modified. Please note that any changes made to the List View will affect all wMobile Phone users.

There is a default group of fields that will contain the data returned by a search: Contact, Company, Address1, CityState, EmailAddress, Phone1, Ext1, and Key1. The order of the search result fields displayed in the List View is configurable (see details below).

Results in the List View shown with the default fields:

 

For our examples, we'll assume you would like to have two additional fields in the List View results (Industry and Source).

An administrator can add additional fields by editing the ContactListStyle.xml file  located in the following folder on the wMobile server (typical location):

C:\Program Files\W-Systems\wMobilePhone\conf\UI\ListViewStyles

 

NOTE: The ContactListStyle.xml file is copied to the server during the initial wMobile installation but not during wMobile updates. This prevents customizations made to this file from being overwritten with subsequent wMobile updates.

 

IMPORTANT: It is recommended that a backup copy of the ContactListSyle.xml file is made before editing the original. The backup copy may be used for reference or as a restore point if needed.

 

In the following customization example, the Industry (i.e., KEY2) and Source (i.e., SOURCE) fields will be added to the List View results.

Open the ContactListSyle.xml file. You can use Notepad to open XML files (you may use a different editor; see: TIP (Editing XML Files) for more information).

The modifications to the original file are shown in the following listing in blue. Two sections of this file need to be edited. One section is between the and tags and the other section is between the and tags (shown in red).



  
     Name="ContactImage" ImageUrl="res/img/Contact.png" />
     Name="Contact" Title="Contact" DataField="Contact" CommandName="Select" />
     Name="Company" Title="Company" DataField="Company" EmptyText="N/A" />    
     Name="Address1" Title="Address1" DataField="Address1" EmptyText="N/A" />
     Name="CityState" Title="CityState" DataField="CityState" EmptyText="N/A" />
     Name="EmailAddress" Title="Email" DataField="EmailAddress" CommandName="SendEmail" />
     Name="Phone1" Title="Phone" DataField="Phone1" />
     Name="Ext1" Title="Ext1" DataField="Ext1" />
     Name="Pending" Text="<% $Resources:Phone.ListViews,LBL_PENDING %>" Title="Pending" CommandName="Pending" />
     Name="History" Text="<% $Resources:Phone.ListViews,LBL_HISTORY %>" Title="History" CommandName="History" />
     Name="Key1" Title="Key1" DataField="Key1" EmptyText="N/A" />
     Name="Key2" Title="Key2" DataField="Key2" EmptyText="N/A" />
     Name="source" Title="source" DataField="source" EmptyText="N/A" />
	  
  
  
     BackColor="SkyBlue">
       HorizontalAlign="Left" ColumnLayout="0" />
       HorizontalAlign="Left" ColumnLayout="1" />
    
    
       HorizontalAlign="Left" ColumnLayout="" />
       HorizontalAlign="Left" ColumnLayout="2" />
    
	  
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="3" />
	  
	  
       HorizontalAlign="Left" ColumnLayout="" />
       HorizontalAlign="Left" ColumnLayout="4" />
    
    
       HorizontalAlign="Left" ColumnLayout="" />
       HorizontalAlign="Left" ColumnLayout="5" />
    
      
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="10" />
      
      
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="11" />
      
      
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="12" />
      

	  
       HorizontalAlign="Left" ColumnLayout="" />
       HorizontalAlign="Left" ColumnLayout="6; ;7" />
    
    
       ColumnSpan="2" HorizontalAlign="Right" ColumnLayout="8; ;9;

" />

 

Add the columns to the section:

The easiest way to add an item is to make a copy of an existing line and customize the copied line accordingly. After inserting the two new lines for this example, update the TextColumn Name, Title, and DataField values (shown in blue) to be the field names to be displayed:

 Name="Key2" Title="Key2" DataField="Key2" EmptyText="N/A" />
 Name="source" Title="source" DataField="source" EmptyText="N/A" />


Now these items must also be added to the section for them to be displayed.

Before customizing the ItemLayout section, it's worth noting that there are two methods of setting the column order in the List View that displays search results: (1) using "index numbers" and (2) using "column names". Each item to be displayed must be included in the list of columns found between the and tags in the ContactListSyle.xml file.

1. Using Index Numbers:

      
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="11" />
	  
 
    
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="12" />
	  


In the following listing, the column numbers shown in red were added for reference only and are not in the actual file. They are here to show that the items are depicted as numbered sequentially from top to bottom starting with index "0". These index numbers can be used to set the position of the items in the List View. While this is a viable option, you may find using "column names" easier and more "readable".

  
0    Name="ContactImage" ImageUrl="res/img/Contact.png" />
1    Name="Contact" Title="Contact" DataField="Contact" CommandName="Select" />
2    Name="Company" Title="Company" DataField="Company" EmptyText="N/A" />    
3    Name="Address1" Title="Address1" DataField="Address1" EmptyText="N/A" />
4    Name="CityState" Title="CityState" DataField="CityState" EmptyText="N/A" />
5    Name="EmailAddress" Title="Email" DataField="EmailAddress" CommandName="SendEmail" />
6    Name="Phone1" Title="Phone" DataField="Phone1" />
7    Name="Ext1" Title="Ext1" DataField="Ext1" />
8    Name="Pending" Text="<% $Resources:Phone.ListViews,LBL_PENDING %>" Title="Pending" CommandName="Pending" />
9    Name="History" Text="<% $Resources:Phone.ListViews,LBL_HISTORY %>" Title="History" CommandName="History" />
10   Name="Key1" Title="Key1" DataField="Key1" EmptyText="N/A" />
11   Name="Key2" Title="Key2" DataField="Key2" EmptyText="N/A" />
12   Name="source" Title="source" DataField="source" EmptyText="N/A" />
  


2. Using Column Names:

The following listing is the same column list as the prior one but without the index numbers being shown. In this listing, the red text is highlighting the column "Name" values needed for setting the column order in the List View (i.e., the "Name" value):


    Name="ContactImage" ImageUrl="res/img/contact.gif" />
    Name="Contact" Title="Contact" DataField="Contact" CommandName="Select" />
    Name="Company" Title="Company" DataField="Company" EmptyText="N/A" />    
    Name="Address1" Title="Address1" DataField="Address1" EmptyText="N/A" />
    Name="CityState" Title="CityState" DataField="CityState" EmptyText="N/A" />
    Name="EmailAddress" Title="Email" DataField="EmailAddress" CommandName="SendEmail" />
    Name="Phone1" Title="Phone" DataField="Phone1" />
    Name="Ext1" Title="Ext1" DataField="Ext1" />
    Name="Pending" Text="Pending" Title="Pending" CommandName="Pending" />
    Name="History" Text="History" Title="History" CommandName="History" />
    Name="Key1" Title="Contact Type" DataField="Key1" EmptyText="N/A" />
    Name="Key2" Title="Key2" DataField="Key2" EmptyText="N/A" />
    Name="Source" Title="Source" DataField="Source" EmptyText="N/A" />


Again, copy another set of lines beginning with and tags and paste them where they should appear in the resulting List View, in this example, after the KEY1 (having ColumnLayout = 10).

1. Using Index Numbers:

      
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="11" />
	  
 
    
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="12" />
	  


2. Using Column Names:

As you'll see here, using the "names" instead of the "index numbers" allows you to easily identify the positioning of the items you are placing in the layout without having to know which index number is related to the column you are working with.

      
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="Key2" />
	  
 
    
		   HorizontalAlign="Left" ColumnLayout="" />
		   HorizontalAlign="Left" ColumnLayout="source" />
	  


When all editing is complete, save the changes made to the ContactListView.xml file. Now test your the updated List View by running a Quick Search or Lookup Contact search in wMobile Phone to see the new fields in the results list.

NOTE: Fields in the List View results that do not contain data are not displayed. wMobile Phone Edition is designed for use on a hand-held devices and does not display empty fields to minimize scrolling.


Example of updated List View layout:

 



We hope you find this information useful. Making the best use of your search results can save you a lot of time by not having to go elsewhere in your database to get important information you can have displayed directly in the List View. Think about "your" needs and try this out.

Find similar articles in these categories:

PRODUCT: wMobile

AUDIENCE: Administrators

Fred Block
Application Specialist at W-Systems
More From This Author »