locked
control jquery activity after griedwiev element choosed RRS feed

  • Question

  • User-1193981887 posted

    Hi together...

    Have following asp Code and have Problem to control jquery activity circle and to stop after griedview element choosed.

    If i click btnManger ModalPopupExtender3 id show me MgrPopupPanel1 and i have possibility to choose a user by dobble click on a element in griedview list.

    My Problem is that after choosing the user jquery circle1 is firing and not stopping again.

    Could you please help me to stop jquery acitivty after clicking griedview value..

    Thanks in advance for your help.

    CodeBehind concerning modalpopup extender.

    
    protected void GridView2_Sorting(object sender, GridViewSortEventArgs e)
            {
                ModalPopupExtender3.Show();
            }
    
    protected void GridMail_RowDataBound(object sender, GridViewRowEventArgs e)
            {
    
                if (e.Row.RowType == DataControlRowType.DataRow)
                {
                    string managername = e.Row.Cells[2].Text;
    
                    e.Row.Attributes.Add("ondblclick", "GetGridValue('" + managername + "')");
    
    
                }
            }

    AspPage:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AddUser.aspx.cs" %>
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>New Mailbox RT</title>
        <%--<script src="/Scripts/jquery-2.0.3.js"></script>
        <script src="Scripts/jquery-2.0.3.min.js"></script>--%>
        <script src="../../Scripts/jquery-1.9.1.min.js"></script>
        <link href="../../Styles/ConfirmBox.css" rel="stylesheet" />
        <link href="../../Styles/AddForm.css" rel="stylesheet" />
        <%--<script src="<%# ResolveUrl("~/") %>Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>--%>
    
        <script type="text/javascript">
            function GetGridValue(cellValue) {
                var txtBoxContent = cellValue
                document.getElementById('<%=txtExistingUser.ClientID%>').value = txtBoxContent
                     var modalPopup = $find('mpe')
                     modalPopup.hide()
            }
            function GetGridValue(cellValue) {
                var txtBoxContent = cellValue
                document.getElementById('<%=txtManager.ClientID%>').value = txtBoxContent
                var modalPopup = $find('managerPopup')
                modalPopup.hide()
    
            }
        </script>
    
        <script>
      
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" ScriptMode="Release" runat="server">
                <Scripts>
                    <asp:ScriptReference Path="~/Scripts/jquery-1.7.1.min.js" />
    
                    <asp:ScriptReference Path="~/Scripts/activity-indicator-1.0.0.min.js" />
                </Scripts>
            </ajaxToolkit:ToolkitScriptManager>
            <script>
    
    
                function SubmittProgress() {
                    $(document).ready(function () {
    
                        $(".EditButton").click(function (e) {
                            $('.circle1').activity({ segments: 12, width: 6, space: 0, length: 3, color: '#000', speed: 2 });
    
                        });
    
                    });
                }
            </script>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <script type="text/javascript">
    
                        Sys.Application.add_load(SubmittProgress);
                    </script>
                    <div id="wrap">
                        <div id="formhead">
                            <h1>New User
    
                            </h1>
                        </div>
    
                        <div id="content">
                            <div>
                                <asp:ValidationSummary ID="ValidationSummary1"
                                    HeaderText="You must enter a value in the following fields:"
                                    DisplayMode="List"
                                    ValidationGroup="NeededFields"
                                    EnableClientScript="true"
                                    ForeColor="Red"
                                    runat="server" />
                            </div>
                            <table class="PropertiesTable">
                                <tr>
                                    <td>First Name</td>
                                    <td>
                                        <asp:TextBox ID="txtFirstName" OnTextChanged="txtFirstName_TextChanged" AutoPostBack="true" runat="server"></asp:TextBox>
    
                                    </td>
                                </tr>
                                <tr>
                                    <td>Last Name</td>
                                    <td>
                                        <asp:TextBox ID="txtLastName" OnTextChanged="txtLastName_TextChanged" AutoPostBack="true" runat="server"></asp:TextBox>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Name</td>
                                    <td>
                                        <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
                                        *
    
                    <asp:RequiredFieldValidator ID="NameFieldValidator" runat="server" ControlToValidate="txtName" ForeColor="Red" ValidationGroup="NeededFields" ErrorMessage="Name"></asp:RequiredFieldValidator>
    
                                    </td>
                                </tr>
                                <tr>
                                    <td>UPN Name</td>
                                    <td>
                                        <asp:TextBox ID="txtUpnName" runat="server"></asp:TextBox>
                                        <asp:DropDownList ID="dplDomainSufix" runat="server"></asp:DropDownList>*
                                    <asp:RequiredFieldValidator ID="LogonNameFieldValidator" runat="server" ControlToValidate="txtUpnName" ForeColor="Red" ValidationGroup="NeededFields" ErrorMessage="Logon Name"></asp:RequiredFieldValidator>
                                        <asp:RequiredFieldValidator ID="SufixFieldValidator1" runat="server" ControlToValidate="dplDomainSufix" ForeColor="Red" ValidationGroup="NeededFields" ErrorMessage="InvalidFormat"></asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Logon Name</td>
                                    <td>
                                        <asp:TextBox ID="txtUserLogonName" runat="server"></asp:TextBox>
                                        *
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtUserLogonName" ForeColor="Red" ValidationGroup="NeededFields" ErrorMessage="Logon Name"></asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Display Name</td>
                                    <td>
                                        <asp:TextBox ID="txtDisplayName" runat="server"></asp:TextBox>
                                        *
                         <asp:RequiredFieldValidator ID="DispalyNameFieldValidator" runat="server" ControlToValidate="txtDisplayName" ForeColor="Red" ValidationGroup="NeededFields" ErrorMessage="DisplayName"></asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Alias</td>
                                    <td>
                                        <asp:TextBox ID="txtAlias" runat="server"></asp:TextBox>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Shared Mailbox</td>
                                    <td>
                                        <asp:CheckBox ID="chkbSharedMailbox" runat="server" OnCheckedChanged="chkbSharedMailbox_CheckedChanged" AutoPostBack="true" ToolTip="If checked shared mailbox will be created" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>Copy Groups From</td>
                                    <td>
                                        <asp:DropDownList ID="dpdListPropertyName" ToolTip="Choose  active directory propertyName search criteria" runat="server"></asp:DropDownList>
                                        <asp:TextBox ID="txtSourceUser" OnTextChanged="txtSourceUser_TextChanged" ToolTip="Type in user name or user login name" TabIndex="9" AutoPostBack="true" runat="server"></asp:TextBox>
                                        <%--<asp:RegularExpressionValidator ID="sourcGroupValidator" runat="server" ControlToValidate="txtSourceUser" ValidationGroup="NeededFields" ErrorMessage="Please Enter one of the following format for CopyGroupsFrom: firstName lastName or 4lc" ValidationExpression="([a-zA-Z0-9]*\s[a-zA-Z0-9]*)|([a-zA-Z0-9]{3,8})|([a-zA-Z0-9]*\.[a-zA-Z0-9]*)"></asp:RegularExpressionValidator>--%>
                                    
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:Label runat="server" Text="Create HomeDirectory" ToolTip="If checked home drive will be created"></asp:Label></td>
                                    <td>
                                        <asp:CheckBox ID="chbHomeDrive" ToolTip="If checked home drive will be created" Checked="true" OnCheckedChanged="chbHomeDrive_CheckedChanged" AutoPostBack="true" runat="server" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>Existing User</td>
                                    <td>
                                        <asp:RadioButton ID="rbtnNewMailboxExistUser" GroupName="existUser" runat="server" />
                                        <asp:TextBox ID="txtExistingUser" runat="server"></asp:TextBox>
                                        <asp:Button ID="btnNewMailboxBrowse" CssClass="EditButton" runat="server" Text="Browse" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>New User</td>
                                    <td>
                                        <asp:RadioButton ID="rbtnMailboxNewUser" GroupName="existUser" runat="server" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>Organizational Unit</td>
                                    <td>
                                        <asp:TextBox ID="txtOUPath" runat="server"></asp:TextBox>
                                        *
                                        <asp:Button ID="AddOu" CssClass="EditButton" runat="server" OnClick="AddOu_Click" Text="Browse" />
                                        
                                        <asp:HiddenField ID="hdnfieldOu" runat="server" />
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator4" ValidationGroup="NeededFields" runat="server" ControlToValidate="txtOUPath" ErrorMessage="* OU" ForeColor="Red"></asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Manager</td>
                                    <td>
                                        <asp:TextBox ID="txtManager" runat="server"></asp:TextBox>
                                        <asp:Button ID="btnManager" CssClass="EditButton" Text="Browse" runat="server"></asp:Button>
    
                                    </td>
    
                        <div class="circle1">
                        </div>
    
                    </div>
                    <asp:Panel Style="display: none;" ID="MgrPopupPanel1" runat="server">
                        <div id="MgrPopupMainContent">
                            <div id="MgrPopupToolbox">
                                <asp:TextBox ID="ManagerName" runat="server"></asp:TextBox>
                                <asp:Button ID="SearchManager" CssClass="EditButton" runat="server" Text="Search" OnClick="SearchManager_Click" />
                            </div>
                            <div id="DivGridTableManager">
                                <asp:ObjectDataSource ID="ObjectDataSource2" runat="server" SelectMethod="GetAllUserPrincipals" TypeName="UserManagement.AD.AdManagement"
                                    FilterExpression="LastName like '{0}*'" EnableCaching="false">
                                    <FilterParameters>
                                        <asp:ControlParameter Name="LastName" ControlID="ManagerName" PropertyName="Text" />
                                    </FilterParameters>
                                </asp:ObjectDataSource>
                                <asp:GridView ID="GridView2" runat="server" DataSourceID="ObjectDataSource2"
                                    OnRowDataBound="GridMail_RowDataBound" AllowSorting="True" OnSorting="GridView2_Sorting" AutoGenerateColumns="False">
                                    <Columns>
                                        <asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" />
                                        <asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" />
                                        <%--<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />--%>
                                        <asp:BoundField DataField="AccountName" HeaderText="AccountName" SortExpression="AccountName" />
                                    </Columns>
                                    <FooterStyle CssClass="GridFooter" />
                                    <HeaderStyle CssClass="GridHeader" />
                                    <PagerStyle CssClass="GridPage" />
                                    <RowStyle CssClass="GridRaw" />
                                    <SelectedRowStyle CssClass="GridSelectedRow" />
                                    <SortedAscendingCellStyle CssClass="GridSort" />
                                </asp:GridView>
                                <br />
                            </div>
                            <asp:Button ID="btnCloseManager" CssClass="EditButton" runat="server" Text="Close" />
                            <asp:Button ID="btnOkManager" CssClass="EditButton" runat="server" Text="OK" />
                        </div>
                    </asp:Panel>
    
                    <ajaxToolkit:ModalPopupExtender
                        ID="ModalPopupExtender3"
                        TargetControlID="btnManager"
                        PopupControlID="MgrPopupPanel1"
                        OkControlID="OKButton" CancelControlID="CloseButton"
                        BehaviorID="managerPopup" runat="server">
                    </ajaxToolkit:ModalPopupExtender>
    
                </ContentTemplate>
            </asp:UpdatePanel>
        </form>
    </body>
    </html>
    

    Monday, November 26, 2018 2:22 PM

