manipulating array values in JavaScript

Question

I have the following array

var my_arry =
      { "Description": "Actual Opening stock"
      , "Fri 05-Aug": "<input type='text' class='form-control' value='600'>"
      , "Mon 01-Aug": "<input type='text' class='form-control' value='200'>"
      , "Thu 04-Aug": "<input type='text' class='form-control' value='500'>"
      }

I want loop through this and format the array like bellow

var my_arry = 
      { "Description": "Actual Opening stock"
      , "Fri 05-Aug" : "600"
      , "Mon 01-Aug" : "200"
      , "Thu 04-Aug" : "500"
      }

basically get the value from input tag

I have use the following but did not work

$.each( my_arry, function( key, value ) {
                    console.log(value.find('input').val())
                 });

any other way I can do this

Your `my_arry` - fair enough is actually an **Object Literal** and it's also an **invalid one** since properties have spaces (`Fri 05-Aug`) but are not wrapped into quotes. So yeah, fix it and call it... call it `my_obby`- Still your question makes no sense. Loop what input elements? — Roko C. Buljan, Sep 13 '19 at 13:48
Your code is invalid, you don't have an array but an object, please post the html and a [mcve] — baao, Sep 13 '19 at 13:49
If you're copy/pasting from the console or something, do yourself (and us) a favor and use `console.log(JSON.stringify(my_arry, null, 2))`, then copy and paste the result. — Heretic Monkey, Sep 13 '19 at 13:52
It looks like the value of those properties are actually **strings**, not elements, so you'd have to parse them as such with `$(value)`. — Heretic Monkey, Sep 13 '19 at 13:55
First you have to convert HTML string to DOM element by using DOMParser. Like: new DOMParser().parseFromString(value,"text/html")).find('input').val() — Amit, Sep 13 '19 at 14:01
check this thread: https://stackoverflow.com/a/3104237/540195 — Amit, Sep 13 '19 at 14:01

Mister Jojo · Answer 1 · 2019-09-13T16:11:07.297

1

same with native JS (no jQuery)

const my_arry =
        { "Description": "Actual Opening stock"
        , "Fri 05-Aug": "<input type='text' class='form-control' value='600'>"
        , "Mon 01-Aug": "<input type='text' class='form-control' value='200'>"
        , "Thu 04-Aug": "<input type='text' class='form-control' value='500'>"
        } 

const parser = new DOMParser()

var rep = {}
for(let elm in my_arry)
  {
  if (elm === 'Description')
    {
    rep[elm] = my_arry[elm]
    }
   else
    {
    let doc  = parser.parseFromString(my_arry[elm], "text/html")
    rep[elm] =  doc.querySelector('input').value
    }
  }

console.log( rep )

other case for real array of objects

const my_arry = 
  [ { "Description": "Actual Opening stock",   "Fri 05-Aug" : "<input type='text' class='form-control' value='600'>" } 
  , { "Description": "closing Opening stock ", "Fri 05-Aug" : "<input type='text' class='form-control' value='600'>" } 
  ]

const parser = new DOMParser()

for(let elm of my_arry)
  {
  let doc  = parser.parseFromString(elm['Fri 05-Aug'], "text/html")
  elm['Fri 05-Aug'] = doc.querySelector('input').value
  }

console.log( my_arry)

edited Sep 13 '19 at 16:11

answered Sep 13 '19 at 14:25

Mister Jojo

20,093
6
21
40

what if i have two object array ? i mean two index in same array – kanishka kumarasiri Sep 13 '19 at 14:56
@kanishkakumarasiri what do you nean ? object and array are 2 differents things "object-array" doesn't exist anywhere. your `my_arry` is a js object, not a array, even if we can tranform or use it in a arry form. be more specific! – Mister Jojo Sep 13 '19 at 15:14
means like this const my_arry = { "Description": "Actual Opening stock" , "Fri 05-Aug": "" }, { "Description": "closing Opening stock " , "Fri 05-Aug": "" } – kanishka kumarasiri Sep 13 '19 at 15:19
yes two entries – kanishka kumarasiri Sep 13 '19 at 15:23
@kanishkakumarasiri in fact this not json valid => jsonlint.com I supose you use array of object with 2 entries (who are the same) ????? Please stop doing everything wrong, all computer languages have strict syntax rules, and you have to respect them. Explaining bases when the job for a technical solution is very unpleasant. – Mister Jojo Sep 13 '19 at 15:46

score 0 · Accepted Answer · edited Sep 13 '19 at 14:23

0

Try this code

var my_arry = { "Description": "Actual Opening stock",
                     "Fri 05-Aug": "<input type='text' class='form-control' value='600'>",
                     "Mon 01-Aug": "<input type='text' class='form-control' value='200'>",
                     "Thu 04-Aug": "<input type='text' class='form-control' value='500'>",
                   }

var arr_new = {};

$.each( my_arry, function( key, value ) {
                if(key != "Description" ){ 
                        arr_new[key] = $(value).val();
                } else {
                        arr_new[key] = value;
                } });

console.log(arr_new)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

edited Sep 13 '19 at 14:23

Mister Jojo

20,093
6
21
40

answered Sep 13 '19 at 14:10

Anudeep GI

931
3
14
45

thank you so much exactly what i wanted. thanks for the much help – kanishka kumarasiri Sep 13 '19 at 14:17
@kanishkakumarasiri np bro. – Anudeep GI Sep 13 '19 at 14:26
what if i have two object array ? i mean two index in same array – kanishka kumarasiri Sep 13 '19 at 14:54
Wrap the same code in a loop? – Heretic Monkey Sep 13 '19 at 15:50

manipulating array values in JavaScript

2 Answers2