实现google的下拉选择

//backdata.aspx.cs

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.OracleClient;

public partial class test_backData : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Db db = new Db();
        db.OpenConnection();
        //string keyWrods = HttpContext.Current.Request.QueryString["keyword"].ToString().Trim();
        string keyWrods = this.Request.QueryString["keyword"].ToString();
        try
        {
            if (db.ExecSqlWithScalar("select count(物料代码) from KC_ALLDATA where 物料代码 like '" + keyWrods + "%'").ToString() == "0")
            {
                this.Response.Write("");
            }
            else
            {
                string  lbcid;
                OracleDataReader dr = db.ExecuteRead("select 物料代码,物料名称,常用计量单位,物料代码||'( '||物料名称 ||')' as wldm1 from KC_ALLDATA where rownum <=15 and 物料代码 like '" + keyWrods + "%'");
                while (dr.Read())
                {
                    //lbcid = "<div id=/"" + dr["物料代码"].ToString() + "/" ;οnclick=/"SetV('" + dr["物料代码"].ToString() + "','" + dr["物料名称"].ToString() + "','" + dr["常用计量单位"].ToString() + "')/" >" + dr["wldm1"].ToString() + "</div>";
                    lbcid = "<div οnclick=/"SetV('" + dr["物料代码"].ToString() + "','" + dr["物料名称"].ToString() + "','" + dr["常用计量单位"].ToString() + "')/" >" + dr["wldm1"].ToString() + "</div>";
                    //lbcid = "<div οnclick=/"SetV('" + dr["物料代码"].ToString() + "','" + dr["物料名称"].ToString() + "','" + dr["常用计量单位"].ToString() + "')/" ><a href='javascript:void(null);' οnclick=/"input('" + dr["物料代码"].ToString() + "','" + dr["物料名称"].ToString() + "','" + dr["常用计量单位"].ToString() + "');/">" + dr["wldm1"].ToString() + "</a></div>";
                    //lbcid = "<li><a href='javascript:void(null);' οnclick=/"input('" + dr["wldm"].ToString() + "');/">" + dr["wldm"].ToString() + "</a></li>";
                   // resultsStyle = "'font-family: arial; font-size: 12px; color: #000000; text-decoration: none; padding: 5px; display: block';";
                    this.Response.Write(lbcid);     
                }
                //this.Response.Write("</br>");
                dr.Close();
            }  
        }
        catch (Exception e3)
        {
            CustomClass.WriteIniLog("错误内容:" + e3.Message, this.Request);
            this.Response.Write("USER");
        }
        db.CloseConnection();
        if (db != null) db = null;
        this.Response.End();
    }
}

 

 

//partedit.aspx

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">

