CODEWITHSUNDEEP
javascriptjquery
jonathan
jonathan

Reputation: 15

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

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.

Upvotes: 0

Views: 85

Answers (3)

barracuda
barracuda

Reputation: 21

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()
}

Upvotes: 1

Wojtek338
Wojtek338

Reputation: 53

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()
}

Upvotes: 0

click2install
click2install

Reputation: 998

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.

Upvotes: 0

Related Questions