This is a migrated thread and some comments may be shown as answers.

display inline for ComboxBox

8 Answers 381 Views

ComboBox

This is a migrated thread and some comments may be shown as answers.

MNP asked on 18 Oct 2008, 04:38 PM

I'm not sure what I did, but originally this was working and I didn't update any controls.

I have a RadComboBox and then a button right beside it. For whatever reason now it's displaying below the combo box when I want it to show right beside it. Looking at the generated html it's putting a display:block around the input control (internally I'm guessing)

    
            <div id="ctl00_ctl00_ContentPlaceHolder1_MainArea_ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTagsPanel" style="display: block;"> 
        
            </div> 
        
            <input id="ctl00_ctl00_ContentPlaceHolder1_MainArea_btnAddTag" class="button" type="button" onclick="javascript:__doPostBack('ctl00$ctl00$ContentPlaceHolder1$MainArea$btnAddTag','')" value="Add" name="ctl00$ctl00$ContentPlaceHolder1$MainArea$btnAddTag"/>

Is there a property I can set in order to get this to display:inline? What would I need to do to overwrite this setting?

THanks

-Matt

8 Answers, 1 is accepted

answered on 20 Oct 2008, 12:30 PM

    
              <telerik:RadComboBox ID="cmbTags" runat="server" Skin="WebBlue" AllowCustomText="True"  
        
                              EnableLoadOnDemand="True" LoadingMessage="Searching for tags..."  
        
                              ShowDropDownOnTextboxClick="False" Width="190px"  
        
                              EmptyMessage="" ShowMoreResultsBox="True"  
        
                              ShowToggleImage="False" AutoPostBack="false" MarkFirstMatch="False" NoWrap="True"> 
        
                           <CollapseAnimation Type="OutBounce" Duration="200"></CollapseAnimation> 
        
                        </telerik:RadComboBox> 
        
                           <asp:Button ID="btnAddTag" runat="server" Text="Add" CssClass="button" />

Like I said before. I swear I didn't change anything and then at one point it just moved down to the next line.

answered on 23 Oct 2008, 12:53 PM

ComboBoxDisplay.zip

Hello Matt,

Thank you for providing the code.

I used it in a blank page to check the display of the ComboBox and it looked normally (see the attached page).

Is there any CSS on your page that may be causing the wrong display on your end?

Sincerely yours,
Simon
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

answered on 23 Oct 2008, 03:43 PM

Thanks for your help.

I duplicated my ComboBox in the same webpage (so I now have 2) and now one works and one doesn't. If you look at the HTML below it seems to be wrapping the one RadComboBox with a cmbTagsPanel (of which I don't have declarated)

    
            <div id="ctl00_ctl00_ContentPlaceHolder1_MainArea_pnlAddTag"> 
        
            <div id="ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTags2" class="RadComboBox RadComboBox_WebBlue" style="width: 190px; display: -moz-inline-stack;"> 
        
            </div> 
        
            <input id="ctl00_ctl00_ContentPlaceHolder1_MainArea_Button1" class="button" type="button" onclick="javascript:__doPostBack('ctl00$ctl00$ContentPlaceHolder1$MainArea$Button1','')" value="Add" name="ctl00$ctl00$ContentPlaceHolder1$MainArea$Button1"/> 
        
            <br/> 
        
            <div id="ctl00_ctl00_ContentPlaceHolder1_MainArea_ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTagsPanel" style="display: block;"> 
        
            <div id="ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTags" class="RadComboBox RadComboBox_WebBlue" style="width: 190px; display: -moz-inline-stack;"> 
        
            <table class="" cellspacing="0" cellpadding="0" border="0" style="border-width: 0pt;" summary="combobox"> 
        
            <tbody> 
        
            <tr> 
        
            <td class="rcbInputCell rcbInputCellLeft" style="width: 100%;"> 
        
            <input id="ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTags_Input" class="rcbInput" type="text" style="" value="" name="ctl00$ctl00$ContentPlaceHolder1$MainArea$cmbTags_Input" autocomplete="off"/> 
        
            </td> 
        
            <td class="rcbArrowCell rcbArrowCellRight rcbArrowCellHidden"> 
        
            </td> 
        
            </tr> 
        
            </tbody> 
        
            </table> 
        
            <div class="rcbSlide" style="z-index: 6000;"> 
        
            </div> 
        
            <input id="ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTags_ClientState" type="hidden" name="ctl00_ctl00_ContentPlaceHolder1_MainArea_cmbTags_ClientState" autocomplete="off" value="{"logEntries":[],"value":"","text":"","enabled":true}"/> 
        
            </div> 
        
            </div> 
        
            <input id="ctl00_ctl00_ContentPlaceHolder1_MainArea_btnAddTag" class="button" type="button" onclick="javascript:__doPostBack('ctl00$ctl00$ContentPlaceHolder1$MainArea$btnAddTag','')" value="Add" name="ctl00$ctl00$ContentPlaceHolder1$MainArea$btnAddTag"/> 
        
            </div>

However, if I rename the RadComboBox to cmbTags2 and change my code, everything works as it should.

Perhaps internally somewhere it was adding this new panel?