How do I filter out empty textboxes when checking their values in JavaScript?

Question

I have a web page that can contain a list of items like this:

<input type="text" class="stringItems" value="This is my string 1" />
<input type="text" class="stringItems" value="This is my string 2" />
<input type="text" class="stringItems" value="This is my string 3" />
<input type="text" class="stringItems" value="This is my string 4" />
<input type="text" class="stringItems" value="This is my string 5" />
<input type="text" class="stringItems" value="This is my string 6" />

Before sending the data off to my server, I put them all in an array like this:

            $('.stringItems').map(function(i, e) {
                    return e.value; 
               }).toArray());

So this all works great.

But now I need to filter out <input> elements that may contain an empty value like this:

<input type="text" class="stringItems" value="" />

Basically, I don't want these to be part of the array UNTIL they have a value.

Is there a jquery method that I can use to filter out elements with empty values?

Alessandro Minoccheri · Accepted Answer · 2014-02-25 17:02:02Z

5

try this:

$('.stringItems').map(function(i, e) {
     if(e.value.trim() != '')
         return e.value; 
}).toArray();

See in the demo the console.log inside your console please and you can see your array without empty value

DEMO

edited Feb 25, 2014 at 17:02

answered Feb 25, 2014 at 16:55

Alessandro Minoccheri

36.1k22 gold badges128 silver badges176 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Karl-André Gagnon Over a year ago

Should probably trim the value just to be sure.

Alessandro Minoccheri Over a year ago

Thanks for the suggestion I have edited now, it's a good practice in this control to use trim! thanks again @Karl-AndréGagnon

mechanicious Over a year ago

@Alessandro Minoccheri You don't have to check != '' cause '' is a false itself. So e.value.trim() is enough. jsfiddle.net/TL8nC/2

Karl-André Gagnon Over a year ago

@Bright you are right, but it is better, in this case, to use !==. @Alessandro, I know, i am anoying, but it is better to use $.trim(string) than string.trim() for browser support (ie9 doesnt supprot string.trim()).

Rui · Accepted Answer · 2014-02-25 17:01:15Z

1

You can do it all with selectors, i.e.:

$('.stringItems').not("[value='']").map(function(i, e) {
                    return e.value; 
               }).toArray();

answered Feb 25, 2014 at 17:01

Rui

4,9163 gold badges32 silver badges35 bronze badges

Comments

aethercowboy · Accepted Answer · 2014-02-25 17:02:22Z

1

You're probably wanting to use the filter() method: http://api.jquery.com/filter/

e.g.

$('.stringItems').filter(function(i, e) {
  return e.value != '';
}).map(function(i, e) {
  return e.value;
});

edited Feb 25, 2014 at 17:02

answered Feb 25, 2014 at 16:54

aethercowboy

4444 silver badges16 bronze badges

Collectives™ on Stack Overflow

How do I filter out empty textboxes when checking their values in JavaScript?

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related