How to wrap the DropDownList in the GridView FooterTemplate?

Question

Please help me to fix the issue with wrapping the text in asp.net GridView FooterTemplate.

I am alyready wrapping <ItemTemplate> and <EditItemTemplate> using the below command

<asp:TemplateField ItemStyle-Wrap="true"

but the same code is not working for the FooterTemplate.

Please see the below code

<asp:TemplateField ItemStyle-Width="120px"   HeaderText="Bureau" ItemStyle-Wrap="true">
    <ItemTemplate>
        <asp:Label ID="lblBureau" runat="server" Text = '<%# Eval("Bureau_Ref_Type")%>'
            ></asp:Label>

    </ItemTemplate>

    <EditItemTemplate>
         <asp:Label ID="lblBureauEdit" runat="server" Visible="false" Text = '<%# Eval("Bureau_Ref_Id")%>'></asp:Label>
        <asp:DropDownList ID="ddlBureauEdit" runat="server">
       </asp:DropDownList>

    </EditItemTemplate>
    <FooterTemplate>
        <asp:DropDownList ID="ddlBureauFooter" runat="server">
       </asp:DropDownList>

     </FooterTemplate>
    </asp:TemplateField>

If i reduce the size in the FooterTemplate Dropdowlist items text page seems to fit in 1024 px resolution,but our client wants the same resolution with out reducing the Item text size. So i need all experts to help wrapping the items in the FooterTemplate.

Thanks Sam

Josh Darnell · Accepted Answer · 2014-01-16T14:35:49.047

0

You need to use the FooterStyle to style that section. Your ItemStyle settings only apply to actual data items (not footers or headers).

You could rewrite the first section of your markup like this:

<asp:TemplateField HeaderText="Bureau">
    <ItemStyle Width="120px" Wrap="true"></ItemStyle>
    <FooterStyle Wrap="true"></FooterStyle>
    <ItemTemplate>
    ...

Notice that I moved your ItemStyle settings into the <ItemStyle> settings block, as well as adding the <FooterStyle> settings block.

edited Jan 16 '14 at 14:35

answered Jan 16 '14 at 14:30

Josh Darnell

11,304
9
38
66

Jadarnel27,Thnak you so much for the reply ,but after setting up the Footer Style Wrap also text in the drop down is not getting Warped so that my asp.net grid view is overflowing on my Div and looking different on the screen. Please see the below updated code. – Sambasiva Jan 16 '14 at 16:12
@Sambasiva Sorry to hear you're still having trouble. What browser are you using where the DropDownList is overflowing? Also, is it overflowing horizontally, I assume? Does it only overflow when you expand it, or is it overflowing the whole time? – Josh Darnell Jan 16 '14 at 16:25
Thank you for the quick reply. I am using IE 10.0, yes dropdown list in the asp.net grid view Footer template overflowing horizontally because of the items text is too long. Drop down list is expanding all the time( I mean when page loads ,data loads to Dropdown so it is expanding all the time). The expansion of the dropdown list causing Template Field overflow from its item Style-width, so grid view also overflowing from 1024px. My main questions is in a dropdown list is there any way we can wrap the text into 2 lines (I know trimming the items data when loading the dropdown) – Sambasiva Jan 16 '14 at 16:32
@Sambasiva Oh, I understand your problem now. Unfortunately, you cannot wrap the text of DropDownList items. There are a number of workaround options on Stack Overflow / etc, most involve using a custom control (don't know if this will work for your situation), or JavaScript. See this Stack Overflow post: [How can I build a ` – Josh Darnell Jan 16 '14 at 17:04
1

Jadarnel27, Thank you for quick response and also thank you for pointing me in the right direction. Looks like Jquery UI selectmenu widget will solve the problem to my situation. http://stackoverflow.com/questions/15368502/how-can-i-build-a-select-with-multiline-option Jquery UI selectmenu widget https://github.com/fnagel/jquery-ui/wiki/Selectmenu – Sambasiva Jan 16 '14 at 18:45

How to wrap the DropDownList in the GridView FooterTemplate?

1 Answers1