<style type="text/css">   
<!--
 .focus{background-color:blue;color:White}
 .unfocus{background-color:#c9d3f3;color:Black}
.keyword {...}{width:150px; height:20px; border:#0066FF 1px solid;}/**//*文本框样式*/
#keytishi {...}{width:150px; height:auto; border:#0066FF 1px solid; position:absolute; display:none;}/**//*提示层样式*/
#keytishi ul {...}{ margin:0;}/**//*提示层样式*/
#keytishi ul li{...}{margin:0;list-style-type:none; line-height:16px; height:16px; font-size:12px; padding:2px;}/**//*提示层样式*/
#keytishi ul li a { ... }{display:block; width:150px; height:16px; text-decoration:none;}/**//*提示层样式*/
#keytishi ul li a:hover {...}{background-color:#0099FF;}/**//*提示层样式*/
-->
</style>
 <script language="javascript" type="text/javascript">
//建立XMLHttpRequest对象
function CloseDiv()
{
 var obj = document.getElementById("keytishi")
  document.getElementById("keytishi").style.display = "none";
}

function SetV(str1,str2,str3)
{
    document.getElementById("search").value=str1;//从提示层选择你需要的数据填充到文本框
    document.getElementById("tbLJMC").value=str2;//从提示层选择你需要的数据填充到文本框
    document.getElementById("tbDW").value=str3;//从提示层选择你需要的数据填充到文本框
    document.getElementById("keytishi").innerHTML = "";//清空提示层
    document.getElementById("keytishi").style.display = "none";//设置提示层不可见
}

var CurrentIndex=-1;
document.onkeydown   =   function()  
 {  
 e=e||event;
 if(e.keyCode==38||e.keyCode==40||e.keyCode==13)//上
 {
    var items=document.getElementById("keytishi").getElementsByTagName("div");
    var itemLength=items.length;
    if(item !="undefined" && itemLength !=0 )
    {
         if(CurrentIndex!=-1)
            items[CurrentIndex].className="unfocus";
         if(e.keyCode==38)//上
         {
            if(CurrentIndex==-1)
                CurrentIndex=0;
            else
                CurrentIndex--;
            if(CurrentIndex<0)
              CurrentIndex=itemLength-1;   
         }
         else if(e.keyCode==40)//下
         {
            if(CurrentIndex==-1)
                CurrentIndex=0;
            else
                CurrentIndex++;
            if(CurrentIndex>itemLength-1)
              CurrentIndex=0; 
         }
         else if(e.keyCode==13)//enter
         {
            var shtml =  items[CurrentIndex].innerHTML;
            alert(shtml);
            var svalue = items[CurrentIndex].childNodes[0].nodeValue;
            alert(svalue);

         }
           //SetV(items[CurrentIndex]);
           //var cid = = items[CurrentIndex];
//                 alert(cid);

//                 var cid = items[CurrentIndex].id;                  
//                 document.getElementById("search").value = items[CurrentIndex].value;
//                 alert(items[CurrentIndex].value);
//                 items[CurrentIndex].focus();
           items[CurrentIndex].className="focus";
    }

 }
}

var xmlhttp;
try    {
    xmlhttp= new ActiveXObject('Msxml2.XMLHTTP');
}catch(e){
    try{
        xmlhttp= new ActiveXObject('Microsoft.XMLHTTP');
    }catch(e){
        try    {
            xmlhttp= new XMLHttpRequest();
        }catch(e)    {}
    }
}
function getKeyWord()    {
 e=e||event;
 if(e.keyCode!=38&&e.keyCode!=40&&e.keyCode!=13)
 {
    CurrentIndex=-1;
    var obj = document.getElementById("search");//获取文本域对象
    //alert(obj.value);
    if(obj.value=="")    {
        return;
    }
    var top=0;
    var left=0;
    while(obj)    {//此循环得到文件域对象在页面中的绝对位置
        top += obj["offsetTop"];
        left += obj["offsetLeft"];
        obj = obj.offsetParent;
    }
    var u_name = document.form1.search.value;
    var url = "backData.aspx?keyword=" + document.getElementById("search").value;
    xmlhttp.open("get",url,true);
    xmlhttp.onreadystatechange = function()    {
        if(xmlhttp.readyState == 4)
            {
            if(xmlhttp.status == 200)
                {
                if(xmlhttp.responseText!="")    {
                    //document.form1.BtnSubmit.disabled=false;
                    document.getElementById("keytishi").innerHTML = unescape(xmlhttp.responseText);//把后台返回的数据填充到提示层
                    document.getElementById("keytishi").style.left = left + "px";//设置提示层的位置,左
                    document.getElementById("keytishi").style.top = (top + 25) + "px";//设置提示层的位置,上
                    document.getElementById("keytishi").style.display = "block";//设置提示层可见
                }else    {
                    document.getElementById("keytishi").innerHTML = "<font color='red'>提示:物料代码不存在,请重新输入!</font>";//清空提示层
                    document.getElementById("keytishi").style.display = "block";//设置提示层不可见
                    //document.form1.BtnSubmit.disabled=true;
                }
            }
            else    {
            }
        }
    }
    xmlhttp.setRequestHeader("If-Modified-Since","0");
    xmlhttp.send(null);
 }
  
}
function input(str1,str2,str3)    {
    document.getElementById("search").value=str1;//从提示层选择你需要的数据填充到文本框
    document.getElementById("tbLJMC").value=str2;//从提示层选择你需要的数据填充到文本框
    document.getElementById("tbDW").value=str3;//从提示层选择你需要的数据填充到文本框
    //document.getElementById("search").value=str;
    document.getElementById("keytishi").innerHTML = "";//清空提示层
    document.getElementById("keytishi").style.display = "none";//设置提示层不可见
}
</script>
</head>

<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <!--如果需要鼠标悬浮提示,请加上 begin -->
        <div id="toolTipLayer" style="position: absolute; visibility: hidden">
        </div>
        <script type="text/javascript">initToolTips();</script>
        <!--如果需要鼠标悬浮提示,end -->
        <div>
            <!--c 表格开始 c-->
            <table width="995px" border="0" cellpadding="0" cellspacing="0">
                <!-- TOP -->
                <tr>
                    <td class="vista_TopBackColor" colspan="3">
                        <uc1:top ID="Top1" runat="server" />
                    </td>
                </tr>
                <!-- TOP -->
                <!-- 主页面 -->
                <tr>
                    <td rowspan="2" valign="top" class="vista_menustone" style="width: 122px; height: 39px">
                        <img src="../images/index_02.gif" width="122px" height="39px" alt="" /></td>
                    <td class="vista_daohangstone" style="width: 872px; height: 25px">
                        <table width="871px" border="0" cellspacing="0" cellpadding="0">
                            <!-- 导航 -->
                            <tr>
                                <td style="height: 16px">
                                    <asp:Label ID="LbNavigation" runat="server"></asp:Label>
                                    <!-- 当前用户 -->
                                    <uc4:Navigation ID="Navigation1" runat="server" />
                                    <!-- end 当前用户 -->
                                </td>
                            </tr>
                            <!-- end 导航 -->
                        </table>
                    </td>
                    <td style="width: 3px" class="vista_daohangstone">
                        <img src="../images/Spacer.gif" width="1px" height="25px" alt="" /></td>
                </tr>
                <tr>
                    <td class="vista_kongbaistone" style="width: 872px; height: 15px;">
                        &nbsp;</td>
                    <td style="width: 3px; height: 15px;" class="vista_kongbaistone">
                        <img src="../images/Spacer.gif" width="1px" height="15px" alt="" /></td>
                </tr>
                <tr>
                    <td class="vista_zhengwenstone" valign="top" style="width: 122px">
                        <uc3:menu ID="Menu1" runat="server" />
                    </td>
                    <td class="vista_zhengwenstone" style="width: 872px;" valign="top" align ="center">
                        <!--c 正文表格begin c-->
                            
                        <table width="100%" border="0" cellspacing="0" cellpadding="0">
                            <asp:Panel ID="Panel1" runat="server">
                                     <div id="keytishi" style="border-right: #455690 1px solid; border-top: #a6b4cf 1px solid; z-index: 99999; left: 136px; border-left: #a6b4cf 1px solid; width: 300px; visibility:visible; border-bottom: #455690 1px solid; position: absolute; top: 178px; height: 263px; background-color: #c9d3f3" >
                                        &nbsp;</div><!--提示层-->
                             </asp:Panel>                       
                            <tr valign="top">
                                <td align="center" style="height: 233px">
                                    <!-- ---------------------正文--------------------- -->
                                    <table width="80%" border="1" style="text-align:center; height: 70px;" cellpadding="0" cellspacing="0" id="TABLE1"  bordercolorlight="#003399"
                                        bordercolordark="#FFFFFF" >
                                        <tr style="background-color: #B5B5FF;">
                                            <td colspan="4" style="font-weight: bolder; font-size: 12pt; height: 24px;">
                                                <asp:Label ID="lbForm" runat="server"></asp:Label></td>
                                        </tr>
                                        <tr>
                                            <td style="background-color: #EAEAEA; width: 211px; height: 24px;">
                                                零件代码</td>
                                            <td style="width: 197px; text-align: left; height: 24px;">
                                                <span style="color: #ff0000"><input type="text" class="keyword" id="search"  name="search" οnkeyup="getKeyWord();" style="width: 220px; height: 18px;" autocomplete="off" />*</span></td>
                                           
                                            <td style="width: 180px; height: 24px; background-color: #eaeaea">
                                                 零件出入库</td>
                                            <td style="height: 24px; text-align: left; width: 221px;">
                                                <span style="color: #ff0000">
                                                    <asp:DropDownList ID="ddlcrk" runat="server" Width="136px" Height="20px">
                                                     <asp:ListItem Selected="True" Value="0">--未选择--</asp:ListItem>
                                                     <asp:ListItem Value="1">入库</asp:ListItem>
                                                     <asp:ListItem Value="2">出库</asp:ListItem>
                                                 </asp:DropDownList>*</span></td>
                                        </tr>
                                        <tr>
                                            <td style="background-color: #EAEAEA; width: 211px; height: 24px;">
                                                零件数量</td>
                                            <td  nowrap="nowrap" style="height: 24px; text-align: left; width: 197px;">
                                                <asp:TextBox ID="tbNUM" runat="server" Width="113px" Height="18px"></asp:TextBox><asp:TextBox ID="tbDW" runat="server"
                                                    Width="56px" ReadOnly="True" Height="18px"></asp:TextBox></td>
                                             <td style="width: 180px; height: 24px; background-color: #eaeaea">
                                                零件状态</td>
                                             <td style="height: 24px; text-align: left">
                                               <asp:DropDownList ID="ddlWLZT" runat="server" Width="136px">
                                                 </asp:DropDownList><span style="color: #ff0000">*</span></td>
                                        </tr>
                                        <tr>
                                            <td style="background-color: #EAEAEA; width: 211px; height: 24px;">
                                                零件名称</td>
                                            <td  nowrap="nowrap" style="height: 24px; text-align: left; width: 197px;">
                                               <span style="color: #ff0000">
                                                    <asp:TextBox ID="tbLJMC" runat="server" Width="220px" Height="18px"></asp:TextBox>*</span></td>
                                             <td style="width: 180px; height: 24px; background-color: #eaeaea">
                                                 返工标志位</td>
                                             <td style="height: 24px; text-align: left">
                                                 <asp:TextBox ID="TextBox1" runat="server" Width="133px" Height="18px"></asp:TextBox></td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                       
                        <!-- 这里删的---------------------end 正文--------------------- -->
                        <br />
                        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
                        <br />
                        <br />
                        <br />
                        <br />
                        <!--c 正文表格 END c-->
                        </td>
                    <td style="width: 3px; height: 500px" class="vista_zhengwenstone">
                    &nbsp;</td>
                 </tr>
                <!-- 底部 -->
                <tr>
                            <td colspan="3" class="vista_BottomBackColor">
                                <uc2:tottom ID="Tottom1" runat="server" />
                            </td>
                        </tr>
                <!-- 底部 -->
            </table>
            <!--c 表格结束 c-->
        </div>
    </form>
</body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值