填充的dropdownList选中的值不是选择悬停值 [英] populated dropdownList selected value is not pick the hover value

查看：74 发布时间：2019/6/12 6:55:59 ASP.NET

本文介绍了填充的dropdownList选中的值不是选择悬停值的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

<pre lang="css">populated dropdownList selected value is not pick the hover value. Please anybody send any solutions and immediately, thank you

Default.aspx
                &lt;li class=&quot;form-line&quot; id=&quot;id_26&quot;&gt;
                    &amp;lt;label class=&quot;form-label-left&quot; id=&quot;ddProducts1&quot; for=&quot;input_26&quot;&gt;
                        Product
                    &amp;lt;/label&gt;
                &lt;div id=&quot;cid_26&quot; class=&quot;form-input&quot;&gt;           &lt;%--style=&quot;left:170px;top:100px;position:absolute&quot; class=&quot;dlist&quot; --%&gt;
                      &amp;lt;label class=&quot;dlist&quot;&gt;
                          &lt;asp:DropDownList ID=&quot;ddProducts&quot; CssClass=&quot;dropdown&quot; runat=&quot;server&quot; DataSourceID=&quot;sqlproducts&quot;
                                DataTextField=&quot;Product&quot; DataValueField=&quot;Product&quot;&gt;
                            &lt;/asp:DropDownList&gt;
                      &amp;lt;/label&gt;
                 &lt;asp:SqlDataSource ID=&quot;sqlproducts&quot; runat=&quot;server&quot; ConnectionString=&quot;&lt;%$ ConnectionStrings:pmdb %&gt;&quot;
                      SelectCommand=&quot;select 'Type product code' as 'Product' union all select stockCode as 'Product' from productCodes where stockcode like 'AV%' OR stockcode like 'SL%' &quot;&gt;
                 &lt;/asp:SqlDataSource&gt;
                &lt;/div&gt;
                &lt;/li&gt;


style.css

.dropdown{
     padding:0px;           /*-5px 0px 10px 0px;*/
     margin: 0;
    -webkit-border-radius: 4px #EFEFEF;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    background-color: #fff;
    /*color: #888;*/
    border: 1px solid #ccc;
    outline: none;
    display: inline-block;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    height: 30px;
}

.dropdown select option{
    padding:3px 5px;
    color:aqua;
    background-color:#ffd800;
         padding:-5px 0px 10px 0px;
}


.form-input .form-error-message, .form-input-wide .form-error-message{
    bottom:-5px;
    font-size:11px;
    position:relative;
    z-index:900;
    right:auto;
    top:auto;
    color:#333;
    padding:3px;
    max-width:100%;
    padding-bottom:3px;
    font-size:12px;
    border:none;
    -moz-box-shadow:0px 2px 4px rgba(102, 102, 102, 0.5);
    -webkit-box-shadow:0px 2px 4px rgba(102, 102, 102, 0.5);
    -moz-border-radius:6px 6px;
    -webkit-border-radius:6px 6px;
    box-shadow:0px 2px 4px rgba(102, 102, 102, 0.5);
    border-radius:6px 6px;
    background:#FFCCCC;
}

.form-line {
    clear:both;
    padding:10px;
    margin:0px;
    /* Changed display to block to prevent a bug in Chrome */
    display:block;
    width:97%;
    width:-moz-available;
    /* Removed this because it was changing the size of the migrated forms */
    /* border:1px solid transparent ; */
    position:relative;
}

.form-line-column{
    float:left;
    clear:none;
    width:auto;
    white-space:nowrap;
}
/* Added css rule below to retain display:inline-block for shrunken fields */
.form-line.form-line-column {
    display:inline-block;
}

.form-line-column-clear{
    clear:left;
    width:auto;
}

.dlist {
    position: relative;
}

    .dlist:after {
        /*content: '&gt;';*/
        font: 14px &quot;Consolas&quot;, monospace;
        color: #0081C7;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        right: 8px;
        top: -3px;
        border-bottom: 1px solid #ddd;
        position: absolute;
        pointer-events: none;
    }

    .dlist:before {
        /*content: '';*/
        right: 6px;
        top: -3px;
        width: 20px;
        height: 20px;
        background: #f8f8f8;
        position: absolute;
        pointer-events: none;
        display: block;
    }
.form-input {
   display:inline-block;
}</pre>

解决方案

ConnectionStrings：pmdb ％& gt;& quot;
SelectCommand =& quot; select 'Type product code' as 'Product' union all 选择 stockCode as 'Product'来自 productCodes 其中 stockcode 喜欢'AV％'或 stockcode 喜欢'SL％'& quot;& gt;
& lt; / asp：SqlDataSource& gt;
& lt; / div& gt;
& lt; / li& gt;

style 。 css

。下拉 {
padding ： 0px; / * - 5px 0px 10px 0px; * /
margin ： 0;
- webkit-border-radius ： 4px #EFEFEF;
- moz-border-radius ： 4px;
border-radius ： 4px;
- webkit-box-shadow ： 0 3px 0 #ccc，0 -1px #fff inset;
- moz-box-shadow ： 0 3px 0 #ccc，0 -1px #fff inset;
box-shadow ： 0 3px 0 #ccc，0 -1px #fff inset;
background-color ： #fff;
/ * 颜色：＃888; * /
border ： 1px solid #ccc;
outline ： none;
display ： inline-block;
- webkit-appearance ： none;
- moz-appearance ： none;
外观： none;
cursor ：指针;
height ： 30px;
}

