Parsing string, into multiple arrays, into dynamic dropdown

Question

I have stored a dynamically created object as a string in a database because I lack knowledge of better choices and at this point I think there is no going back. I am trying to parse this is in a way so the user can not break it somehow.

I output a string that is in format

    |attr1|,subA,subB,subNth,~,|attrNth|,sub2A,sub2B,sub2C,sub2D,~

1st then split it by doing

    supertest = option.split("~");

Leaving me with

    |attr1|,subA,subB,subNth,,,|attrNth|,sub2A,sub2B,sub2C,sub2D,,

2nd I loop through find my pipe symbols, and split again

   for(n=0; n<supertest.length; n++) {

        var start_pos = supertest[n].indexOf('|') + 1;
        var end_pos = supertest[n].indexOf('|',start_pos);
        var optionParsed = supertest[n].substring(start_pos,end_pos);
        test = supertest[n].split("|").pop();

        choiceArray = test.split(",");
        }

Leaving me with 3 arrays with dynamically created names(I only want two)

 array1- ,subA,subB,subNth,
 array2- ,sub2A,sub2B,sub2C,sub2D,
 array3- blank or null or undefined?

JSFIDDLE: http://jsfiddle.net/SteveRobertson/4YHSr/21/

I am ultimately trying to create dynamic select input lists with "attr"'s as labels and "subNths" as options. so I tried to create a jsfiddle to make it easier, because i now realize this is a bigger question than i initially thought, but for some reason after the three select drop down lists are done loading everything disappears. I tried. If anyone can help me I would appreciate it. What I ideally want to know is how can i get my individual arrays to be in the format

attr1 = [subA, subB, subNth]

Thank you for anyone who thinks they might know this and can help

I realise it may be too late, but had you not considered storing the objects as JSON? — David Thomas
– David Thomas, Commented Jun 6, 2013 at 20:58
@DavidThomas ha yeah I am learning as I go and that sounds like a great idea based on the three like button click you got already. Would storing it as JSON mean storing in a MySQL table or maybe local storage? as an object? Am i really that bad off? cause that is going to be digging deep... — Four_lo
– Four_lo, Commented Jun 6, 2013 at 21:05
Effectively using JSON would turn a JavaScript object into a string-representation of the object, for example (forgive the illegibility of the code in comments): var xkcd = { author: 'Randall Munroe', urls: ['http://xkcd.com', 'http://m.xkcd.com'], updated: ['Monday', 'Wednesday', 'Friday'] }, xkcdToJSON = JSON.stringify(xkcd); console.log(xkcdToJSON); more-legible JS Fiddle demo (outputs: '{"author":"Randall Munroe","urls":["http://xkcd.com","http://m.xkcd.com"],"updated":["Monday","Wednesday","Friday"]}'). — David Thomas
– David Thomas, Commented Jun 6, 2013 at 21:35

gkalpak · Accepted Answer · 2013-06-06 21:27:45Z

1

If we choose to overlook the fact that you indeed need to refactor your code and implement a more robust, reliable and maintanable solution for storing such data (JSON sounds like a good choice), your main problem is this:

You have a callback on your submit button, which means that, right after your callback is executed and the selects created, your form gets submitted (to nowhere in this case) and your page is reloaded (effectively causing your changes to get lost).

All you have to do is add return false; at the end of your submit callback, which will prevent the form from getting submitted.

You might also want to add a couple of checks to omit options (or selects) when the corresponding token is empty. Something like this would do:

for (var n = 0; n < supertest.length; n++) {
    if (supertest[n] == "") { continue; }
    ...
    for (var j = 0; j < choiceArray.length; j++) {
        if (choiceArray[j] == "") { continue; }
        ...
    }
    ...
}
...
return false;

See, also, this short demo.

edited Jun 6, 2013 at 21:27

answered Jun 6, 2013 at 21:22

gkalpak

48.2k8 gold badges108 silver badges120 bronze badges

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

1 Comment

Four_lo Over a year ago

oye that looks good, I am used to overlooking my mistakes. thanks

c69 · Accepted Answer · 2013-06-06 21:21:52Z

1

I hope, the working code below can convince you to use JSON for storing hierarchical data ;) And yes, its only the parsing part.

var zzz = '|attr1|,subA,subB,subNth,~,|attrNth|,sub2A,sub2B,sub2C,sub2D,~'
   .split('~')
   .filter(function(v){return !!v;})
   .map(function(v) {
       var a = v.replace(/(^,)|(,$)/, '')
          .split(',');
       var o = {};
       o[a[0].replace(/\|/g, '')] = a.slice(1);
       return o;
   }); 

// now, lets see what we have done:
JSON.stringify(zzz); 
// and the output is:
"[{"attr1":["subA","subB","subNth"]},{"attrNth":["sub2A","sub2B","sub2C","sub2D",""]}]"

answered Jun 6, 2013 at 21:21

c69

21.8k8 gold badges56 silver badges83 bronze badges

Collectives™ on Stack Overflow

Parsing string, into multiple arrays, into dynamic dropdown

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related