页面在 OnClientClick 中得到回发返回 False

Question

我在 C#.Net 中工作。我有一个 ASP 按钮..

<asp:Button ID="btnSubmitData" ToolTip="Show" runat="server" Text="SHOW" CausesValidation="false"
                            OnClientClick="return FindSelectedItems();" OnClick="btnShow_Click" />

OnClientClick中调用的函数是，

function FindSelectedItems() {

    var sender = document.getElementById('lstMultipleValues');
    var cblstTable = document.getElementById(sender.id);
    var checkBoxPrefix = sender.id + "_";
    var noOfOptions = cblstTable.rows.length;
    var selectedText = "";
    var total = 0;
    for (i = 0; i < noOfOptions; ++i) {
        if (document.getElementById(checkBoxPrefix + i).checked) {
            total += 1;
            if (selectedText == "")
                selectedText = document.getElementById
                               (checkBoxPrefix + i).parentNode.innerText;
            else
                selectedText = selectedText + "," +
             document.getElementById(checkBoxPrefix + i).parentNode.innerText;
        }
    }
    var hifMet1 = document.getElementById('<%=hifMet1.ClientID%>');
    hifMet1.value = selectedText;

    if (total == 0) {
        var panel = document.getElementById('<%=pnlOk.ClientID%>');
        document.getElementById('<%=pnlOk.ClientID%>').style.display = 'block';
        var Label1 = document.getElementById('<%=Label3.ClientID%>');
        Label1.innerHTML = "Atleast one metric should be selected.";
        var btnLoc = document.getElementById('<%=btnLoc.ClientID%>');
        btnLoc.disabled = true;
        var btnProd = document.getElementById('<%=btnProd.ClientID%>');
        btnProd.disabled = true;
        var btnLastYear = document.getElementById('<%=btnLastYear.ClientID%>');
        btnLastYear.disabled = true;
        return false;
    }
    else if (total > 2) {
        var panel = document.getElementById('<%=pnlOk.ClientID%>');
        document.getElementById('<%=pnlOk.ClientID%>').style.display = 'block';
        var Label1 = document.getElementById('<%=Label3.ClientID%>');
        Label1.innerHTML = "Only two metrics can be compared.";
        var btnLoc = document.getElementById('<%=btnLoc.ClientID%>');
        btnLoc.disabled = true;
        var btnProd = document.getElementById('<%=btnProd.ClientID%>');
        btnProd.disabled = true;
        var btnLastYear = document.getElementById('<%=btnLastYear.ClientID%>');
        btnLastYear.disabled = true;
        return false;
    }
    else {
        return true;
    }
}

单击“显示”按钮后，我需要进行验证以检查至少一个复选框应该在复选框列表中被选中。我收到的警报消息（即）“应该选择至少一个指标”。但是在这部分之后，页面会重新加载。

此时我想避免页面刷新。我该怎么办？

Answer 1

一种方法是使用CustomValidator 控件和客户端验证函数将您的验证函数挂接到正确的 ASP .Net 验证生命周期中。

只需稍作改动，您就可以将 JavaScript 代码转换为客户端验证函数。

Full example here.

相关片段

<script language="javascript"> 
   function ClientValidate(source, arguments)
   {
        // Your code would go here, and set the IsValid property of arguments instead
        // of returning true/false

        if (arguments.Value % 2 == 0 ){
            arguments.IsValid = true;
        } else {
            arguments.IsValid = false;
        }
   }
</script>

<asp:CustomValidator id="CustomValidator1"
           ControlToValidate="Text1"
           ClientValidationFunction="ClientValidate"
           OnServerValidate="ServerValidation"
           Display="Static"
           ErrorMessage="Not an even number!"
           ForeColor="green"
           Font-Name="verdana" 
           Font-Size="10pt"
           runat="server"/>

  <asp:Button id="Button1"
       Text="Validate" 
       OnClick="ValidateBtn_OnClick" 
       runat="server"/>

客户端验证应始终与服务器验证进行双重检查；使用带有客户端/服务器验证功能的 CustomValidator 是实现此目的的好方法。

Answer 2

Remove  script
else {
        return true;
     }
part from script and call function like this 

OnClientClick="javascript:return FindSelectedItems();"
This work for me.