如何使用ASP.NET WebForms中的JavaScript将文本从FormView中的DropDownList获取到文本框中？

我正试图从DropDownList中将所选文本（而不是值）放入文本框。DropDownList位于my FormView控件的EditITemTemplate中，但TextBox不在其中

以下是我尝试使用的js：

<script type="text/javascript">
    function GetDdlText() {
        var fvmode = ('<%=fvPhaudDets.CurrentMode.ToString()%>');
        if (fvmode == "Edit") {
            var ddl = document.getElementById('<%=fvPhaudDets.FindControl("QOpClsCallDdl")%>');
            var txt = document.getElementById("txtbox");
            var selectedText = ddl.options[ddl.selectedIndex].Value;
            txt.Text = selectedText;
            txt.focus();
        }
    }
</script>

---

因此，只要在DropDownList中选择了一个新值，所选文本就会填充文本框，但文本框中不会有任何值。我缺少了什么，或者需要更改什么才能捕获所选值？

以下代码段应该可以工作。您的javascript代码存在一些问题。主要使用大写字母，并混合使用Webforms和javascript函数

首先，要定位DDL，需要ClientID

fvPhaudDets.FindControl("QOpClsCallDdl").ClientID

然后使用正确的javascript

ddl.options[ddl.selectedIndex].text

，而不是

。Value

设置文本框文本也是如此。它是

txt.value=selectedText，而不是
txt.Text

<script type="text/javascript">
    function GetDdlText() {
        var fvmode = ('<%=fvPhaudDets.CurrentMode.ToString()%>');
        if (fvmode == "Edit") {
            var ddl = document.getElementById('<%= fvPhaudDets.FindControl("QOpClsCallDdl").ClientID %>');
            var txt = document.getElementById("txtbox");
            var selectedText = ddl.options[ddl.selectedIndex].text;
            txt.value = selectedText;
            txt.focus();
        }
    }
</script>

试试这个，看看是否有帮助。我想你的问题是你没有使用

客户

这与您的代码不完全相同。但类似。。您可以根据需要更改下面的代码

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolderHead" runat="Server">
    <script src="../scripts/jquery-1.9.1.min.js"></script>
    <script>
        function onDDLChange() {
            var selectedVal = document.getElementById('<%=ddl1.ClientID%>').value;
            var selectedTxt = document.getElementById('<%=ddl1.ClientID%>').options[selectedVal].text;
            console.log(selectedTxt);
            document.getElementById('<%=tb1.ClientID%>').value = selectedTxt;
        }
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolderBody" runat="Server">
    <asp:DropDownList runat="server" ID="ddl1" onchange="onDDLChange();">
        <asp:ListItem Text="" Value=""></asp:ListItem>
        <asp:ListItem Text="one" Value="1"></asp:ListItem>
        <asp:ListItem Text="two" Value="2"></asp:ListItem>
    </asp:DropDownList>

    <asp:TextBox runat="server" ID="tb1"></asp:TextBox>
</asp:Content>


函数onDDLChange（）{
var selectedVal=document.getElementById（“”）.value；
var selectedText=document.getElementById（“”）。选项[selectedVal]。文本；
console.log（selectedText）；
document.getElementById（“”）.value=selectedText；
}
感谢您的反馈和帮助。对于您提供的代码，我得到了一个空引用异常，但如果我删除“.ClientID”，则不会出现这种异常。我认为问题在于FormView的当前模式。我在加载页面时遇到异常，因此它不会检查当前模式是否为“编辑”。你是对的。我只是在编辑模式下测试。更新了我的答案。我更新了与你匹配的代码，但它没有从下拉列表中获取值。我在控制台中得到一个错误，指示dropdownlist中的值为null。我尝试过从按钮调用函数，也尝试过从DropDownList的一次更改调用函数，但是我得到了相同的错误。如果你有任何其他想法，请告诉我，我也会继续尝试。
var ddl = document.getElementById('<%= fvPhaudDets.CurrentMode == FormViewMode.Edit ? fvPhaudDets.FindControl("QOpClsCallDdl").ClientID : "" %>');

<asp:FormView ID="fvPhaudDets" runat="server">
    <EditItemTemplate>

        <asp:DropDownList ID="QOpClsCallDdl" runat="server" onchange="GetDdlText()">
            <asp:ListItem>aaa</asp:ListItem>
            <asp:ListItem>bbb</asp:ListItem>
            <asp:ListItem>ccc</asp:ListItem>
        </asp:DropDownList>

    </EditItemTemplate>
</asp:FormView>

<input type="text" id="txtbox" />

<script type="text/javascript">
    function GetDdlText() {
        var fvmode = ('<%=fvPhaudDets.CurrentMode.ToString()%>');
        if (fvmode == "Edit") {
            var ddl = document.getElementById('<%= fvPhaudDets.CurrentMode == FormViewMode.Edit ? fvPhaudDets.FindControl("QOpClsCallDdl").ClientID : "" %>');
            var txt = document.getElementById("txtbox");
            var selectedText = ddl.options[ddl.selectedIndex].text;
            txt.value = selectedText;
            txt.focus();
        }
    }
</script>

fvPhaudDets.DataSource = new string[1];
fvPhaudDets.ChangeMode(FormViewMode.Edit);
fvPhaudDets.DataBind();

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolderHead" runat="Server">
    <script src="../scripts/jquery-1.9.1.min.js"></script>
    <script>
        function onDDLChange() {
            var selectedVal = document.getElementById('<%=ddl1.ClientID%>').value;
            var selectedTxt = document.getElementById('<%=ddl1.ClientID%>').options[selectedVal].text;
            console.log(selectedTxt);
            document.getElementById('<%=tb1.ClientID%>').value = selectedTxt;
        }
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolderBody" runat="Server">
    <asp:DropDownList runat="server" ID="ddl1" onchange="onDDLChange();">
        <asp:ListItem Text="" Value=""></asp:ListItem>
        <asp:ListItem Text="one" Value="1"></asp:ListItem>
        <asp:ListItem Text="two" Value="2"></asp:ListItem>
    </asp:DropDownList>

    <asp:TextBox runat="server" ID="tb1"></asp:TextBox>
</asp:Content>