Question

I’m mapping out the name attributes of :input using the example below. I had to put a conditional statement in map() to find out if checkbox is checked and return true or false. but now I’m not getting the select option name attr. I feel like it’s taking more code writing then it should. What is an efficient way to get all the name attributes and watch for checked in checkboxes. Check the example at http://jsfiddle.net/gVHaQ/3/

<form>
    <input type="text" name="name" value="John"/>
    <input type="text" name="password" value="password"/>
    <input type="text" name="url" value="http://domain.org/"/>
    <select>
        <option name="one">1</option>
        <option name="two">2</option>
        <option name="three">3</option>
    </select>
    <input type="checkbox"/>            
</form>
<p></p>

$("p").append($(":input").map(function() {
    if ($(this).attr('type') == 'checkbox') {
        return $(this).attr('checked');
    }
    else {
        return $(this).attr('name');
    }
}).get().join(", "));

This is what is being returned
name, password, url, , true

Answer 1

Perhaps this is what you want?

$("p").append($(":input").map(function() {
    if($(this).is('select')) {
        return $(this).children('option').map(function() {
          return $(this).attr('name');
        }).get().join(", ");
    } else if($(this).attr('type')=='checkbox') {
        return $(this).attr('checked');
    } else {
        return $(this).attr('name');
    }
}).get().join(", "));

http://jsfiddle.net/gVHaQ/4/

If not, you should probably provide what the expected output is

EDIT: Accepted Version

$("p").append($(":input").map(function() {
    if($(this).is('select')) {
        return $(this).val();
    } else if($(this).attr('type')=='checkbox') {
        return $(this).attr('checked');
    } else {
        return $(this).attr('name');
    }
}).get().join(", "));