Question

我有一个asp：radionbutton，当点击给用户询问他们是/否问题时会显示一个弹出窗口。

除非我先点击其他按钮或任何其他事件，否则我的jquery工作正常。

我已经尝试了所有不同的方式来编写无线电更改或点击功能，这是基于我在网上搜索没有运气。所以我发布我的代码，看看有人知道我错过了什么：

<asp:UpdatePanel ID="pnl_CNs" runat="server" UpdateMode="Conditional" >
  <ContentTemplate> 
      <asp:Button id="btnGetCNs" Text="Get CNs"  Font-Size="Smaller" runat="server" OnClientClick="javascript:FetchCNs()"/> / <asp:RadioButton ID="rbCN" CssClass="cssRB" runat="server" Text="Enter CN(s)"  Checked="false"/>   
  </ContentTemplate>
</UpdatePanel>

jquery的：

<script type="text/javascript">
$(document).ready(function () {
    $('input:radio').click(function () {
        alert("hi");
        if (this.data == true) { }
        confirm("Add CN to current List?", function () {
            //alert(this.data);

            var result = this.data;
            if (result == false) {
                $('.csslbCNs').empty();
            }
            //change CN count
            $('.csstbCN').removeAttr('disabled');
            $('.csstbCN:first').focus();
        });
    })

})

function FetchCNs() {
    var rb = $('.cssrbCN');
    rb.attr("checked", false);
    var ln = document.getElementById('<% =ddlLineNumber.ClientID %>').value;
    var cs = document.getElementById('<% =ddlCS.ClientID %>').value;
    PageMethods.FetchCNs(ln, cs, CallSuccess, CallFailed);
}

function CallSuccess(data) {

    var dataLen = data.length;

    var listbox = $('.csslbCNs');
    //listbox.empty();
    for (var i = 0; i < data.length; i++) {

        var cn = data[i]["CNNumber"];

        listbox.append('<option>' + cn + '</option>');  
    }
    var CNCountString = "Total CNs: " + i.toString();

    $('.cssCNCount').text(CNCountString);
}
function CallFailed(result) { alert(result.get_message()); }

</script>

Answer 1

问题是，您只能在页面准备好时调用您的javascript。使用更新面板进行更新时，不会再次加载页面，但会更新单独的部分。这些部分包含新的html，需要您的javascript函数再次初始化控件。

您可以使用以下命令触发初始加载的初始化控件以及更新的更新面板：

<script type="text/javascript">

$(document).ready(function () {
    if (Sys != undefined) {
        //There's a ScriptManager on the page
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(PartialPostBackFinished);

        if (!prm.get_isInAsyncPostBack()) {
            //Trigger initialization for synchronous post back triggered outside updatepanels
            InitializeControls(document);
        }
    }
    else {
        //Trigger initialization for pages without ScriptManager
        InitializeControls(document);
    }
}

function PartialPostBackFinished(sender, args) {
    var updatePanels = args.get_panelsUpdated();
    for (i = 0; i < updatedPanels.length; i++) {
        //Do whatever needs to be triggered for each updated update panel
        InitializeControls(updatedPanels[i]);
    }
}

function InitializeControls(container) {
    //Initialise whatever you want to
    $('input:radio', container).click(function () {
        alert("hi");
        if (this.data == true) { }
        confirm("Add CN to current List?", function () {
            //alert(this.data);

            var result = this.data;
            if (result == false) {
                $('.csslbCNs').empty();
            }
            //change CN count
            $('.csstbCN').removeAttr('disabled');
            $('.csstbCN:first').focus();
        });
    })
}

</script>

注意添加到jQuery选择器的容器，这导致只订阅容器中控件的click事件，该事件应该只是更新的部分。这样可以避免为尚未更新的控件订阅另一次。在你的情况下，它可能没有什么区别，但我认为将该逻辑添加到模式以供将来参考是好的。

radiobutton事件在任何其他对象事件之后都没有触发

1 个答案: