CODEWITHSUNDEEP
javascriptjquery
Ranjit
Ranjit

Reputation: 1724

To get the letter when i click on the that letter

I have tab which have A-Z letters. for that i wrote this 

    <div id="tabs">
      <ul>
        <li><a href="#tabs-1">By First Name</a></li>
      </ul>
      <div id="tabs-1">
        <ul class="find-agent">
          <?php for ($char=65; $char < 91; $char++ )
          echo '<li><a href="'.site_url().'/members/?filterby=first_name&filter='. chr($char).'">'.chr($char).'</a></li>';?>
          <form id="members-search" action="members">
            <input type="text" name="q" size="100" style=" margin: 0; "/>
            <input type="submit" value="Search" placeholder="Type a Agent Name" class="btn btn-primary"/>
          </form>
        </ul>
      </div>
  </div>

Now i want to get the letter, when i click on the letter. Is that possible in that way or i have to use get method to get the letter which is clicked.

Upvotes: 0

Views: 882

Answers (3)

null
null

Reputation: 1178

I suggest using JQuery Ajax to send a GET request to your "members" page. This way you can pre-check what letter was clicked before sending it to the server and you get to load your list of names dynamically instead of having to reload the whole page.

<script type="text/javascript">
$(document).ready(function() {  
    $(".alphabet").click(function(){
     var selected_letter= $(this).text());
     /* if you want to do something with this letter before sending it to the  
      * server here is your chance.
      */
    $.ajax({
          type: "GET",
          url: 'your_site/members/?filterby=first_name&filter='+selected_letter,
          success: function (list_of_names) {
              // do something with this list
          }
        }); 
    }); 
});

</script>
<div id="tabs">
      <ul>
        <li><a href="#tabs-1">By First Name</a></li>
      </ul>
      <div id="tabs-1">
        <ul class="find-agent">
          <?php for ($char=65; $char < 91; $char++ )
          echo '<li class="alphabet">'.chr($char).'</li>';?>
          <form id="members-search" action="members">
            <input type="text" name="q" size="100" style=" margin: 0; "/>
            <input type="submit" value="Search" placeholder="Type a Agent Name" class="btn btn-primary"/>
          </form>
        </ul>
      </div>
  </div>

Upvotes: 0

Samuel Liew
Samuel Liew

Reputation: 79032

$('.find-agent').on('click', 'li', function() {
    var letter = $(this).text();

    // Do whatever you want with the letter
    alert(letter);
});

DEMO: http://jsfiddle.net/BudZ2/2

Upvotes: 2

azzy81
azzy81

Reputation: 2269

If you want to get the letter using only PHP then $_GET or $_REQUEST will be your method. Other than this you could look at adding a click event to the link using something like jquery which would give you the letter client side.

Whatever page is at /members/ (hopefully a php page) you should be be able to access the letter (filter) with $_GET['filter'] or $_REQUEST['filter']

Upvotes: 2

Related Questions