0

I have a large json object I am parsing and there are many fields in the form I am binding to. Here is a small sample of the code http://jsfiddle.net/UfPTd/ The code is also below. The real question is what is the best way to achieve these results? Is this where Angular should be considered or javascript json.parse just fine? Do I have to use the index[] array brackets? Trying not to use a plugin template. 

<form>

        <label>Select Withdrawal Type</label>
            <input type="text" data-label="Withdrawal Type" >

        <label>Plan Name</label>
            <input type="text"  data-label="Plan Name" value=""/>

        <label>Select Participant </label>
            <input type="text" data-label="Participant Name" >

       <label>Address</label>
           <input  type="text" data-label="Address On File"/>




</form>
   var data = {
  "inputs": [
    {
        "DataLabel": "Withdrawal Type",
        "DataGroup": "Participant Information",
        "DataColumn": "WithdrawalType",
        "Value": "full",
        "InternalUse": "1",
        "userDefined": "1"
    },
    {
        "DataLabel": "Plan Name",
        "DataGroup": "Participant Information",
        "DataColumn": "PlanName",
        "Value": "OpenGate Open Architecture 401(k) Plan",
        "InternalUse": "0",
        "userDefined": "0"
    },
    {
        "DataLabel": "Participant Name",
        "DataGroup": "Participant Information",
        "DataColumn": "ParticipantName",
        "Value": "Yosemite Sam",
        "InternalUse": "0",
        "userDefined": "0"
    }        }
    ]
    }


    $('input[data-label="Withdrawal Type"]').attr('value',data.inputs[0].Value);
    $('input[data-label="Plan Name"]').attr('value',data.inputs[1].Value);
    $('input[data-label="Participant Name"]').attr('value',data.inputs[2].Value);

Working example is here http://jsfiddle.net/UfPTd/

user2517127
  • 11
  • 3
  • possible duplicate of [Using jQuery and JSON to populate forms?](http://stackoverflow.com/questions/7298364/using-jquery-and-json-to-populate-forms) – Wilmer Mar 18 '14 at 21:49

2 Answers2

0
for(i in data.inputs){
    $('input[data-label="'+data.inputs[i].DataLabel+'"]').attr('value',data.inputs[i].Value);
}
user3430223
  • 31
  • 2
0

If you gonna stop on just binding these values you may use json.parse. If you planning to move this further angular are better option for binding and building interface.

You may also read this.

Sergey Moiseev
  • 2,953
  • 2
  • 24
  • 28