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 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Feb 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Check if div is empty

    Hi all!

    I'm new at JQuery, so any help would be appreciated. I'm trying to validate if a div is empty. The html is:

    <label id="label1" style="display:none;">Something</label>
    <div class="class1">Sometimes there is nothing here</div>

    If the div is not empty (and sometime it is empty) i have to add a new class to it (<div class="class1 class2"></div>) and change the display for the label to become visible.

    I was trying something like this, but can't get it to work:

    if ($(".class1:not(:empty)"))
    {
    $(".label1").show();
    $(".class1").addClass("class2");
    }

    Thanks in advance

  • #2
    New Coder
    Join Date
    Feb 2010
    Location
    New Zealand
    Posts
    76
    Thanks
    7
    Thanked 10 Times in 9 Posts
    If it's not empty but has whitespace in it, there maybe problems, try...

    if($.trim($(".class1").text()) != "") {

    }

  • #3
    New to the CF scene
    Join Date
    Feb 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi Azzaboi,

    thanks for your reply, but the thing is, that there may be other div's inside of my div, or an iframe.. so checking for text is not enough for me.. Empty seems great for my needs, but my biggest problem here is to get the syntax right:

    .class1:not(:empty)

    This one above is not working, so if you can correct me, I would be gratefull

  • #4
    New Coder
    Join Date
    Feb 2010
    Location
    New Zealand
    Posts
    76
    Thanks
    7
    Thanked 10 Times in 9 Posts
    In that case, you might just be missing the quotes?

    For example, correct format i think is:

    if ($('.class1').is(':empty')) {

    }

    In your case:

    if ($('.class1').not(':empty')) {
    $('.label1').show();
    $('.class1').addClass('class2');
    }

  • #5
    Senior Coder Spudhead's Avatar
    Join Date
    Jun 2002
    Location
    London, UK
    Posts
    1,856
    Thanks
    8
    Thanked 110 Times in 109 Posts
    Code:
    $(document).ready(function() {
    
    	$('div.class1:not(:empty)').addClass('highlight').prev('label').show();
    	
    });
    works against:

    Code:
    <label id="label1">label1</label>
    <div class="class1" id="div1"><p>hello</p></div>
    
    <label id="label2">label2</label>
    <div class="class1" id="div2"><p></p></div>
    
    <label id="label3">label3</label>
    <div class="class1" id="div3">hello</div>
    
    <label id="label4">label4</label>
    <div class="class1" id="div4"></div>

  • #6
    New to the CF scene
    Join Date
    May 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    As for assigning IDs to each div so that you can reference them from javascript: well, there are a few different approaches you could take. Here's one: if the HTML is constructed with a loop, simply use a loop-counter to append a number to the end of a cahsee exam basename for each div (i.e. 'mydiv'+i). Then pass along the number of divs in a javascript variable declared in the head of your page.if that doesn't help, then I think you need to provide a little more information about the "scripts" and "template" you referred to. i.e. what language(s) and how are the div's populated/built.


  •  

    Posting Permissions

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