1

EDIT: there are one conceptual error and one technical error on the problem definition so this question should better be closed instead of sanitized. When I have time to redefine the problem I'll post it again. Please help voting to close because of unspecific.

There are lots of info and questions about serializing complex HTML forms to its corresponding JavaScript object (for example this).

Here is a sample of that process: having this form

<form>
    <input type="text" name="scalar" value="1">
    <input type="text" name="array[0]" value="1">
    <input type="text" name="array[1]" value="2">
    <input type="text" name="array[2]" value="3">
    <input type="text" name="object[subscalar]" value="1">
</form>

And getting from it this javascript object

{
  "scalar": 1,
  "array": [1, 2, 3],
  "object": {
    "subscalar": 1
  }
}

But how can I do the inverse job?

Our goal is to perform a native POST targeting a separate browser window. We have a complex JavaScript object and we were sending through an AJAX POST, so we were using the object directly as jQuery.ajax data parameter. But now we need to create a real form in the DOM containing the inputs and values with all that brackets syntax, and then natively submit it targeting a specific frame.

jQuery usage is optional. Already existing method, library, etc is preferable against a custom snuppet. This isn't about not being able to code it, it's about not being sure we need to reinvent the wheel.

Thanks in advance.

Community
  • 1
  • 1
Áxel Costas Pena
  • 5,886
  • 6
  • 28
  • 59
  • So do you have a form from which you fetch values? – Rajesh Sep 07 '16 at 15:35
  • Your structure doesnt make sense. Why do you need a name like "dream[as]..." generated dynamically?? – Jonas Wilms Sep 07 '16 at 15:37
  • @Rajesh no, I have a JS object and I need to generate a form which the browser can send producing the same POST it produces when I send that object through XMLHTTPRequest. – Áxel Costas Pena Sep 08 '16 at 09:13
  • One option is to create a in memory form and then manually submit it. Other option is you can create a serialized string. Not sure how arrays will be represented in them though – Rajesh Sep 08 '16 at 09:15
  • Sorry guys, there are one conceptual errors and one technical error on the problem definition so I am closing this now until I have time to redefine the problem. Please help voting to close for unspecific. Thank you all for the time invested here. – Áxel Costas Pena Sep 08 '16 at 10:47

1 Answers1

1
function parseform(elem,parent=""){
    this.html="";
    this.parent=parent;
    if(typeof elem=="Array"){
        var counter=0;
        elem.forEach(function(a){
            this.html+=new parseform(a,this.parent+"["+counter+"]").html;
            counter++;
        });
    }
    if(typeof elem=="String"){
        this.html+="<input name='"this.parent+"["+elem+"]' />";
    }
    //object in progress
    if(typeof elem=="Object"){
        for (var key in elem) { 
            if (p.hasOwnProperty(key)) { 
                this.html += new parseform(elem[key],this.parent="["+key+"]").html;
            }
        }
    }
}

Use like this:

 code=new parseform(yourjsondecoded).html;

I know you dont want code, but i dont think that theres an api for something so specific

stevenelberger
  • 1,368
  • 1
  • 10
  • 19
Jonas Wilms
  • 132,000
  • 20
  • 149
  • 151
  • Sorry guys, there are one conceptual errors and one technical error on the problem definition so I am closing this now until I have time to redefine the problem. Please help voting to close for unspecific. Thank you all for the time invested here. – Áxel Costas Pena Sep 08 '16 at 10:47