。下拉选择选项 {
padding ： 3px 5px;
颜色： aqua;
background-color ：＃ffd800;
padding ： - 5px 0px 10px 0px;
}

。 form-input 。 form-error-message ,. form-input-wide 。 form-error-message {
bottom ： - 5px;
font-size ： 11px;
position ： relative;
z-index ： 900;
right ： auto;
top ： auto;
color ：＃333;
padding ： 3px;
max-width ： 100％;
padding-底部： 3px;
字体-SI ze ： 12px;
border ： none;
-moz-box-shadow ： 0px 2px 4px rgba（102,102,102,0.5）;
- webkit-box-shadow ： 0px 2px 4px rgba（102,102,102,0.5）;
- moz-border-radius ： 6px 6px;
- webkit-border-radius ： 6px 6px;
box-shadow ： 0px 2px 4px rgba（102,102,102,0.5）;
border-radius ： 6px 6px;
背景：＃FFCCCC;
}

。 form-line {
clear ： both;
padding ： 10px;
margin ： 0px;
/ * 将显示更改为阻止以防止Chrome中的错误* /
display ： block;
width ： 97％;
宽度： - moz-available;
/ * 已移除此项，因为它正在更改已迁移表单的大小* /
/ * border：1px solid transparent; * /
position ：相对;
}

。 form-line-column {
float ： left;
clear ： none;
width ： auto;
white-space ： nowrap;
}
/ * 在下面添加了css规则以保留display：inline-block for shrunken fields * /
。 form-line 。 form-line-column {
display ： inline-block;
}

。 form-line-column-clear {
清除： left;
宽度： auto;
}

。 dlist {
position ： relative;
}

。 dlist：after {
/ * content：'& gt;'; * /
 font ： 14px& quot; Consolas&am p; quot;，monospace;
颜色：＃0081C7;
- webkit-transform ： rotate（ 90deg）;
- moz-transform ： rotate（90deg）;
- ms-transform ： rotate（90deg）;
transform ： rotate（90deg）;
right ： 8px;
top ： -3px;
border-bottom ： 1px solid #ddd;
position ：绝对值;
指针事件： none;
}

。 dlist：before {
/ * content：''; * /
right ： 6px;
top ： -3px;
width ： 20px;
height ： 20px;
background ：＃f8f8f8;
位置：绝对;
指针事件：无;
显示： block;
}
。 form-input {
display ： inline-block;
} < / pre >

ConnectionStrings:pmdb %>" SelectCommand="select 'Type product code' as 'Product' union all select stockCode as 'Product' from productCodes where stockcode like 'AV%' OR stockcode like 'SL%' "> </asp:SqlDataSource> </div> </li> style.css .dropdown{ padding:0px; /*-5px 0px 10px 0px;*/ margin: 0; -webkit-border-radius: 4px #EFEFEF; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset; -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset; box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset; background-color: #fff; /*color: #888;*/ border: 1px solid #ccc; outline: none; display: inline-block; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; height: 30px; } .dropdown select option{ padding:3px 5px; color:aqua; background-color:#ffd800; padding:-5px 0px 10px 0px; } .form-input .form-error-message, .form-input-wide .form-error-message{ bottom:-5px; font-size:11px; position:relative; z-index:900; right:auto; top:auto; color:#333; padding:3px; max-width:100%; padding-bottom:3px; font-size:12px; border:none; -moz-box-shadow:0px 2px 4px rgba(102, 102, 102, 0.5); -webkit-box-shadow:0px 2px 4px rgba(102, 102, 102, 0.5); -moz-border-radius:6px 6px; -webkit-border-radius:6px 6px; box-shadow:0px 2px 4px rgba(102, 102, 102, 0.5); border-radius:6px 6px; background:#FFCCCC; } .form-line { clear:both; padding:10px; margin:0px; /* Changed display to block to prevent a bug in Chrome */ display:block; width:97%; width:-moz-available; /* Removed this because it was changing the size of the migrated forms */ /* border:1px solid transparent ; */ position:relative; } .form-line-column{ float:left; clear:none; width:auto; white-space:nowrap; } /* Added css rule below to retain display:inline-block for shrunken fields */ .form-line.form-line-column { display:inline-block; } .form-line-column-clear{ clear:left; width:auto; } .dlist { position: relative; } .dlist:after { /*content: '>';*/ font: 14px "Consolas", monospace; color: #0081C7; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); right: 8px; top: -3px; border-bottom: 1px solid #ddd; position: absolute; pointer-events: none; } .dlist:before { /*content: '';*/ right: 6px; top: -3px; width: 20px; height: 20px; background: #f8f8f8; position: absolute; pointer-events: none; display: block; } .form-input { display:inline-block; }</pre>

这篇关于填充的dropdownList选中的值不是选择悬停值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

填充的dropdownList选中的值不是选择悬停值 [英] populated dropdownList selected value is not pick the hover value

问题描述

相关文章

其他开发语言最新文章

热门教程

热门工具

登录关闭

填充的dropdownList选中的值不是选择悬停值 [英] populated dropdownList selected value is not pick the hover value

问题描述

相关文章

其他开发语言最新文章

热门教程

热门工具

登录 关闭

登录关闭