Answers

  • User-893317190 posted

    Hi blentoza,

    If you open F12 , you will see your .circle1 div changes after you open the model pop up.

    So, if you want to make the circle disappear after you have chosen the  user,you could clear the content of the .circle1 div.

    <div class="circle1">
    <div style="width: 38px; height: 38px; ; margin-top: -19px; margin-left: 933px;">
    <svg style="width: 38px; height: 38px;"><g transform="translate(19,19)"><g stroke-width="6" stroke-linecap="round" stroke="#000" transform="rotate(60)"><line x1="0" y1="12" x2="0" y2="15" transform="rotate(0, 0, 0)" opacity="1"></line>
    <line x1="0" y1="12" x2="0" y2="15" transform="rotate(30, 0, 0)" opacity="0.9173553719008265"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(60, 0, 0)" opacity="0.8347107438016529"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(90, 0, 0)" opacity="0.7520661157024794"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(120, 0, 0)" opacity="0.6694214876033058"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(150, 0, 0)" opacity="0.5867768595041323"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(180, 0, 0)" opacity="0.5041322314049588"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(210, 0, 0)" opacity="0.42148760330578516"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(240, 0, 0)" opacity="0.33884297520661155"></line>
    <line x1="0" y1="12" x2="0" y2="15" transform="rotate(270, 0, 0)" opacity="0.25619834710743805"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(300, 0, 0)" opacity="0.17355371900826455"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(330, 0, 0)" opacity="0.09090909090909094"></line></g></g></svg>
    </div></div>

    Below is my code.

         
            <script>
    
    
                function SubmittProgress() {
                    $(document).ready(function () {
    
                        $(".EditButton").click(function (e) {
                            $('.circle1').activity({ segments: 12, width: 6, space: 0, length: 3, color: '#000', speed: 2 });
                           
                        });
    
                    });
                }
     
            function GetGridValue(cellValue) {
                var txtBoxContent = cellValue
                document.getElementById('<%=txtManager.ClientID%>').value = txtBoxContent
                var modalPopup = $find('managerPopup')
                modalPopup.hide()
            
                $('.circle1').html("");
    
                }
             
            </script>

    You could do the same thing in your other function if you want the circle to disappear.

    The result.

    Best regards,

    Ackerly Xu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, November 27, 2018 4:44 AM

