javascript - Jquery check for existence of textbox and validate -

i have 1 textbox date, 1 dropdown list, 3 text box input values. depends on condition either 2 or 3 text boxes displayed, text box date , dropdownlist common both conditions. of them including date textbox , dropdownlist mandatory fields. if user clicks button need check whether entered required fields or not, need check results. if missed enter of required fields should display missed field red border-color.

my code:

$("#btncheck").click(function(){ //this "validate" function check , if required field missing change border-color of element validate(date, firsttextbox, secondtextbox, thirdtextbox, dropdownvalue); if (date.length > 0 && firsttextbox.length > 0 && secondtextbox.length > 0 && dropdownvalue != "") {     //it call ajax function } });  function validate(date, firsttextbox, secondtextbox, thirdtextbox, dropdownvalue) {     $("#txtdate, #txt1, #txt2, #ddlvalue").css("border-color", "");     if (date.length == 0) { $("#txtdate").css("border-color", "red"); }     if (firsttextbox.length == 0) { $("#txt1").css("border-color", "red"); }     if (secondtextbox.length == 0) { $("#txt2").css("border-color", "red"); }     if (dropdownvalue == "") { $("#ddl").css("border-color", "red"); } } 

my req:

if 3rd text box present on web page, need validate input 3rd textbox , if user entered input should call ajax function.

any in lot helpful me. in advance.

i've put rudimentary fiddle simple validation.

if input not valid, function stops , tells user data missing.

if first 4 variables have valid data (validcheck = 'yyyy'), 5 variables passed server ajax, , server store first 4 (all valid, therefore storable), , fifth stored if exists, if not, not stored.

i'm not sure if concept work you.

js

var datevalue, compass, textone, texttwo, textthree; var validcheck; $('#clickme').on('click', function(){                  datevalue = $('#date').val();                  compass = $('#firstoption').val();                  textone = $('#firsttext').val();                  texttwo = $('#secondtext').val();                  textthree = $('#thirdtext').val();                  validateme(datevalue, compass, textone, texttwo, textthree); });  function validateme(one, two, three, four, five) {   if( one.length < 2 )     {      $('#date').css('border', '2px solid red');      $('#date2').html('required');      validcheck = 'n';      }       else     { validcheck = 'y'; }   if( two.length < 1 )   {    $('#firstoption').css('border', '2px solid red');    $('#firstoption2').html('required');    validcheck = validcheck + 'n';    }     else { validcheck = validcheck  + 'y'; }   if( three.length < 1 )   {    $('#firsttext').css('border', '2px solid red');    $('#firsttext2').html('required');    validcheck = validcheck + 'n';    }     else { validcheck = validcheck + 'y'; }    if( four.length < 1 )   {    $('#secondtext').css('border', '2px solid red');    $('#secondtext2').html('required');    validcheck = validcheck + 'n';    }     else { validcheck = validcheck  + 'y'; }    if( validcheck == 'yyyy' )     {      //pass one, two, three, four, 5 server ajax      alert('pass 5 variables ajax');      } }