I've got an ASP.Net project with C# and have a Repeater Control on an aspx page that builds up an html table by iterating over a datasource. I want to use the JQuery Flexigrid plug-in to make the table scrollable, but have been unable to figure out how to make it work due to lack of documentation on the plug-in. Does anyone know how to do this, or have sample code to share?
I have never used Flexigrid myself however after looking at the samples on the site I'll offer my suggestions.
It looks like what you need to create with your repeater is a properly formatted html table with at least a thead and tbody section.
<table id="mytable">
<thead>
<tr>
<th>header1</th>
<th>header2</th>
</tr>
</thead>
<tbody>
<tr>
<td>table data 1</td>
<td>table data 2</td>
<tr>
</tbody>
</table>
Once done, making a simple call to the following should create the Flexigrid table with the default settings:
$("#mytable").flexigrid();
From there you can pass in what looks to be a ton of options to make it look as pretty as you want.
As for the repeater itself, there are a bunch of ways to set it up depending on what you need. Probably the simplest way is as follows:
<table>
<thead>
<tr>
<th><asp:label id="header1" runat="server"></asp:label></th>
<th><asp:label id="header2" runat="server"></asp:label></th>
</tr>
</thead>
<tbody>
<asp:repeater id="myrepeater" runat="server" OnItemDataBound="myrepeater_ItemDataBound">
<ItemTemplate>
<tr>
<td><asp:label id="data1" runat="server"></asp:label></td>
<td><asp:label id="data2" runat="server"></asp:label></td>
</tr>
</ItemTemplate>
</asp:repeater>
</tbody>
</table>
And your data bind event would look something like this:
public void myrepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
myDataObject = e.Item.DataItem;
Label data1 = e.Item.FindControl("data1");
Label data2 = e.Item.FindControl("data2");
data1.Text = myDataObject.data1;
data2.Text = myDataObject.data2;
}
Don't try to reference the table by id
, you're better off using a class to identify the table. If you look at the page source you'll see that the table id isn't mytable
- it's mangled by ASP.NET depending on your page structure.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.