jquery - How to convert an html form into ajax request for a rest controller if one of the fields multi select?

Question

The problem is that field "roles" is a select list with multiple-choice, so the field has to be converted into an array. I could not find any piece of info about how to do it. Need help. I'm doing this:

$.ajax({
            url: '/api/users',
            async: true,
            dataType: 'json',
            contentType: "application/json",
            type: "PUT",
            data: {
                id : jQuery('#id').val(),
                username: jQuery('#username').val(),
                password: jQuery('#password').val(),
                roles :
            },
        })

Answer 1

As long as you are using a standard multiple <select> tag, the jQuery val() will already be an array of strings. You can specify it exactly the same as your username and password values.

<select id="roles" multiple>
  <option>Admin</option>
  <option>Editor</option>
  <option>User</option>
</select>

---

data: {
    id : jQuery('#id').val(),
    username: jQuery('#username').val(),
    password: jQuery('#password').val(),
    roles : jQuery('#roles').val()
},