Alignment problem in table with comboboxes
Hi Experts,
I have a table with several lines, of which 2 lines have actual content (others are space holders):
line 1 has 3 rows (2 with a combo box and 1 with an info button)
line 2 has 1 row > colspan 3 (with 1 gridview)
When I select a value in the first combobox the second appears. However as shown in screenshot 2 it is not aligned right next to the first combobox. Hope someone can tell me what I need to do to get the alignment correct.
I added the aspx code below.
Regards, MB
I have a table with several lines, of which 2 lines have actual content (others are space holders):
line 1 has 3 rows (2 with a combo box and 1 with an info button)
line 2 has 1 row > colspan 3 (with 1 gridview)
When I select a value in the first combobox the second appears. However as shown in screenshot 2 it is not aligned right next to the first combobox. Hope someone can tell me what I need to do to get the alignment correct.
I added the aspx code below.
Regards, MB
<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/VRS.Master" CodeBehind="VoyageStatistics.aspx.vb" Inherits="VRS.WebForm4" title="GR Vessel Reporting System" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<telerik:RadCodeBlock ID="RadCodeBlock" runat="server">
<script type="text/javascript">
function openRadWin()
{
radopen("InfoVoyageStatistics.html", "RadWindow");
}
</script>
</telerik:RadCodeBlock>
<telerik:RadWindowManager ID="RadWindowManager1"
IconUrl ="~/Images/icoInfo.ico"
Modal="true"
runat="server"
VisibleStatusbar="false"
Width="350"
Height="275"
Behaviors="Close">
<Windows>
<telerik:RadWindow
ID="RadWindow"
runat="server"
Showcontentduringload="false"
Title="Vessel performance">
</telerik:RadWindow>
</Windows>
</telerik:RadWindowManager>
<telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="cboSource">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="cboLoadPorts" />
<telerik:AjaxUpdatedControl ControlID="cboDischargingPorts" />
<telerik:AjaxUpdatedControl ControlID="rgvVoyageStatistics" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="cboDischargingPorts">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rcTechnical" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="rgvVoyageStatistics">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rgvVoyageStatistics" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManagerProxy>
<table style="width: 100%; height: 100%;">
<tr style="height: 10px">
<td>
<telerik:RadComboBox
ID="cboLoadPorts"
Runat="server"
AutoPostBack="true"
MarkFirstMatch="true"
AllowCustomText="false"
Width="200"
Height="500"
EmptyMessage="Select start leg">
<CollapseAnimation Type="OutQuint" Duration="200"> </CollapseAnimation>
</telerik:RadComboBox>
</td>
<td>
<telerik:RadComboBox
ID="cboDischargingPorts"
Runat="server"
AutoPostBack="true"
MarkFirstMatch="true"
AllowCustomText="false"
Width="200"
EmptyMessage="Select end leg">
<CollapseAnimation Type="OutQuint" Duration="200"> </CollapseAnimation>
</telerik:RadComboBox>
</td>
<td>
</td>
<td style="width: 30px">
<asp:ImageButton ID="ImageInfoButton"
runat="server"
ImageUrl = "~/Images/imgInfo.gif"
ImageAlign ="Middle"
OnClientClick="openRadWin(); return false;" />
</td>
</tr>
<tr style="height: 10px">
<td colspan="4">
</td>
</tr>
<tr>
<td colspan="4">
<telerik:RadGrid ID="rgvVoyageStatistics"
runat="server"
AutoGenerateColumns="False"
AllowSorting ="true"
GridLines="None">
<MasterTableView>
<Columns>
<telerik:GridBoundColumn
ItemStyle-Width="125"
HeaderStyle-Width="125"
DataField="Vessel"
DataType="System.String"
HeaderText="Vessel"
SortExpression="Vessel"
UniqueName="Vessel" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="Voyage"
DataType="System.Int16"
HeaderText="Voyage"
SortExpression="Voyage"
UniqueName="Voyage" />
<telerik:GridBoundColumn
ItemStyle-Width="100"
HeaderStyle-Width="100"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="CargoType"
DataType="System.String"
HeaderText="Cargo type"
SortExpression="CargoType"
UniqueName="CargoType" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="CargoOnBoard"
HeaderText="Cargo tonnage"
DataFormatString="{0:N0}"
SortExpression="CargoOnBoard"
UniqueName="CargoOnBoard" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="AvgSpeed"
HeaderText="Agv speed"
DataFormatString="{0:N1}"
SortExpression="AvgSpeed"
UniqueName="AvgSpeed" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="AvgConsHFO"
HeaderText="Avg HFO cons"
DataFormatString="{0:N1}"
SortExpression="AvgConsHFO"
UniqueName="AvgConsHFO" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="AvgConsMDO"
HeaderText="Avg MDO cons"
DataFormatString="{0:N1}"
SortExpression="AvgConsMDO"
UniqueName="AvgConsMDO" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="AvgSpecCons"
HeaderText="Avg spec cons"
DataFormatString="{0:N1}"
SortExpression="AvgSpecCons"
UniqueName="AvgSpecCons" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="AvgSystemOilPerDay"
HeaderText="Avg system oil cons"
DataFormatString="{0:N1}"
SortExpression="AvgSystemOilPerDay"
UniqueName="AvgSystemOilPerDay" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="AvgCylinderOilPerDay"
HeaderText="Avg cylinder oil cons"
DataFormatString="{0:N1}"
SortExpression="AvgCylinderOilPerDay"
UniqueName="AvgCylinderOilPerDay" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="DaysSteaming"
HeaderText="Days steaming"
DataFormatString="{0:N1}"
SortExpression="DaysSteaming"
UniqueName="DaysSteaming" />
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="Distance"
HeaderText="Distance"
DataFormatString="{0:N0}"
SortExpression="Distance"
UniqueName="Distance"/>
<telerik:GridBoundColumn
ItemStyle-Width="75"
HeaderStyle-Width="75"
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="DepartureDate"
HeaderText="ATD"
DataFormatString="{0:dd/MM/yyyy}"
SortExpression="DepartureDate"
UniqueName="DepartureDate"/>
<telerik:GridBoundColumn
ItemStyle-HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center"
DataField="Season"
SortExpression="DepartureDate"
DataType="System.String"
HeaderText="Season"
UniqueName="Season"/>
</Columns>
</MasterTableView>
</telerik:RadGrid>
</td>
</tr>
</table>
</asp:Content>
ASKER
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks a lot! I have been fighting with this for quite some time and this is a perfect solution. Regards, Mark
I believe that we're missing the screen shots that you are referring to.