addClass removeClass in JQuery

Hello Eperts,
I have two Text (not required) fields.  But if one field has a value, the other is required.  I have to use jQuery as all other validations are done using jQuery.  Could you please provide me a good example?  Thank you in advance.
RadhaKrishnaKiJayaAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

leakim971PluritechnicianCommented:
Hello RadhaKrishnaKiJaya,

Example at the following address are not sufffisant ?
http://api.jquery.com/addClass/
http://api.jquery.com/removeClass/

Regards
NishchayaAndrewCommented:
Hello RadhaKrishnaKiJaya,

you can do this by Javascript. what you have to do is just add the html event to first textbox & one js function to force your jquery valdator mathod to check both control .

if you add onblur event to first textbox, like in first text box

<input type="text" id="txt1" onbulr="javascript:addvalidation(this.value)"............../>

<input type="text" id="txt2" ............../>

now in your JS block

function addvalidation(val)
{
           if (val !="")
           {
                  //put the some flag for ur jquery validator here. so this + txt2 control is also get check  
                 // before  submit like one global var chkboth=true;
           }else{
                 //remove the flag value  like our global var chkboth=false;
}
}


hope above is helpful.

Cheers
RadhaKrishnaKiJayaAuthor Commented:
Hi leakim971,  Thank you for your response.  I  looked at your links.  Not the one I wanted in fact.  I need to use addClass / removeClass with text fields.  Please let me know if you any other idea.  Thank you very much for your help.
leakim971PluritechnicianCommented:
Seems I don't understand but what about :


$('#mytextfieldid').addClass('myClass yourClass');

your textfield like that :

<input type="text" id="mytextfieldid" />

Open in new window

chuckaliciousCommented:
ok, here's how I'd do it.

Assume:

field 1 has ID "f1"
field 2 has ID "f2"
required class is called "required"

You could improve the code below by changing most of it into a single function and just calling it from the .blur event but you get the idea.
$(document).ready(function(){
 $("#f1").blur(function(){
  if ($(this).val().length>0) {
    $("#f2").addClass('required');
  }
  else
  {
    $("#f2").removeClass('required');
   }
});
 $("#f2").blur(function(){
  if ($(this).val().length>0) {
    $("#f1").addClass('required');
  }
  else
  {
    $("#f1").removeClass('required');
   }
});
});

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
.NET Programming

From novice to tech pro — start learning today.