1

I am trying to get an empty input if there is one in my div using jQuery. It is not working as it should.

There are 4 empty inputs in the div.

Here is my jquery:

var firstEmpty = $('#brochureItems').find('input:text:not(:checkbox,:button):visible:first:enabled[value= ""]').first().val();
console.log(firstEmpty);

That outputs 'undefined'.

When I remove the "[value=""]", I get '(an empty string)' outputted.

I just thought of something, I am adding those inputs in dynamically with jquery on page load. Would that have something to do with it?

dmikester1
  • 1,374
  • 11
  • 55
  • 113

2 Answers2

0

If I understood you right you want to get all empty inputs inside a div. To do so, try this code:

HTML

<div>
  <input type="text">
  <input type="text">
  <input type="text">
  <input type="text">
  <input type="text" value="asdsad">
</div>


JS

var firstEmpty = $("div input[type='text']").filter(function() { return $(this).val() == ""; });

or if you want take all empty:

var emptyInputs = [];

$("div input[type='text']").each(function(){
    if($(this).val() == '')
    emptyInputs.push($(this))
});

Here is working Fiddle: https://jsfiddle.net/xs9jagc8/

Sebastian Kaczmarek
  • 8,120
  • 4
  • 20
  • 38
-1

Try this:

function findEmpty(){
  var div=document.getElementById('theDivID');
  for(var i=0;i<div.children.length;i++){
    if(div.children[i].value==''){
      return div.children[i].id;
    }
  }
  return false;
}
function verify(){
  var lol = findEmpty();
  if(lol===false){
    //Do whatever
    alert("All filled!");
  } else {
    alert("The first empty input is: "+lol);
  }
}
<div id='theDivID'>
<input id='blah' type='text'/>
<input id='bleh' type='text'/>
<input id='qwertyuiop' type='text'/>
<input type='text'/>
</div>
<input type='button' onclick='verify();' value='Check'/>
Feathercrown
  • 2,547
  • 1
  • 16
  • 30