How to insert an array of values into your database using JQuery

Question

I have check boxes for days(monday,tuesday...) set up on a html page and i want to add them to my database. I need to add them to DaysWorked which is an array of strings. here is my code so far

var newUser = {
        'username': $('#addUser fieldset input#inputUserName').val(),
        'password': $('#addUser fieldset input#inputUserPassword').val(),
        'email': $('#addUser fieldset input#inputUserEmail').val(),
        'fname': $('#addUser fieldset input#inputUserFname').val(),
        'sname': $('#addUser fieldset input#inputUserSname').val(),
        'JobType': $('#addUser fieldset select#inputUserJobType').val(),
        'ShiftType': $('#addUser fieldset select#inputUserShiftType').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserMonday').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserTuesday').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserWendsday').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserThursday').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserFriday').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserSaturday').val(),
        'DaysWorked': $('#addUser fieldset input#inputUserSunday' ).val(),
        'HoursPerWeek': $('#addUser fieldset input#inputUserHoursPerWeek').val()
    }

I know all my other code works but its here that the problem is, i just dont know how to add the days into the array that is the the object newUser.

Ahmed Salman Tahir · Accepted Answer · 2015-03-22 13:44:24Z

1

I think, this would work for you:

var newUser = {
    'username': $('#addUser fieldset input#inputUserName').val(),
    'password': $('#addUser fieldset input#inputUserPassword').val(),
    'email': $('#addUser fieldset input#inputUserEmail').val(),
    'fname': $('#addUser fieldset input#inputUserFname').val(),
    'sname': $('#addUser fieldset input#inputUserSname').val(),
    'JobType': $('#addUser fieldset select#inputUserJobType').val(),
    'ShiftType': $('#addUser fieldset select#inputUserShiftType').val(),
    'DaysWorked': [
           $('#addUser fieldset input#inputUserMonday').val(),
           $('#addUser fieldset input#inputUserTuesday').val(),
           $('#addUser fieldset input#inputUserWendsday').val(),
           $('#addUser fieldset input#inputUserThursday').val(),
           $('#addUser fieldset input#inputUserFriday').val(),
           $('#addUser fieldset input#inputUserSaturday').val(),
           $('#addUser fieldset input#inputUserSunday' ).val()
     ],
    'HoursPerWeek': $('#addUser fieldset input#inputUserHoursPerWeek').val()
}

edited Mar 22, 2015 at 13:44

Ahmed Salman Tahir

1,7771 gold badge17 silver badges26 bronze badges

answered Mar 22, 2015 at 13:21

barracuda

211 silver badge4 bronze badges

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

1 Comment

jonathan Over a year ago

yup it works altough its adding all the days regardless of whether or not its checked, ill be able to sort it out though cheers bud

click2install · Accepted Answer · 2015-03-22 13:27:44Z

Solution with selector caching:

var fieldset = $('#addUser fieldset');
var newUser = 
{
  'username': fieldset.find('input#inputUserName').val(),
  'password': fieldset.find('input#inputUserPassword').val(),
  'email': fieldset.find('input#inputUserEmail').val(),
  'fname': fieldset.find('input#inputUserFname').val(),
  'sname': fieldset.find('input#inputUserSname').val(),
  'JobType': fieldset.find('select#inputUserJobType').val(),
  'ShiftType': fieldset.find('fieldset select#inputUserShiftType').val(),
  'DaysWorked': 
   [
      fieldset.find('input#inputUserMonday').val(),
      fieldset.find('input#inputUserTuesday').val(),
      fieldset.find('input#inputUserWendsday').val(),
      fieldset.find('input#inputUserThursday').val(),
      fieldset.find('input#inputUserFriday').val(),
      fieldset.find('input#inputUserSaturday').val(),
      fieldset.find('input#inputUserSunday' ).val()
   ],
  'HoursPerWeek': fieldset.find('input#inputUserHoursPerWeek').val()
};

Assuming that your inputs are uniquely named the input# is also redundant and can be changed to the input id, e.g., #inputUserName which is a much faster lookup to the element.

This process would be better moved into an object hash so it is more OCP. Then you could just iterate the object hash keys and use each of the values as a strategy to return the value for the newUser hash.

Wojtek338 · Accepted Answer · 2015-03-22 13:30:03Z

Why don't use use something like this:`

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> </title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
    <input type="text" class="input-set" id="x">
    <input type="text" class="input-set" id="y">
    <input type="text" class="input-set" id="z">
    <input type="submit" class="go">

    <script>
        jQuery(document).ready(function($) {
            $('.go').click(function() {
                var allInputs = $('.input-set');
                daysWorked = []
                allInputs.each(function(index, el) {
                    daysWorked.push($(el).val());

                });
                console.log(daysWorked)

            });
        });
    </script>
</body>
</html>

`

You are getting all values from inputs and putting into the array. Then you can send it as a one filed.

var newUser = {
    'username': $('#addUser fieldset input#inputUserName').val(),
    'password': $('#addUser fieldset input#inputUserPassword').val(),
    'email': $('#addUser fieldset input#inputUserEmail').val(),
    'fname': $('#addUser fieldset input#inputUserFname').val(),
    'sname': $('#addUser fieldset input#inputUserSname').val(),
    'JobType': $('#addUser fieldset select#inputUserJobType').val(),
    'ShiftType': $('#addUser fieldset select#inputUserShiftType').val(),
    'DaysWorked': daysWorked,
    'HoursPerWeek': $('#addUser fieldset input#inputUserHoursPerWeek').val()
}

Collectives™ on Stack Overflow

How to insert an array of values into your database using JQuery

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related