• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 88
  • Last Modified:

Getting value of <li> using JQuery/JS

I am trying to get the whatever option is clicked values inside the <li> starting from "Advanced" all way to "Status" and "Properties" to "ProdSimple" and "Linked Servers" all way to "SDBUsers" and "Paging Analysis" all way to "RepCmp"

  <nav role="navigation" class="navbar navbar-custom">
      <div class="container-fluid">
          <div class="navbar-header">
            <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
          <a class="navbar-brand" href="#"><img src="images/database_brand.png" alt="Database" /></a>
          <div id="navbarCollapse" class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li id="prm_lnk" class="active"><a href="#">Dashboard</a></li>
                <li class="dropdown" > <a href="#" data-toggle="dropdown">Reports <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                      <li class="dropdown-submenu"><a href="#" tabindex="-1" data-toggle="dropdown">Instance</a>
                        <ul  class="dropdown-menu">
                          <li><a href="#" tabindex="-1">Advanced</a></li>
                          <li'><a href="#" tabindex="-1" id ="agent">Agent</a></li>
                          <li><a href="#" tabindex="-1">General</a></li>
                          <li><a href="#" tabindex="-1">ServerConfig</a></li>
                          <li><a href="#" tabindex="-1">Restart</a></li>
                          <li><a href="#" tabindex="-1">Local Date and Time</a></li>
                          <li><a href="#" tabindex="-1">Alerts & Operators</a></li>
                          <li><a href="#" tabindex="-1">Mail Status</a></li>
                          <li><a href="#" tabindex="-1">Status</a></li>

                      <li class="dropdown-submenu"><a href="#" tabindex="-1" data-toggle="dropdown">Database</a>
                        <ul class="dropdown-menu">
                          <li><a href="#" tabindex="-1">Properties</a></li>
                          <li><a href="#" tabindex="-1">Backup Properties</a></li>
                          <li><a href="#" tabindex="-1">File Properties</a></li>
                          <li><a href="#" tabindex="-1">Partitioning</a></li>
                          <li><a href="#" tabindex="-1">BackupSizes</a></li>
                          <li><a href="#" tabindex="-1">ProdSimple</a></li>
                       <li class="dropdown-submenu"><a href="#" tabindex="-1" data-toggle="dropdown">Security</a>
                        <ul class="dropdown-menu">
                          <li><a href="#" tabindex="-1">Linked Servers</a></li>
                          <li><a href="#" tabindex="-1">Local Administrators</a></li>
                          <li><a href="#" tabindex="-1">Logins Not Used</a></li>
                          <li><a href="#" tabindex="-1">Orphaned Users</a></li>
                          <li><a href="#" tabindex="-1">SysAdmins</a></li>
                          <li><a href="#" tabindex="-1">ServerRole Members</a></li>
                          <li><a href="#" tabindex="-1">Blank Passwords</a></li>
                          <li><a href="#" tabindex="-1">AgentProxy</a></li>
                          <li><a href="#" tabindex="-1">SLogins</a></li>
                          <li><a href="#" tabindex="-1">SDBUsers</a></li>
                         <li class="dropdown-submenu"><a href="#" tabindex="-1" data-toggle="dropdown">Logs</a>
                        <ul class="dropdown-menu">
                          <li><a href="#" tabindex="-1">Paging Analysis</a></li>
                          <li><a href="#" tabindex="-1">Paging Details</a></li>
                          <li><a href="#" tabindex="-1">RepCmp</a></li>
<%--                      <li><a href="#" tabindex="-1">Oracle Reports</a></li>                     --%>

Open in new window

2 Solutions
Ess KayEntrapenuerCommented:
$("#dropdown-menu li").click(function() {
    alert(this.id); // id of clicked li by directly accessing DOMElement property
    alert($(this).attr('id')); // jQuery's .attr() method, same but more verbose
    alert($(this).html()); // gets innerHTML of clicked li
    alert($(this).text()); // gets text contents of clicked li

Open in new window

hope that helps
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
I'm not sure what you are after.  I am going to guess below

  $('.dropdown-submenu ul.dropdown-menu li').on('click', function(){

Open in new window

Member_2_7966896Author Commented:
Thank you guys! Exactly what I was looking for.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now