Question

I have following form.

<form action="" method="post" id="save-user">
    <button type="button" name="save-user">Save</button>
    <button type="button" name="save-user-close">Save & Close</button>
    <input type="text" name="name" placeholder="Enter your name" required/>
    <input type="email" name="email" placeholder="Enter your email" required/>
</form>

I am confused on how do i create a jQuery selector for all the inputs and buttons elements, as i am not using an id attribute, i do not want to use it in this case. how do i retrieve or create selector for all the four form elements.

thank you.

Answer 1

All of the above answers are ok, but you can, and most certainly should, learn and (learn to) use advanced selectors such as pseudo classes, attribute selectors and more.
Here are a few examples for you case:

// all the buttons that are children of the container 
//with the attribute id equal to "save-user"
$("#save-user").find('button');

// all the buttons that have their name attribute starting with "save-user"
$('button[name^=save-user]'); 

// same as before, only that we filter the results
// by checking if they contain the text "Save"
$('#save-user').find('button').filter(':contains(Save)');

You can create even more complex queries only with the use of jquery selectors – withouth the need to bind an id or class to the elements – to suite your needs. Of course, the main downside would be efficiency, but if you don’t abuse the special selectors, your jquery coding-style can be quite cool.