All replies

  • User-893317190 posted

    Hi blentoza,

    If you open F12 , you will see your .circle1 div changes after you open the model pop up.

    So, if you want to make the circle disappear after you have chosen the  user,you could clear the content of the .circle1 div.

    <div class="circle1">
    <div style="width: 38px; height: 38px; ; margin-top: -19px; margin-left: 933px;">
    <svg style="width: 38px; height: 38px;"><g transform="translate(19,19)"><g stroke-width="6" stroke-linecap="round" stroke="#000" transform="rotate(60)"><line x1="0" y1="12" x2="0" y2="15" transform="rotate(0, 0, 0)" opacity="1"></line>
    <line x1="0" y1="12" x2="0" y2="15" transform="rotate(30, 0, 0)" opacity="0.9173553719008265"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(60, 0, 0)" opacity="0.8347107438016529"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(90, 0, 0)" opacity="0.7520661157024794"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(120, 0, 0)" opacity="0.6694214876033058"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(150, 0, 0)" opacity="0.5867768595041323"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(180, 0, 0)" opacity="0.5041322314049588"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(210, 0, 0)" opacity="0.42148760330578516"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(240, 0, 0)" opacity="0.33884297520661155"></line>
    <line x1="0" y1="12" x2="0" y2="15" transform="rotate(270, 0, 0)" opacity="0.25619834710743805"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(300, 0, 0)" opacity="0.17355371900826455"></line><line x1="0" y1="12" x2="0" y2="15" transform="rotate(330, 0, 0)" opacity="0.09090909090909094"></line></g></g></svg>
    </div></div>

    Below is my code.

         
            <script>
    
    
                function SubmittProgress() {
                    $(document).ready(function () {
    
                        $(".EditButton").click(function (e) {
                            $('.circle1').activity({ segments: 12, width: 6, space: 0, length: 3, color: '#000', speed: 2 });
                           
                        });
    
                    });
                }
     
            function GetGridValue(cellValue) {
                var txtBoxContent = cellValue
                document.getElementById('<%=txtManager.ClientID%>').value = txtBoxContent
                var modalPopup = $find('managerPopup')
                modalPopup.hide()
            
                $('.circle1').html("");
    
                }
             
            </script>

    You could do the same thing in your other function if you want the circle to disappear.

    The result.

    Best regards,

    Ackerly Xu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, November 27, 2018 4:44 AM
  • User-1193981887 posted

    Hi Ackerly

    Thank you very much.You saved my time.

    Great answer..

    I tested it and its working fine...

    Greetings

    Tuesday, November 27, 2018 7:54 AM