Board index » Web Programming » HTML formatting question in datagrid pager area.

HTML formatting question in datagrid pager area.

Web Programming435
I know it's dumb ... sometimes frustrating



I want the text and a dropdownlist align with both side of a table cell,

i.e. text align left and dropdownlist align right. I cannot add more cells to

do format because it's in a Datagrid pager area. The html code generated for

pager is one sigle cell with lots of colspan.



I tried to add some html elements in between text and dropdownlist, for

example table iframe and p but I cannot achieve the exact result.



<td colspan="3">1 2 3 4 5 6 <nobr><iframe width="70%" height="0"

style="display:inline"></iframe>

<select>

<option selected="selected" value="10">10</option>

<option value="25">25</option>

<option value="50">50</option>

</select></nobr></td>



Any help?



BTW my last question about adding dropdownlist to pager works fine. Thanks

the reply.


-
 

Re:HTML formatting question in datagrid pager area.

Hi,



I think you have to control the column spans yourself. So, wipe out the

spans and insert your own cells. Here's the idea in code with comment

inline. Let us know if this helps?



Ken

Microsoft MVP [ASP.NET]



Private Sub Page_Load _

(ByVal sender As System.Object, _

ByVal e As System.EventArgs) _

Handles MyBase.Load

DataGrid1.AllowPaging = True

DataGrid1.PageSize = 3

If Not IsPostBack Then

DataGrid1.DataSource = CreateDataSource()

DataGrid1.DataBind()

End If

End Sub

Private Sub DataGrid1_ItemCreated _

(ByVal sender As Object, ByVal e As _

DataGridItemEventArgs) Handles DataGrid1.ItemCreated

' Insert text and ddl columns in the pager cell

' by Ken Cox - Microsoft MVP [ASP.NET]



' Check that we are dealing with the pager row

If e.Item.ItemType = ListItemType.Pager Then



' declare the variables we'll need

Dim lstItem As DataGridItem

Dim cmbBox As New DropDownList

Dim txtcell As New TableCell

Dim cmbcell As New TableCell

Dim oldcell As New TableCell

' Get a reference to the datagrid item (row)

lstItem = e.Item

' Get a reference to the current pager cell

oldcell = e.Item.Cells(0)

' Set the current pager cell to span two columns

oldcell.ColumnSpan = 2

' Align the pager elements to the centre

oldcell.HorizontalAlign = HorizontalAlign.Center

' Clear out existing cells in the pager

lstItem.Cells.Clear()

' Put some text in the text cell

txtcell.Text = "Text Here"



' Create a dropdownlist box and add some items

cmbBox.Items.Add("Red")

cmbBox.Items.Add("Green")

' Add the ddl to the controls collection

' of the cell

cmbcell.Controls.Add(cmbBox)

cmbcell.ColumnSpan = 1

' Set the cell alignment to right

cmbcell.HorizontalAlign = HorizontalAlign.Right



' Add the text cell to the datagrid item's Cells collection

lstItem.Cells.Add(txtcell)

' Add the original item to the Cells collection

lstItem.Cells.Add(oldcell)

' Add the cell with the ddl to the collection

lstItem.Cells.Add(cmbcell)



End If

End Sub





Function CreateDataSource() As ICollection

Dim dt As New DataTable

Dim dr As DataRow

dt.Columns.Add(New DataColumn _

("IntegerValue", GetType(Int32)))

dt.Columns.Add(New DataColumn _

("StringValue", GetType(String)))

dt.Columns.Add(New DataColumn _

("PercentValue", GetType(Double)))

dt.Columns.Add _

(New DataColumn("Boolean", GetType(Boolean)))

Dim i As Integer

For i = 0 To 8

dr = dt.NewRow()

dr(0) = i

dr(1) = "Item " + i.ToString()

dr(2) = 0.23 * (i + 1)

dr(3) = True

dt.Rows.Add(dr)

Next i

Dim dv As New DataView(dt)

Return dv

End Function 'CreateDataSource



<asp:datagrid id="DataGrid1" runat="server"></asp:datagrid>







"strout" <strout@discussions.microsoft.com>wrote in message

Quote
I know it's dumb ... sometimes frustrating



I want the text and a dropdownlist align with both side of a table cell,

i.e. text align left and dropdownlist align right. I cannot add more cells

to

do format because it's in a Datagrid pager area. The html code generated

for

pager is one sigle cell with lots of colspan.



I tried to add some html elements in between text and dropdownlist, for

example table iframe and p but I cannot achieve the exact result.



<td colspan="3">1 2 3 4 5 6 <nobr><iframe width="70%" height="0"

style="display:inline"></iframe>

<select>

<option selected="selected" value="10">10</option>

<option value="25">25</option>

<option value="50">50</option>

</select></nobr></td>



Any help?



BTW my last question about adding dropdownlist to pager works fine. Thanks

the reply.



-