在文本框中添加一个DropdownList和按钮 [英] Add a DropdownList and Button inside Textbox

问题描述

可以在文本框内放置一个下拉列表和按钮. Actullay我正在设计搜索选项，但无法像 www.amazon.com [ www.amazon.com [ ^ ]中有一个用于搜索项目的文本框，按钮和下拉列表.我想这样设计.请帮助我...

It is possible to take a Dropdownlist and Button inside a Textbox. Actullay i am making a design for search option but i am not able to design as like a www.amazon.com[^] search option.

Please see the website www.amazon.com[^] there is a textbox,button and dropdownlist for search items. I want to design like that.Please help me...

推荐答案

raju ...


无法在文本框中使用下拉列表和按钮.在www.amazon.com中，他们将dropdownlist，textbox，button放在一个"tr"中，每个都由"td"分隔.

谢谢与问候
asp.net中的Sandeep

hi raju...


It is not possible to take dropdownlist and button inside the textbox. In www.amazon.com they are tacking dropdownlist,textbox,button in one "tr" and each one is seperated bye "td" .

Thanks&Regards
Sandeep

文本框不是容器控件，因此不可能在文本框内放置下拉列表.这些列表是分开的，您会看到所有控件都在一个div中.


参见下面的部分代码

textbox in asp.net not a container control so it is not possible that dropdown list inside a textbox.these are separate you see there is all control is in single div.


see below part of code

<div>
         <form>
            action=''/s/ref=nb_sb_noss''
            method=''get'' name=''site-search''
            class=''nav-searchbar-inner''
          >

            <span id="nav-search-in" class="nav-sprite">
              <span id="nav-search-in-content" data-value="search-alias=aps">
                All
              </span>
              <span class="nav-down-arrow nav-sprite"></span>
              <select name="url" id="searchDropdownBox" class="searchSelect" title="Search in"><option value="search-alias=aps" selected="selected">All Departments</option><option value="search-alias=instant-video">Amazon Instant Video</option><option value="search-alias=appliances">Appliances</option><option value="search-alias=mobile-apps">Apps for Android

</option><option value="search-alias=arts-crafts">Arts, Crafts & Sewing</option><option value="search-alias=automotive">Automotive</option><option value="search-alias=baby-products">Baby</option><option value="search-alias=beauty">Beauty</option><option value="search-alias=stripbooks">Books</option><option value="search-alias=mobile">Cell Phones & Accessories</option><option value="search-alias=apparel">Clothing & Accessories</option><option value="search-alias=collectibles">Collectibles</option><option value="search-alias=computers">Computers</option><option value="search-alias=electronics">Electronics</option><option value="search-alias=gift-cards">Gift Cards</option><option value="search-alias=grocery">Grocery & Gourmet Food</option><option value="search-alias=hpc">Health & Personal Care</option><option value="search-alias=garden">Home & Kitchen</option><option value="search-alias=industrial">Industrial & Scientific</option><option value="search-alias=jewelry">Jewelry</option><option value="search-alias=digital-text">Kindle Store</option><option value="search-alias=magazines">Magazine Subscriptions</option><option value="search-alias=movies-tv">Movies & TV</option><option value="search-alias=digital-music">MP3 Downloads</option><option value="search-alias=popular">Music</option><option value="search-alias=mi">Musical Instruments</option><option value="search-alias=office-products">Office Products</option><option value="search-alias=lawngarden">Patio, Lawn & Garden</option><option value="search-alias=pets">Pet Supplies</option><option value="search-alias=shoes">Shoes</option><option value="search-alias=software">Software</option><option value="search-alias=sporting">Sports & Outdoors</option><option value="search-alias=tools">Tools & Home Improvement</option><option value="search-alias=toys-and-games">Toys & Games</option><option value="search-alias=videogames">Video Games</option><option value="search-alias=watches">Watches</option></select>
            </span>

            <div class="nav-searchfield-outer nav-sprite">
              <div class="nav-searchfield-inner nav-sprite">
                <div class="nav-searchfield-width">
                  <div id="nav-iss-attach">
                    <input type="text" id="twotabsearchtextbox" title="Search For" value="" name="field-keywords" autocomplete="off">
                  </input></div>
                </div>
                <!--[if IE ]><div class=''nav-ie-min-width'' style=''width: 360px''></div><![endif]-->
              </div>
            </div>

            <div class="nav-submit-button nav-sprite">
              <input>
                type=''submit''
                value=''Go''
                class=''nav-submit-input''
                title=''Go''
              >
            </input></div>

          </form>
        </div>

它们在文本框中没有下拉菜单和按钮.它们具有三个单独的控件，使它们看起来像一个.您可以使用适当的设计布局和CSS样式来做到这一点.
它更像是Usercontrol.您可以实现相同的目的.

这是渲染方式的整体设计:

They are not having a dropdown and button in a textbox. They have three separate controls that are made look like one. You can do it using proper design layout and CSS style.
It''s more of a Usercontrol. You can achieve the same.

Here is the whole design of how it is rendered:

<span id='nav-search-in' class='nav-sprite'>
              <span id='nav-search-in-content' data-value="search-alias=aps">
                All
              </span>
              <span class='nav-down-arrow nav-sprite'></span>
              <select name="url" id="searchDropdownBox" class="searchSelect" title="Search in"   ><option value="search-alias=aps" selected="selected">All Departments</option></select>
            </span>

            <div class='nav-searchfield-outer nav-sprite'>
              <div class='nav-searchfield-inner nav-sprite'>
                <div class='nav-searchfield-width'>
                  <div id='nav-iss-attach'>
                    <input type='text' id='twotabsearchtextbox' title='Search For' value='' name='field-keywords' autocomplete='off'>
                  </div>
                </div>
                <!--[if IE ]><div class='nav-ie-min-width' style='width: 360px'></div><![endif]-->
              </div>
            </div>

            <div class='nav-submit-button nav-sprite'>
              <input

                type='submit'

                value='Go'

                class='nav-submit-input'

                title='Go'

              >
            </div>

这篇关于在文本框中添加一个DropdownList和按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！