Create nested object from inputs

Question

I would like to create a nested object like below base on input forms. First key would be the name attribute, inside it would get required: true if the onput contains reqiuder attribute etc. I assume I need a nested foreach for that, I'm not sure. I added the code what I tried so far.

This is the object I like to create:

var obj = {
    'email.address': {
        required: true,
        email: true
     },
     'first.name': {
         required: false
     },
     'last.name': {
         required: true
     }
};

This is the code I have at the moment:

var formInputs = $('input'),
    obj = {};

$.each(formInputs, function(key, value) {
  obj[this.name] = value.name;
});

console.log(obj)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="email" name="email.address" placeholder="Email address" required />
  <input type="text" name="first.name" placeholder="First name" />
  <input type="text" name="last.name" placeholder="Last name" required />
</form>

It's not a great idea to include . in a property name since . is the natural syntax for separating an object from its properties/methods. The general convention for multiple word names is to use Pascal Case as in: firstName, lastName, emailAddress. — Scott Marcus
– Scott Marcus, Commented Feb 23, 2021 at 23:12
I know that, but these inputs are generated by a system and I can't do anything about it. — levipadre
– levipadre, Commented Feb 23, 2021 at 23:15

W-B · Accepted Answer · 2021-02-23 23:28:34Z

1

The issue is that you aren't waiting for your document to load before parsing.

jquery lets you wait until the document is ready with $(document).ready()

here is an example you can replace your js with

$(document).ready(function(){
var formInputs = $('input'),
    obj = {};
    $.each(formInputs, function(key, value) {
        obj[this.name] = {required: value.required}
    });
    console.log(obj)
})

answered Feb 23, 2021 at 23:28

W-B

1,2978 silver badges21 bronze badges

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

Comments

Scriptkiddy1337 · Accepted Answer · 2021-02-23 23:25:22Z

1

for (var i = 0, v; v = formInputs[i]; i++) { 
    for (var o of Object.keys(obj)) { 
        if (o !== v.name) { 
            continue;
        }
        for (var n of Object.keys(obj[o])) {
            v[n] = obj[o][n];
        }
    }
}

answered Feb 23, 2021 at 23:25

Scriptkiddy1337

7915 silver badges10 bronze badges

Collectives™ on Stack Overflow

Create nested object from inputs

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related