从下拉列表到选择文本框的值 [英] value from dropdownlist to textbox on selection
问题描述
我正在创建一个包含四个值1,2,5,10的下拉列表。并且有一个文本框。当我从下拉列表中选择任何值时，我想在文本框中打印值。
即当我选择1然后tb（文本框）显示25
当我选择2然后tb （文本框）显示48
当我选择5然后tb（文本框）显示200
当我选择10然后tb（文本框）显示390
即时创建一个函数add（）并将值分配给所有...如下所示..
其中ddl1是下拉列表的id。
和up1是文本框的ID。
它不能正常工作.Plzz告诉我wt这个代码或正确代码的问题
<前lang =HTML> .style2
{
宽度：100％;
}
< script type = text / javascript >
function add（）
{
if （ document .getElementById（ < span class =code-string> ddl1）。value == 1）
{
document .getElementById（ up1）。value == 25
}
if （ document 。 getElementById（ ddl1）。value == 2）
{
document .getElementById（ up1）。value == 48
}
if （ document .getElementById（ ddl1）。value == 5）
{
document 。 getElementById（ up1）。value == 200
}
if （ document .getElementById（ ddl1）。value == 10）
{
document .getElementById（ up1）。value == 390
}
}
< / script >
< 表格 action = tryforddl1.aspx meth od = 发布 >
< 选择 id = ddl1 < span class =code-attribute> name = ddl1 önchange = add（） >
< 选项 值e = 1 > 1 < / option >
< 选项 value = 2 > 2 < / option >
< 选项 value = 5 > 5 < / option >
< 选项 值 = 10 > 10 < / option >
< / select >
< 输入 类型 = text id = up1 / > ;
< / form >
赋值使用单等号=
并进行比较值使用双等号==
而不是......
document.getElementById（up1）。value = =25
写...
document.getElementById （up1）。value =25
快乐编码！
：）
HI Amit
某些IE浏览器不支持
add（）。
试试其他一些名称为add1（除了fr omadd（））
以及分配用途=不是==
使用简化编码为：
功能 add1 （） {
var ddlvalue = document .getElementById（ ddl1）。value;
var up1 = document .getElementById（ up1）;
// console.log（ddlvalue）;
if （ddlvalue == ' 1'）
up1.value = ' 25';
else if （ddlvalue == ' 2'）
up1.value = ' 48 ;
else if （ddlvalue == ' 5'）
up1.value = ' 200 ;
else if （ddlvalue == ' 10'）
up1.value = ' 390 ;
}
< 选择 id = ddl1 onchange = < span class =code-keyword> add1（） >
< 选项 value = 1 > 11 < / option > ;
< 选项 value = 2 > 21 < / option >
< 选项 value = 5 > 51 < / option >
< 选项 value = 10 > 101 < / option >
< / select >
< 输入 type = text id = up1 / >
基于对话..
这可能对你有帮助..
这个只是样本，你可以开始修改以满足你的需求。
< html xmlns = http://www.w3.org/1999/xhtml >
< head runat = server >
< title > < / title >
< script src = jquery.js.js > < / script >
< script 类型 = text / javascript >
function calculate（）{
var ddlqty = document .getElementById（' ddlqty'）;
var ddlweight = document .getElementById（' ddlweight'）;
var lblup = document .getElementById（' lblup'）;
var lbllp = document .getElementById（' lbllp'）;
lblup.innerText = ddlweight.value;
var qty = parseFloat （ddlqty.value）* parseFloat （ddlweight.value）
lbllp.innerText = qty;
}
< / 脚本 >
< / head >
< 正文 >
< form id = form1 runat = 服务器 >
< table border = 1 >
< tr >
< td > QTY < / td >
< td > 说明< / td >
< td > WEIGHT < / td >
< td > U / P < / td >
< td > L / P < / td >
< / tr >
< tr >
< td >
< asp ：DropDownList ID = ddlqty onchange = calculate（）; runat = server >
< asp：ListItem 文字 = 1 / >
< asp：ListItem 文本 = 2 / >
< asp：ListItem 文字 = < span class =code-keyword> 3 / >
< asp：ListItem 文本 = 4 / >
< asp：ListItem 文本 = 5 / >
< / asp：DropDownList >
< / td >
< td > ; Cadburry Dairy Milk
< / td >
< td >
< asp：DropDownList ID = ddlweight onchange = calculate（）; runat = 服务器 >
< ; asp：ListItem 文字 = 65 gms 值 = 55.00 / >
< asp：ListItem 文字 = 165 gms 值 = 125.00 / >
< / asp：DropDownList > < / td >
< td >
< asp：Label < span class =code-attribute> ID = lblup runat = 服务器 > < / asp：Label > < / td >
< td >
< asp：标签 ID = lbllp runat = server > < < span class =code-leadattribute> / asp：Label > < < span class =code-leadattribute> / td >
< / tr >
< / table >
< / form >
< / body >
< / html >
来自网站的想法： http://www.chennaionlinegrocery.com/grocery/default.asp [ ^ ]
改变福名称：add（）到任何其他如show（）
和use =而不是==
<％@ 页 语言 = C＃ AutoEventWireup = true CodeBehind = WebForm1.aspx.cs 继承 = WebApplication2 .WebForm1 ％>
< ！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd >
< html xmlns = http：//www.w 3.org/1999/xhtml\">
< head runat = 服务器 >
< title > < / title >
< script type = text / javascript >
function 显示（）{
如果（ document .getElementById（ ddl1） .value == 1）
{
document .getElementById（ up1）。value = 25;
}
if （ document .getElementById（ ddl1）。value == 2）
{
document .getElementById（ up1）。value = 48
}
如果（ document .getElementById （ ddl1）。value == 5）
{
document .getElementById（ up1）。value = 200
}
if （ document .getElementById（ ddl1）。value == 10）
{
document .getElementById（ up1）。value = 390
}
}
< / script >
</head>
<body>
<form action=\"tryforddl1.aspx\" method=\"post\">
<select id=\"ddl1\" name=\"ddl1\" onchange=\"Show()\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
<option value=\"5\">5</option>
<option value=\"10\">10</option>
</select>
<input type=\"text\" id=\"up1\" />
</form>
</body>
</html>
I m creating a dropdownlist with four values 1,2,5,10.and have a text box. i want to print value in text box when i select any value from dropdownlist.
i.e when i select 1 then tb(textbox) show 25
when i select 2 then tb(textbox) show 48
when i select 5 then tb(textbox) show 200
when i select 10 then tb(textbox) show 390
And i m creating a function add() and assigning the values to all...as below..
where ddl1 is id for dropdownlist.
and up1 is the id for textbox.
Its not working Properly.Plzz tell me wt is problem with this code or right code for this
.style2
{
width: 100%;
}
<script type="text/javascript">
function add()
{
if (document.getElementById("ddl1").value== "1")
{
document.getElementById("up1").value=="25"
}
if (document.getElementById("ddl1").value == "2")
{
document.getElementById("up1").value == "48"
}
if(document.getElementById("ddl1").value=="5")
{
document.getElementById("up1").value=="200"
}
if (document.getElementById("ddl1").value == "10")
{
document.getElementById("up1").value=="390"
}
}
</script>
<form action="tryforddl1.aspx" method="post">
<select id="ddl1" name="ddl1" önchange="add()">
<option value="1">1</option>
<option value="2">2</option>
<option value="5">5</option>
<option value="10">10</option>
</select>
<input type="text" id="up1" />
</form>to assign value use single equal sign =
and to compare value use double equal sign ==
instead of...
document.getElementById("up1").value=="25"
write...
document.getElementById("up1").value = "25"
Happy coding!
:)
HI Amit
add() is not supported in some IE browsers.
try with some other names asadd1( apart fromadd())
and also for assigning use=not==
use simplified coding as:
function add1() { var ddlvalue = document.getElementById("ddl1").value; var up1 = document.getElementById("up1"); //console.log(ddlvalue); if (ddlvalue == '1') up1.value = '25'; else if (ddlvalue == '2') up1.value = '48'; else if (ddlvalue == '5') up1.value = '200'; else if (ddlvalue == '10') up1.value = '390'; }
<select id="ddl1" onchange="add1()"> <option value="1">11</option> <option value="2">21</option> <option value="5">51</option> <option value="10">101</option> </select> <input type="text" id="up1" />
based on the conversation..
this might help you..
this is just the sample , you can start modifying to fulfill your needs.
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="jquery.js.js"></script> <script type="text/javascript"> function calculate() { var ddlqty = document.getElementById('ddlqty'); var ddlweight = document.getElementById('ddlweight'); var lblup = document.getElementById('lblup'); var lbllp = document.getElementById('lbllp'); lblup.innerText = ddlweight.value; var qty = parseFloat(ddlqty.value) * parseFloat(ddlweight.value) lbllp.innerText = qty; } </script> </head> <body> <form id="form1" runat="server"> <table border="1"> <tr> <td>QTY</td> <td>DESCRIPTION</td> <td>WEIGHT</td> <td>U/P</td> <td>L/P</td> </tr> <tr> <td> <asp:DropDownList ID="ddlqty" onchange="calculate();" runat="server"> <asp:ListItem Text="1" /> <asp:ListItem Text="2" /> <asp:ListItem Text="3" /> <asp:ListItem Text="4" /> <asp:ListItem Text="5" /> </asp:DropDownList> </td> <td>Cadburry Dairy Milk </td> <td> <asp:DropDownList ID="ddlweight" onchange="calculate();" runat="server"> <asp:ListItem Text="65 gms" Value="55.00" /> <asp:ListItem Text="165 gms" Value="125.00" /> </asp:DropDownList></td> <td> <asp:Label ID="lblup" runat="server"></asp:Label></td> <td> <asp:Label ID="lbllp" runat="server"></asp:Label></td> </tr> </table> </form> </body> </html>
ideas from site : http://www.chennaionlinegrocery.com/grocery/default.asp[^]
Change the function name: add() to any other like show()
and use = instead of ==
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/javascript"> function Show() { if (document.getElementById("ddl1").value == "1") { document.getElementById("up1").value = "25"; } if (document.getElementById("ddl1").value == "2") { document.getElementById("up1").value ="48" } if (document.getElementById("ddl1").value == "5") { document.getElementById("up1").value = "200" } if (document.getElementById("ddl1").value == "10") { document.getElementById("up1").value = "390" } } </script> </head> <body> <form action="tryforddl1.aspx" method="post"> <select id="ddl1" name="ddl1" onchange="Show()"> <option value="1">1</option> <option value="2">2</option> <option value="5">5</option> <option value="10">10</option> </select> <input type="text" id="up1" /> </form> </body> </html>
这篇关于从下拉列表到选择文本框的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
