服务器控件DropDownList和Javascript的之间的传递

来源:互联网 发布:淘宝好评在哪里写 编辑:程序博客网 时间:2024/06/13 07:48

碰到一个DropDownList选择以后要将选定值传递给某个文本框显示的问题,参考了一些资料以后,终于搞定,因为DropDownList是服务器控件,而javascript是客户端事件,所以可以采取如下方法:
<script language="javascript">
function hehe()
{
    document.all('TextBox1').value =document.all('DropDownList1').options[document.all('DropDownList1').selectedIndex].text;
}
</script>

<asp:DropDownList id="DropDownList1" style="Z-INDEX: 101; LEFT: 240px; POSITION: absolute; TOP: 112px" onchange="hehe()" runat="server">
    <asp:ListItem Value="1">1</asp:ListItem>
    <asp:ListItem Value="2">2</asp:ListItem>
    <asp:ListItem Value="3">3</asp:ListItem>
    <asp:ListItem Value="4">4</asp:ListItem>
    <asp:ListItem Value="5">5</asp:ListItem>
</asp:DropDownList>
<asp:TextBox id="TextBox1" style="Z-INDEX: 102; LEFT: 48px; POSITION: absolute; TOP: 112px" runat="server"></asp:TextBox>
参考了以下2篇文章:
Move Select Options
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">
function moveSelected(select, down)
{
    if (select.selectedIndex != -1) 
    {
        if (down) 
        {
            if (select.selectedIndex != select.options.length - 1)
                var i = select.selectedIndex + 1;
            else
                return;
        }
        else 
        {
            if (select.selectedIndex != 0)
                var i = select.selectedIndex - 1;
            else
                return;
        }
        var swapOption = new Object();
        swapOption.text = select.options[select.selectedIndex].text;
        swapOption.value = select.options[select.selectedIndex].value;
        swapOption.selected = select.options[select.selectedIndex].selected;
        swapOption.defaultSelected = select.options[select.selectedIndex].defaultSelected;
        for (var property in swapOption)
            select.options[select.selectedIndex][property] = select.options[property];
        for (var property in swapOption)
            select.options[property] = swapOption[property];
    }
}


<form id="formName" name="formName" >
<select name="selectName" id="selectName" size="8">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
</select>
<input id="moveUp" onclick="moveSelected(this.form.selectName, false)" type="button" value="上移" />
<input id="moveDown" onclick="moveSelected(this.form.selectName, false)" type="button" value="下移" />
</form>
1、js脚本如何访问服务器控件的值
界面上有一个TextBox控件,ID为Name,js里可以采用如下脚本取Name的值
var myvalue=document.all('Name').value;
2、服务器控件如何取js中变量的值
目前未发现比较好的办法,我通常采用的方法是在界面上放一个隐藏的控件HtmlInputHidden,然后设置为以服务器控件运行,这样在js脚本
中和ASP.NET代码里都可以访问到该控件的值
js中给服务器控件赋值:
var bt=document.all('Name').value;
bt.value='名称';
ASP.NET中使用Name.Value来访问。
3、如何遍历界面上所有TextBox元素
var inputList = document.body.getElementsByTagName("INPUT");
for(var i=0;i<inputList.length;i++)
{
    if(inputList.disabled==false && (inputList.type=='text' || inputList.type=='password'))
    {
        inputList.value="";
    }
}
4、让dropdownlist选择到指定项
选择dropdownlist中值为“我得选择”得项
var handl=document.all('List1');
var my_value='我得选择';
for(var index=0;index<handle.options.length;index++)
{
    if(handle.options[index].text==my_value)
    {
        handle.selectedIndex=index;
    }
}

原创粉丝点击