在页面加载时向ASP Dropdownlist添加Javascript_Javascript_Asp.net_Updatepanel_Pageload

在页面加载时向ASP Dropdownlist添加Javascript

javascript asp.net

在页面加载时向ASP Dropdownlist添加Javascript,javascript,asp.net,updatepanel,pageload,Javascript,Asp.net,Updatepanel,Pageload,我正在开发一个不使用UpdatePanel的交互式web表单，因此我尝试使用JavaScript来实现大部分功能。对于这个问题，我试图找出如何让java脚本向PageLoad（）上的dropdownlist添加函数我有以下ASP文件： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> &l

我正在开发一个不使用

UpdatePanel

的交互式web表单，因此我尝试使用JavaScript来实现大部分功能。对于这个问题，我试图找出如何让java脚本向PageLoad（）上的dropdownlist添加函数

我有以下ASP文件：

<!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 src="Default.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            Discovery Form Templates
            <asp:DropDownList ID="uiFormTemplates" runat="server" DataTextField="Subject" DataValueField="DiscoveryFormID" AppendDataBoundItems="true" OnChange="GetTemplateValue();">
                <asp:ListItem Text="--Select One--" Value=""/>
            </asp:DropDownList>
        </div>
        <div id="ChangePlate"></div>
    </form>
</body>
</html>

我正在尝试使用以下javascript：

function GetTemplateValue()
{
var dropdown = document.getElementById("uiFormTemplates");
var SelectedOption = dropdown.options[dropdown.selectedIndex].value;

if (SelectedOption == null) {
    document.getElementById("ChangePlate").innerText = "There is nothing here.";
}
else {
    document.getElementById("ChangePlate").innerText = dropdown;
}
}

$(document).ready(function () {
    $("#uiFormTemplates").onchange(function () { GetTemplateValue(); });
});

当我从

dropdownlist

中删除

OnChange=“GetTemplateValue（）”

时，即使使用第二个javascript方法，也不会发生任何事情。我的代码写错了吗，或者我甚至没有从正确的角度来处理这个问题？现在，无论是代码评论还是一些指导都会有所帮助，我是一个js noob。

假设您包括jQuery（您正在使用的），那么就没有

onchange

方法。您必须将其更改为（'change'，…），或使用

change

方法。而且，

#uiFormTemplates

不应该工作，您必须使用控件的

ClientID

因此：

$（文档）.ready（函数（）{
$（“#”）on（'change'，function（）{GetTemplateValue（）；}）；
});

或：

$（文档）.ready（函数（）{
$（“#”）change（函数（）{GetTemplateValue（）；}）；
});

由于您的控件是asp.net控件，因此您正在编写的方法是服务器端方法而不是客户端代码。首先，检查该DDL的ID实际上是如何呈现的。很可能您需要更改javascript以查找

”

，而不是

“uiFormTemplates”

。ASP.NET通常使用

runat=server

更改标记的ID。。。这就是您获取发送到客户端的ID的方式。@krshekhar您能澄清一下吗？这是上面提到的

吗？好的，我的方法现在读取

$（''）.change（函数（）{GetTemplateValue（）；}）但它仍然不起作用。我选择clientID
的方式有问题吗？还是另一个问题？js代码必须用asp处理才能工作。看起来你有一个外部文件。将它添加到html的
上的块中。我还意识到引用没有包含在标题中。谢谢
$(document).ready(function () {
    $("#<%= uiFormTemplates.ClientID %>").on('change', function () { GetTemplateValue(); });
});

$(document).ready(function () {
    $("#<%= uiFormTemplates.ClientID %>").change(function () { GetTemplateValue(); });
});