CODEWITHSUNDEEP
phpjquery
Diasline
Diasline

Reputation: 635

Required input field

I have some input fields that are displayed from a loop using foreach. After click i want all of them to be required by using jquery. If the loop shows 1 or 3 inputs the required functions works perfectly but if the loop shows 2 inputs, only the first is required and the form can be saved with the second input empty. How can i solve this issue ? Any help is really appreciated.

<form class="input-seg">
<?php

foreach($GET_INPUT as $get_input){
  ?>

  <div class="form-group">
    <label  class="control-label col-sm-3"><?=$get_input->name;?></label>
    <div class="col-sm-3">
      <input  type="text" name="inputname[]" class="form-control inp"   >
    </div>
  </div>
  <?php
}
?>
</form>

JQUERY

$('.input-seg').click(function() {
  if($(".inp").val() == ""){
    $(".inp").focus();
    $('.inp').css('border', '2px solid'); 
    $('.inp').css('border-color', 'red');
    for(i=0;i<3;i++) {
      $('.inp').fadeTo('slow', 0.1).fadeTo('slow', 1.0);
    };
    return false;
  }
});

Upvotes: 0

Views: 62

Answers (1)

Matteus Barbosa
Matteus Barbosa

Reputation: 2735

You should use focusout to validate your fields. The link shows a lot of examples. Handle $(this) inside your event listener is a much more elegant approach:

$('.inp').focusout(function() { validate your field element object $(this)  });

Upvotes: 1

Related Questions