6

Simple question regarding table(single column in this case) population. As much as it may seem like an easy question, I've never been involved in the front-end area, so here it goes.

The layout is 2 columns and 8 rows. Something like.

Name        A
LastName    B
Age         C
BirthDate   D
...

Column 1 are stable, "titles" if you want, that won't change.

A,B,C,D are the result of querys to a database. So, options I can think of are:

  1. Draw a 2Column - 8Row table and place TextBoxes in A,B,C,D... fields. So later on they can be populated with the results of the query (This option is not the most "beautiful" one since TextBoxes alter the design intented to be absorved by the whole page using .CSS files.

  2. Set a datagrid. The problem here I think is that some of the A,B,C,D fields will have to be changed for later query-usage. And I'm not sure if Datagrids are ment for that.

Is there a "good-way" for me to solve this issue? Thanks in advance.

EDIT.

A,B,C,D data is held in a DataSet.

3
  • 1
    Visual Studio is an IDE that is used with many languages - which one are you talking about? A table in what? How do you intent to query it?
    – Oded
    Aug 13, 2012 at 13:55
  • @Oded it's a C#/aspx project. DB is SQL. Data coming from SQL to be placed in A,B,C,D... is in a DataSet.
    – Daniel Sh.
    Aug 13, 2012 at 13:58
  • aspx... WebForms or MVC?
    – Oded
    Aug 13, 2012 at 13:58

2 Answers 2

10

To me, the way you're describing the data doesn't really lend itself too well for a DataGrid. This control works best for data that you plan to display in a standard tabular style, where the column names go across the top and then you display the row(s) of values underneath. It's also a little unclear to me if you are intending to bind one or many instances of your Object (which I will just call Person for now) to the UI.

Let's go ahead and define that object:

public class Person {
    public String Name { get; set; }
    public String LastName { get; set; }
    public int Age { get; set; }
    public DateTime BirthDate { get; set; }
}

To bind a single instance of Person to your UI, a simple HTML table should work fine. I'm using TextBoxes to display the values here, but if you don't need to edit them then just use Labels instead.

<table>
    <tr><td>Name:</td><td><asp:TextBox ID="txtName" runat="server" /></td></tr>
    <tr><td>Last Name:</td><td><asp:TextBox ID="txtLastName" runat="server" /></td></tr>
    <tr><td>Age:</td><td><asp:TextBox ID="txtAge" runat="server" /></td></tr>
    <tr><td>Birthdate:</td><td><asp:TextBox ID="txtBirthDate" runat="server" /></td></tr>                  
</table>  

It's pretty trivial at this point to bind the properties from Person to their respective controls on the page using the code-behind.

If you wanted to use this same layout to display multiple instances of Person on a page, go with the ASP.net Repeater. The markup for this would look more like:

 <asp:Repeater ID="repPeople" runat="server">
    <ItemTemplate>
        <table>
            <tr><td>Name:</td><td><asp:TextBox ID="txtName" runat="server" Text='<%# Eval("Name") %>' /></td></tr>
            <tr><td>Last Name:</td><td><asp:TextBox ID="txtLastName" runat="server" Text='<%# Eval("LastName") %>' /></td></tr>
            <tr><td>Age:</td><td><asp:TextBox ID="txtAge" runat="server" Text='<%# Eval("Age") %>' /></td></tr>
            <tr><td>Birthdate:</td><td><asp:TextBox ID="txtBirthDate" runat="server" Text='<%# String.Format("{0:d}", Eval("BirthDate")) %>' /></td></tr>                  
        </table>                
    </ItemTemplate>
</asp:Repeater>

In the code-behind, you just bind a collection of Person to the DataSource property on the Repeater:

protected void Page_Load(object sender, EventArgs e) {

    // A simple example using Page_Load
    List<Person> people = new List<Person>();
    for (int i = 0; i < 10; i++) {
        people.Add(new Person() {Name = "Test", Age = 10, BirthDate=DateTime.Now, LastName = "Test"});
    }

    if (!IsPostBack) {
        repPeople.DataSource = people;
        repPeople.DataBind();
    }

}

Note: You could accomplish a similar layout using CSS instead of tables, however the same principles apply between binding a single vs multiple objects. Just replace the table layout in this example with whatever markup you ultimately define.

1
  • thanks Mike! it will be just one Person and yes it's an object as you assumed. Think I can use labels for cells that won't change, and TextBoxes for cells that users are able to modify while they're working on the page.
    – Daniel Sh.
    Aug 13, 2012 at 15:19
1

There's a table control in WebForms that you should be able to populate from a DataSet see the MSDN docs: http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.table.aspx

1
  • 2nd example on the link you propose seems like a good way to fill the data programmatically. Then I should be able to read back the data changed by users for query usage. Thanks for the insight.
    – Daniel Sh.
    Aug 13, 2012 at 14:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.