Создание пользовательских элементов управления - PullRequest
0 голосов
/ 07 марта 2011

Этот код работает нормально, если я использую его на обычной странице (например, Default.aspx).Я хочу использовать это в UserControl.

Как я могу это сделать?

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>Check/Uncheck All CheckBoxes Using JQuery</title>

    <script src="Scripts/jquery-1.2.6.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function() {
            $('#chkAll').click(
             function() {
                 $("INPUT[type='checkbox']").attr('checked', $('#chkAll').is(':checked'));
             });
         });    

     </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:CheckBox ID="chkAll" runat="server" Text="Check All" /><br />

        <asp:CheckBoxList ID="cbList" runat="server">
        </asp:CheckBoxList>

    </div>
    </form>
</body>
</html>

Ответы [ 2 ]

0 голосов
/ 07 марта 2011

Существует много сложностей при создании пользовательских сценариев управления с поддержкой сценариев, например, ASP.NET - JQuery

В общем: вам нужно сделать свой контейнер именования сценариев безопасным.Ссылки по идентификатору DOM необходимо сделать для идентификатора клиента ASP.NET (ответ @ FarligOpptredn) или, альтернативно, использовать селекторы CSS (если только создаваемая вами функция не относится к конкретному экземпляру).

В идеале,создайте весь свой клиентский скрипт в JS-файле и зарегистрируйте его из кода, используя ScriptManager.Это позволяет использовать сценарий повторно и избежать конфликтов между экземплярами UserControl.Поскольку вы не можете использовать скриптлеты (<%= ... %>) в файле JS, вместо этого используйте параметры для ссылки на объекты в UserControl DOM или используйте селекторы CSS.И используйте this в событиях вместо жестких ссылок.Пример

myUserControl.js:

 $(document).ready(function() {
            $('.myUserControl > .chkAll').click(
             function() {
                 $("INPUT[type='checkbox']").attr('checked', $(this).is(':checked'));
             });
         }); 

myUserControl.ascx:

<div class="myUserControl">

    <asp:CheckBox ID="chkAll" class="chkAll" runat="server" Text="Check All" /><br />

    <asp:CheckBoxList ID="cbList" runat="server">
    </asp:CheckBoxList>

</div>

Это также облегчит чтение и отладку вашего скрипта по сравнению со встроенным скриптом смного побега.

0 голосов
/ 07 марта 2011

Флажки имеют другой идентификатор клиента при помещении в пользовательский элемент управления, с добавлением идентификатора пользовательского элемента управления.Попробуйте изменить ваш jQuery следующим образом:

$(document).ready(function() {
   $('#<%=chkAll.ClientID %>').click(
    function() {
        $("INPUT[type='checkbox']").attr('checked', $('#<%=chkAll.ClientID %>').is(':checked'));
    });
});   
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...