Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Jun 2012
    Posts
    137
    Thanks
    1
    Thanked 1 Time in 1 Post

    Suggestions for how to look at first letter, add letter block

    Hello,

    OK, at this point I have populated a glossary div. When a user clicks on a term this glossary pops-up with all of the terms taken from an XMl file in alphabetical order.

    Now what I am trying to do is add the letters 'A', 'B', etc at the beginning of each block of terms beginning with that letter.

    Is there an easy way to do this? I was thinking about creating an array with all of the letters of the alphabet, checking the first letter of each term, if it matches, create a new span with that letter, increment the array pointer to look for the next letter.

    Is this an efficient way to do it?

    This is what I have so far:
    Code:
    		$(glossaryXML).find('item').each(function()
    		{
    			if($(this).attr('term').substr(0,1) == 'A')
    			{
    				$("#glossaryContent").append("<br /><span class='glossAcro'>" + $(this).attr('term') + "</span><br />");
    			}
    			$("#glossaryContent").append("<br /><span class='glossAcro'>" + $(this).attr('term') + "</span>" + "<span class='glossDef'>" + $(this).attr('def') + "</span><br />");
    			
    		});

  • #2
    Regular Coder
    Join Date
    Jun 2012
    Posts
    137
    Thanks
    1
    Thanked 1 Time in 1 Post
    Well, I already see a problem.

    If there isn't a term that begins with the next letter, it breaks. In other words if the code is looking for 'Q', but there aren't any terms that begin with 'Q' the array index does not increment so the code looks for 'Q' and misses all of the letters after 'Q'.


    Code:
    var letterArr2 = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
    		var letteArrIndex = 0;
    		$(glossaryXML).find('item').each(function()
    		{
    			if($(this).attr('term').substr(0,1).toUpperCase() == letterArr2[letteArrIndex])
    			{
    				$("#glossaryContent").append("<br /><span class='glossAcro'>" + letterArr2[letteArrIndex] + "</span><br />");
    				letteArrIndex++;
    			}
    			$("#glossaryContent").append("<br /><span class='glossAcro'>" + $(this).attr('term') + "</span>" + "<span class='glossDef'>" + $(this).attr('def') + "</span><br />");
    			
    		});

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,596
    Thanks
    80
    Thanked 4,631 Times in 4,594 Posts
    How about this?
    Code:
        var letters = "abcdefghijklmnopqrstuvwxyz";
        $(glossaryXML).find('item').each(function()
        {
            var first = ($(this).attr('term').charAt(0).toLowerCase();
            if ( letters.indexOf(first) >= 0 ) /* if that letter is still in the list of letters... */
            {   
                letters = letters.replace(first,"*"); /* kill that letter so can't be found again */
                $("#glossaryContent").append(...);
            }
            $("#glossaryContent").append(...);
        } );
    Sneaky?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •