Maintain Bootstrap DropDownList toggle opened on DropDownList selection changed using jQuery in ASP.Net

amitsing...

SOLVED CLOSED ACTIVE ANSWERED
User: amitsinghr
Posted: on Apr 26, 2017 12:53 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 4442

please flow image link

dear sir in my below HTML design inside last, there is the link button I use the boostrap drop down concept to show some more user option (two more dropdown and one submit button )

after click on link button bootstrap drop down the show and there are more user option (two more dropdowns) my problem is that when I click on any option my bootstrap drop down gone I want to select my two more option and click on submit button after that this bootstrap dropdown close

<asp:Repeater ID="rptUnAssignCall" runat="server" OnItemDataBound="rptUnAssignCall_ItemDataBound">
    <ItemTemplate>
        <tr>
            <td>
                <%#Eval("TicketNo") %>
            </td>
            <td>
                <%#Eval("ContectNo") %>
            </td>
            <td>
                <%#Eval("Time") %>
            </td>
            <td>
                <%#Eval("CreatedBy") %>
            </td>
            <td>
                <%#Eval("Intrereast") %>
            </td>
            <td>
                <%#Eval("QueryType") %>
            </td>
            <td>
                <%#Eval("Query") %>
            </td>
            <%--      <td><%# ((int)Eval("Status")==1)? "<span class='label label-warning'>Unassign</span>":""%></td>--%>
            <td>
                <div class="dropdown">
                    <div class="btn-group pull-right">
                        <asp:LinkButton ID="LinkButton5" class="dropdown-toggle" data-toggle="dropdown" runat="server"> <i class="fa fa-user-plus"></i></span> </asp:LinkButton>
                        <span class="sr-only">Toggle Dropdown</span>
                        <ul class="dropdown-menu bg-olive" role="menu">
                            <li>
                                <div class="row">
                                    <div class="col-md-offset-1 col-md-10 col-md-offset-1">
                                        <p>
                                            Ticket No :
                                            <%#Eval("TicketNo") %></p>
                                        <div class="form-group">
                                            <label>
                                                Department</label>
                                            <asp:DropDownList ID="ddlDepartment" class="form-control" runat="server">
                                            </asp:DropDownList>
                                        </div>
                                        <div class="form-group">
                                            <label>
                                                User</label>
                                            <asp:DropDownList ID="ddlUser" class="form-control" runat="server">
                                            </asp:DropDownList>
                                        </div>
                                        <button type="submit" class="btn btn-default">
                                            Submit</button>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </td>
        </tr>
        </tr><%--, .control-sidebar-dark+.control-sidebar-bg--%>
    </ItemTemplate>
</asp:Repeater>

Indresh

0 3

Reply
ANSWER
User: Indresh
Replied: on Apr 26, 2017 07:55 AM
Modified: on Apr 26, 2017 07:56 AM
Report

Hi amitsinghr,

I have assigned id "dvOpen" in your div tag.You need to use below code and modify as per your requirement.

HTML

<div>
        <asp:Repeater ID="rptUnAssignCall" runat="server">
            <ItemTemplate>
                <tr>
                    <td>
                        <%#Eval("TicketNo") %>
                    </td>
                    <td>
                        <%#Eval("ContectNo") %>
                    </td>
                    <td>
                        <%#Eval("Time") %>
                    </td>
                    <td>
                        <%#Eval("CreatedBy") %>
                    </td>
                    <td>
                        <%#Eval("Intrereast") %>
                    </td>
                    <td>
                        <%#Eval("QueryType") %>
                    </td>
                    <td>
                        <%#Eval("Query") %>
                    </td>
                    <%--      <td><%# ((int)Eval("Status")==1)? "<span class='label label-warning'>Unassign</span>":""%></td>--%>
                    <td>
                        <div class="dropdown">
                            <div id="dvOpen" class="btn-group pull-right">
                                <asp:LinkButton ID="LinkButton5" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
                                    aria-expanded="true" runat="server"> <i class="fa fa-user-plus"></i></span> </asp:LinkButton>
                                <span class="sr-only">Toggle Dropdown</span>
                                <ul class="dropdown-menu bg-olive" role="menu">
                                    <li>
                                        <div class="row">
                                            <div class="col-md-offset-1 col-md-10 col-md-offset-1">
                                                <p>
                                                    Ticket No :
                                                    <%#Eval("TicketNo") %></p>
                                                <div class="form-group">
                                                    <label>
                                                        Department</label>
                                                    <asp:DropDownList ID="ddlDepartment" class="intitialize form-control " runat="server">
                                                    </asp:DropDownList>
                                                </div>
                                                <div class="form-group">
                                                    <label>
                                                        User</label>
                                                    <asp:DropDownList ID="ddlUser" class="intitialize form-control" runat="server">
                                                    </asp:DropDownList>
                                                </div>
                                                <button type="submit" class="btn btn-default">
                                                    Submit</button>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </td>
                </tr>
                </tr><%--, .control-sidebar-dark+.control-sidebar-bg--%>
            </ItemTemplate>
        </asp:Repeater>
        <div>
            <script type="text/javascript">
                $(function () {
                    $('.intitialize').click(function () {
                        $(this).closest('li').parent().parent().parent().find('[id*=dvOpen]').addClass('btn-group pull-right open');
                        return false;
                    });
                }); 
    
            </script>
        </div>
    </div>

Maintain Bootstrap DropDownList toggle opened on DropDownList selection changed using jQuery in ASP.Net

Company

Explore

Follow us

Contact Us