DataList Control which will build datalist as per your requirements...

• Download MyDataListControl.zip
• Download MyDataListControl_v11_.zip - 5.9 KB- 4.8 KB

Introduction

This control will build a DataList control which is Dynamic and you can give Custome properties to it, Like you can select header CSS style, columns width, on which column you want to put sorting functionality and as per properties set you will find that a nice datalist will be displayed with hover effect on each rows, plus sorting functionality on desired columns.

To make it work you just have to give a DataTable for data to be displayed and you have to set some Properties of DataList.

Properties

To use this control as per your requirement set these properties...

1. Columns -- you can opetionaly tell how many columns wil be there in your datatable.

2. sortingColumns -- on which columns you need sorting functionality

3. sortingState -- initially which state will be there for sorting for column like ASC or DSEC

4. columnWidths -- you can specify width of each columns..

5. sortingUpImage -- you can give image for sorting as DESC order..

6. sortingDownImage -- you can give image for sorting as ASC order..

7. tableBorder -- you can give border width of your datalist

8. cellAlign -- Alignment of cells..

9. headerCSSClass -- CSS for Header of DataList..

10. ItemRowStyle -- CSS for Item Template...

11. AlterItemRowStyle -- CSS for AlterItem Template...

12. AddSerialNo -- set true if you want serial number as first column...

13. PageSize -- set rows number that will be displayed as page count rows...

Using the code

To use this code just add reference of this DLL file attached with this article.

In your code you have to just set some properties of this control, like given in this sample code, and you have to give DataTable which is containing your data to be displayed in datalist.

first add this lines into web.config...

//in web.config file add these lines...

 <pages>
   <controls>
    <add namespace="MyDataList" assembly="MyDataListControl" 
        tagPrefix="myDL" />
   </controls>
 </pages>
 
//write this where you want to put this custome DataList...
<myDL:myControl1 runat="server" /> 

//now you can set some properties of control like,
 dtContact = dSet.Tables["Contact"];
                if (dtContact != null)
                {
                    datalistTest.Columns = dtContact.Columns.Count;
                    datalistTest.dataTable = dtContact;
                    datalistTest.tableBorder = 1;                    
                    datalistTest.cellAlign = "left";

                    bool[] sortColumns = new bool[dtContact.Columns.Count];
                    int[] sortState = new int[dtContact.Columns.Count];
                    int[] columnwidths = new int[dtContact.Columns.Count];
                    for (int i = 0; i < dtContact.Columns.Count; i++)
                    {                                                   
                        sortColumns[i] = true;                       

                        if (i == 0)
                             columnwidths[i] = 60;
                        else
                             columnwidths[i] = 100;

                        if(i==1)
                            sortState[i] = 1; //for down image..
                        else
                            sortState[i] = 2; // for up image...
                    }
                    datalistTest.sortingColumns = sortColumns;
                    datalistTest.sortingState = sortState;
                    datalistTest.columnWidths = columnwidths;

                    datalistTest.AlterItemRowStyle = "Alternate";
                    datalistTest.headerCSSClass = "GridHeader";

If you can not understand how to use this then ask me i will explain you, this control is still in under construnction for better functionality.

History

Assembly version 1.0.0.0