Build JSON from dynamicaly generated form (jquery.dForm plugin) -


i use folowing json obj , jquery.dfrom plugin dynamicaly create form :

<script type="text/javascript"> $(function() {   // generate form     $("#myform").dform({         "action" : "index.html",         "method" : "get",         "html" :         [             {                 "type" : "p",                 "html" : "you must login"             },             {                 "name" : "username",                 "id" : "txt-username",                 "caption" : "username",                 "type" : "text",                 "placeholder" : "e.g. user@example.com"             },             {                 "type" : "select",                 "options" : {                 "us" : "usa",                 "ca" : "canada",                 "de" : {                        "selected" : "selected",                        "html" : "germany"                        }                  }             },             {                 "name" : "password",                 "caption" : "password",                 "type" : "password"             },             {                 "type" : "submit",                 "value" : "login"             }         ]     }); }); 

generated form :

<form id="myform" action="index.html" method="get" class="ui-dform-form"> <p class="ui-dform-p">you must login</p> <label for="txt-username" class="ui-dform-label">username</label> <input type="text" name="username" id="txt-username" placeholder="e.g. user@example.com" class="ui-dform-text"> <select class="ui-dform-select"> <option class="ui-dform-option" value="us">usa</option> <option class="ui-dform-option" value="ca">canada</option> <option selected="selected" class="ui-dform-option" value="de">germany</option> </select> <label class="ui-dform-label">password</label> <input type="password" name="password" class="ui-dform-password"> <input type="submit" class="ui-dform-submit" value="login"> </form> 

how build json obj generated form elements updated values :

$(function() { $("#myform").dform({     "action" : "index.html",     "method" : "get",     "html" :     [         {             "type" : "p",             "html" : "you must login"         },         {             "name" : "username",             "id" : "txt-username",             "caption" : "username",             "type" : "text",             "value" : "morowind"         },         {             "type" : "select",             "options" : {             "us" : "usa",             "ca" : {                      "selected":"selected",                      "html":"canada"                    },             "de" : "germany"              }         },         {             "name" : "password",             "caption" : "password",             "type" : "text",             "value": "mika2048"         },         {             "type" : "submit",             "value" : "login"         }     ] }); }); 

there isn't way reverse engineer existing form json object. best way deal separating form data definition , setting/retrieving separate json object. recommend jquery++ formparams this. able set data (after generating form) this:

$("#myform").formparams({     username: 'tester' }); 

and retrieve example data this:

$("#myform").formparams(); // { username: 'morowing', country: 'ca', password: 'mika2048' } 

Comments