Question

我正在使用asp：单选按钮。我正在尝试使用2个单选按钮，这样如果选择其中任何一个按钮，则其他按钮将被取消选中。我在这些按钮的更改事件上调用JavaScript函数。该函数将添加一些值并返回文本框中的输出。我尝试使用普通的asp按钮然后切换到单选按钮组，现在尝试单选按钮列表。需要在单选按钮更改事件上调用javascript函数。这些按钮将被选中并取消选中，但java脚本函数未返回正确的值。我猜有些命名约定不正确或者某些东西不起作用。期待着帮助解决这个问题。这三种方式中的任何一种都不起作用。

我的test.aspx文件包含

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <div class="span2">Test Career:</div>
                <div class="span8">
                <asp:RadioButton ID="TestCareerList" runat="server" clientmode=Static Text="MasterDegree">

                </div>
           </ContentTemplate>
 </asp:UpdatePanel>

aspx页面中的Document.ready函数

$(document).ready(function () {
  $("input:radio").click(function () 
{
updateYears();
}
}

javascript function is:

    function updateYears() {
        var yrsDocTemp = parseFloat(yrsDoc);
        var yrsMastTemp = parseFloat(yrsMast);


        if ($("ContentPlaceHolder2_drpEmplClass").val() != "" && $("#ContentPlaceHolder2_StudentCareerList]").SelectedValue!= "") {
            var updateValue = 0;

            //Get EmplCalss
            if ($("#ContentPlaceHolder2_drpEmplClass").val() == "GA") {
                updateValue = updateValue + 1;
            }
            else if ($("#ContentPlaceHolder2_drpEmplClass").val() == "GAF" || $("#ContentPlaceHolder2_drpEmplClass").val() == "GAP") {
                updateValue = updateValue + .5;
            }


            if ($("#ContentPlaceHolder2_Career").Text =="DoctoralDegree")
                {
                yrsDocTemp = yrsDocTemp + updateValue;
            }

            else if ($("#ContentPlaceHolder2_Career").Text == "MastersDegree") {

                yrsMastTemp = yrsMastTemp + updateValue;
            }

        }

        //Update the fields
        $("#ContentPlaceHolder2_drpYearsDoctoral").val(yrsDocTemp);
        $("#ContentPlaceHolder2_drpYearsMasters").val(yrsMastTemp);
    }

I am calling this function under document.ready function like this-



    $("input:RadioButtonList[ID=^TestCareerList").change(function(){
                    updateYears();
                });

                $("#ContentPlaceHolder2_drpEmplClass").change(function () {
                    updateYears();
                });


When I debug the javascript code I see the names of buttons have been changed.

    <tr>
                <td>
                <input id="ContentPlaceHolder2_TestCareerList_0" type="radio" name="ctl00$ContentPlaceHolder2$TestCareerList" value="MastersDegree" />
                <label for="ContentPlaceHolder2_TestCareerList_0">Master</label>
                </td>
                <td><input id="ContentPlaceHolder2_TestCareerList_1" type="radio" name="ctl00$ContentPlaceHolder2$TestCareerList" value="DoctoralDegree" />
                <label for="ContentPlaceHolder2_TestCareerList_1">Doctoral</label>
                </td>
    </tr>

    Kindly looking for help.

Answer 1

这是尝试绑定到服务器端元素：

$("input:RadioButtonList[ID=^TestCareerList")

但JavaScript不了解服务器端代码。它仅在客户端代码上运行。而且，正如您所注意到的，您的客户端HTML是不同的。所以你的JavaScript需要定位那个代码。像这样：

$("input:radio[ID=*TestCareerList")

对于您拥有的任何其他选择器也是如此。正如您所发现的那样，WebForms控件是着名的 not great ，用于精细控制客户端代码。 ASP.NET MVC使这更容易，但对于你正在做的事情可能是一个非常重要的转变。

可能有用的一件事是将某些控件的ClientID属性设置为Static。但是在执行此操作时要小心并相应地调试HTML，因为如果您在HTML中重复id个值，那么它将无效，并且在id上选择时JavaScript的行为将是未定义的。

Asp单选按钮不调用javascript函数

1 个答案: