[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 600
  • Last Modified:

Formview ItemTemplate formatting/editing help

Hi all--  I'm having some trouble with formatting a simple item template within a formview control.  It seems that what I see in the design window is not exactly what I want to see when the website runs.  I'm new to ASP .Net so there's likely something simple I have yet to realize...

Basically all I want to do at this point is to format a nice simple table (4 columns, 10 rows) to display Labels & checkboxes:

Label1   chkbox1     Label2   chkbox2
Label3   chkbox3     Lable4   chkbox4
etc. etc.

I insert the table right justify columns and TRY to get the label columns a uniform size (say 500px) and the checkbox columns a uniform size (say 15 px).  No matter how hard I seem to try I can't seem to get the table to format correctly--resizing columns, typing in the HTML etc.  I've attached my latest attempt below--which seems to have the label columns correct but one checkbox column is much larger than the other.

So my question(s) is:  

1.) What am I doing wrong? (Are there tools I'm not utilizing to help with this?)
2.) Once I get a template to look like I want, can I easily copy it to the other templates (Insert/Update)

<ItemTemplate>
                <asp:Label ID="iUserIDLabel" runat="server" Text='<%# Eval("iUserID") %>' style="position: relative; top: 0px" Visible="False"></asp:Label><br />
                <table border="3" style="width: 100%; position: relative; height: 35%">
                    <tr>
                        <td style="width: 100px">
                            User Name:
                        </td>
                        <td style="width: 100px">
                <asp:Label ID="RiskConsultantsLabel" runat="server" Text='<%# Bind("RiskConsultants") %>' style="position: relative">
                </asp:Label></td>
                        <td style="width: 100px">
                            Email:</td>
                        <td style="width: 100px">
                <asp:Label ID="EmailLabel" runat="server" Text='<%# Bind("Email") %>' style="position: relative"></asp:Label></td>
                    </tr>
                    <tr>
                        <td style="width: 100px">
                            Sagitta Alias:
                        </td>
                        <td style="width: 100px">
                <asp:Label ID="AliasLabel" runat="server" Text='<%# Bind("Alias") %>' style="position: relative"></asp:Label></td>
                        <td style="width: 100px">
                            Office:</td>
                        <td style="width: 100px">
                <asp:Label ID="OfficeLabel" runat="server" Text='<%# Bind("Office") %>' style="position: relative"></asp:Label></td>
                    </tr>
                </table>
                &nbsp;<br />
                <span style="text-decoration: underline">Permissions:<br />
                </span>
                <table border="3" style="background-image: none; width: 1030px; position: static;
                    height: 35px; background-color: transparent">
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            Producer:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="ProducerCheckBox" runat="server" Checked='<%# Bind("Producer") %>'
                    Enabled="false" style="position: relative" OnCheckedChanged="ProducerCheckBox_CheckedChanged" Width="192px" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            PAM Trainee:</td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="PAMTraineeCheckBox" runat="server" Checked='<%# Bind("PAMTrainee") %>'
                    Enabled="false" style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            AE:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="AECheckBox" runat="server" Checked='<%# Bind("AE") %>' Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Surety:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SuretyCheckBox" runat="server" Checked='<%# Bind("Surety") %>'
                    Enabled="false" style="left: 0px; position: relative; top: 0px" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            SAM:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SAMCheckBox" runat="server" Checked='<%# Bind("SAM") %>' Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Environmental:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="EnvironmentalCheckBox" runat="server" Checked='<%# Bind("Environmental") %>'
                    Enabled="false" style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            PAM:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="PAMCheckBox" runat="server" Checked='<%# Bind("PAM") %>' Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Financial Services:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="FinancialServicesCheckBox" runat="server" Checked='<%# Bind("FinancialServices") %>'
                    Enabled="false" style="left: 0px; position: relative; top: 0px" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            AR:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="ARCheckBox" runat="server" Checked='<%# Bind("AR") %>' Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Subguard:</td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SubguardCheckBox" runat="server" Checked='<%# Bind("Subguard") %>'
                    Enabled="false" style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            Marketing/VP:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="MarketingVPCheckBox" runat="server" Checked='<%# Bind("MarketingVP") %>'
                    Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Subguard AE:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SubguardAECheckBox" runat="server" Checked='<%# Bind("SubguardAE") %>'
                    Enabled="false" style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            Contract Admin:</td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="ContractAdminCheckBox" runat="server" Checked='<%# Bind("ContractAdmin") %>'
                    Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Subguard Serv:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SubguardServCheckBox" runat="server" Checked='<%# Bind("SubguardServ") %>'
                    Enabled="false" style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            Risk Control:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="RiskControlCheckBox" runat="server" Checked='<%# Bind("RiskControl") %>'
                    Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Subguard AR:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SubguardARCheckBox" runat="server" Checked='<%# Bind("SubguardAR") %>'
                    Enabled="false" style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            Claims:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="ClaimsCheckBox" runat="server" Checked='<%# Bind("Claims") %>'
                    Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Subguard RM:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="SubguardRMCheckBox" runat="server" Checked='<%# Bind("SubguardRM") %>'
                    Enabled="false" style="left: 0px; position: relative; top: 0px" /></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 500px; height: 35px">
                            Risk Mgmt
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="RiskManagementCheckBox" runat="server" Checked='<%# Bind("RiskManagement") %>'
                    Enabled="false" style="position: relative" /></td>
                        <td align="right" style="width: 500px; height: 35px">
                            Construction:
                        </td>
                        <td style="width: 15px; height: 35px">
                <asp:CheckBox ID="ConstructionCheckBox" runat="server" Checked='<%# Bind("Construction") %>'
                    Enabled="false" style="left: 0px; position: relative; top: 0px" /></td>
                    </tr>
                </table>
                <br />
                <br />
                <asp:LinkButton ID="EditButton" runat="server" CausesValidation="False" CommandName="Edit"
                    Text="Edit">
                </asp:LinkButton>
                <asp:LinkButton ID="DeleteButton" runat="server" CausesValidation="False" CommandName="Delete"
                    Text="Delete">
                </asp:LinkButton>
                <asp:LinkButton ID="NewButton" runat="server" CausesValidation="False" CommandName="New"
                    Text="New">
                </asp:LinkButton>
            </ItemTemplate>

Open in new window

0
rz1224
Asked:
rz1224
  • 2
  • 2
1 Solution
 
Albert Van HalenAnalyst developerCommented:
Try it with the table-layout style property set to fixed
<table border="3" style="width: 100%; table-layout:fixed; position: relative; height: 35%">

Open in new window

0
 
rz1224Author Commented:
Thanks Albert--it was as simple as that...  You got the points but can you also let me know if/how I can copy that to the other templates?  Is it as simple as cutting pasting appropriately in the html?
0
 
Albert Van HalenAnalyst developerCommented:
If there's some structural logic in there; like the tables are in a div or something with some classname, you could create a style rule in your css. (see code snippet)
Otherwise it's gonna be copying and pasting...
DIV.someClassName TABLE
{
    table-layout: fixed;
}

Open in new window

0
 
rz1224Author Commented:
Thanks Albert!
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now