简体   繁体   中英

How to check if at least one input is completed?

I have this sample:

link

CODE HTML:

<form class="add-patient">
  <fieldset style="display: block;">
          <label for="new_exam">New exam</label>
          <input type="text" name="new_exam" id="new_exam" value="">
  </fieldset>
  <fieldset style="display: block;">
          <label for="x_ray">X ray</label>
          <input type="text" name="x_ray" id="x_ray"  value="">
  </fieldset>
  <input type="button" class="btn btn-submit" onclick="sendForm();" value="Create report">
</form>  

CODE JS:

 function sendForm() {
        var status_form = false;
        $(".add-patient input").each(function(){
           if($(this).val() == ""){
             status_form = true;
           }
        });
        console.log(status_form);
        var createdBy = jQuery('#created_by').val();

        if( status_form )
        {
            alert('Fill at least one field');
        }else{
            alert("now it's ok");
        }
 }

I want to do a check ... if an input is complete when displaying the message "it; s ok" ... otherwise displaying another message probably means the code clearly what they want to do.

You can help me with a solution please?

Thanks in advance!

Use .filter to get the length of the input elements having value as ''

Try this:

 function sendForm() { var elem = $(".add-patient input[type='text']"); var count = elem.filter(function() { return !$(this).val(); }).length; if (count == elem.length) { alert('Fill at least one field'); } else { alert("now it's ok"); } } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <form class="add-patient"> <fieldset style="display: block;"> <label for="new_exam">New exam</label> <input type="text" name="new_exam" id="new_exam" value=""> </fieldset> <fieldset style="display: block;"> <label for="x_ray">X ray</label> <input type="text" name="x_ray" id="x_ray" value=""> </fieldset> <input type="button" class="btn btn-submit" onclick="sendForm();" value="Create report"> </form> 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM