CODEWITHSUNDEEP
javascriptjquery
Liam
Liam

Reputation: 9855

If P tag is display:none; Javascript

I have the following...

 $(document).ready(function() {
        $('p:contains("You")').parent('span').prev('input').addClass('error');
  });

My function works fine given that it adds the class to the correct inputs but it should only add the class if the paragraph containing 'you' is display:inline.

Has anybody any idea of how I can do this?

My markup for each input is similar to this....

<li class="yourdetli">
    <label class="yourdet">House Number</label>
    <input type="text" id="ctl00_ContentPlaceHolder1_TB_HNumber2" name="ctl00$ContentPlaceHolder1$TB_HNumber2">
    <span style="color: Red; display: none;" class="errorp" id="ctl00_ContentPlaceHolder1_RequiredFieldValidator9">
        <p>You must complete this field</p>
    </span>
 </li>

Upvotes: 0

Views: 481

Answers (4)

Yogurt The Wise
Yogurt The Wise

Reputation: 4499

:contains is case sensitive. "You" Not sure if that is the problem.

Upvotes: 0

kylewelsby
kylewelsby

Reputation: 4109

You may want to try collecting all <p> tags that contain you and loop though all of them with a if statement.

If css display is inline then add error to input.

This may help

$(document).ready(function(){
  $("p:contains('you')").each(function(){
    if($(this).css('display') === 'inline'){
      $(this).parent('span').prev(':input').addClass('error');
    }
  });
});

Upvotes: 1

John Strickler
John Strickler

Reputation: 25421

$('p:contains("You"):visible')

Assuming you aren't changing the display on your paragraphs anywhere in the document.

Upvotes: 1

Nicola Peluchetti
Nicola Peluchetti

Reputation: 76890

You could use filter() and check the display property:

 $(document).ready(function() {
        $('p:contains("You")').filter(function(){
                               return $(this).css('display') === 'inline';
                               })
                               .parent('span')
                               .prev('input')
                               .addClass('error');
  });

filter keeps the element if the function returns true

Upvotes: 2

Related Questions