开发者

how to call the jquery function in .aspx page to usercontrols controls in asp.net?

开发者 https://www.devze.com 2023-02-07 14:03 出处:网络
i have the following function in default.aspx.....i have webuser开发者_开发知识库control which have 10 checkboxes and 1 button .... i want when i click on button1 of user control then it can access th

i have the following function in default.aspx.....i have webuser开发者_开发知识库control which have 10 checkboxes and 1 button .... i want when i click on button1 of user control then it can access the function of default.aspx ...page ...if i dragged the usercontrol to default.aspx

Normally if i use 10 checkboxes and 1 button in default.aspx then it works fine ... if i use 10checkboxes and 1button in usercontrol then drag that usercontrol in default.aspx then it will not work ..

what was the problem ...how to fix this ?

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>

<%@ Register src="WebUserControl.ascx" tagname="WebUserControl" tagprefix="uc1" %>

<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <uc1:WebUserControl ID="WebUserControl1" runat="server" />

    </div>
    </form>
     <script src ="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
      <script type="text/javascript">

      $("#'<%=Button1.ClientID %>'").click(function(){

    var vCheckedCBCount =  $("input:checkbox").filter(function(index){ 
    return $(this)[0].checked == true;
    }).length;
    if(vCheckedCBCount > 1)
    {
        alert('You cannot check more than 1 check box.');
        return false;
    } 
});
 </script >
   </body>
</html>


Try this one -->

------------------------------------ASPX Code------------------------------------------------------------------------------

ASPX:

<%@ Register Src="~/UserControl/WebUserControl.ascx" TagName="ucCheckBox" TagPrefix="UC" %>

<UC:ucCheckBox ID="ucCheckBox" runat="server" />

JAVASCRIPT:

$(document).ready(function(){

    $("input:submit[id$='btnSubmit']").click(function(){

        var vCheckedCBCount =  $("input:checkbox").filter(function(index){
        return $(this)[0].checked == true;
        }).length;
        if(vCheckedCBCount > 5)
        {
            alert('You cannot check more than 5 check box.');
            return false;
        } 
    });
});

------------------------------------ASPX Code------------------------------------------------------------------------------

-------------------------------User control code--------------------------------------

UserControl:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="UserControl_WebUserControl" %>
<asp:CheckBox ID="CheckBox1" runat="server" /><br />
<asp:CheckBox ID="CheckBox2" runat="server" /><br />
<asp:CheckBox ID="CheckBox3" runat="server" /><br />
<asp:CheckBox ID="CheckBox4" runat="server" /><br />
<asp:CheckBox ID="CheckBox5" runat="server" /><br />
<asp:CheckBox ID="CheckBox6" runat="server" /><br />
<asp:CheckBox ID="CheckBox7" runat="server" /><br />
<asp:CheckBox ID="CheckBox8" runat="server" /><br />
<asp:CheckBox ID="CheckBox9" runat="server" /><br />
<asp:CheckBox ID="CheckBox10" runat="server" /><br />
<asp:Button ID="btnSubmit" runat="server" Text="Continue" />

-------------------------------User control code--------------------------------------


Try

$("#'<%=Button1.ClientID %>'").click(function(){
});

A usercontrol implements INamingContainer Interface. So in order to get the elements using id you need to get the runtime generated id by using .ClientID.


When you added the usercontrol to default.aspx, the ID of Button1 changed to userControl1_Button1

So you need to change $("#Button1").click(function() so that it will always have the correct name for the button:

$("# + <%=Button1.ClientID %> +").click(function()
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号