如何获取给定表单详细信息的嵌套 json 对象？答案

【问题标题】：How to get nested json object for given form details?如何获取给定表单详细信息的嵌套 json 对象？
【发布时间】：2016-04-06 06:53:29
【问题描述】：

我正在尝试获取 json 对象，我已经尝试过了，但它以普通的 json 格式出现，但我需要它就像我在 fiddle 中解释的 nested json 格式一样。我怎样才能实现它？请帮助我并提前致谢。

【问题讨论】：

标签： javascript jquery angularjs json angularjs-ng-model

【解决方案1】：

将您的表单html替换为

<form action="" method="post" id="formid" name="testForm">
    First Name:
    <input type="text" ng-model="formData.testing.Fname" maxlength="50" size="12" /><br/>
    <br/> Last Name:
    <input type="text" ng-model="formData.testing.Lname" maxlength="50" size="12" /><br/>
    <br/>
     Middle Name:
    <input type="text" ng-model="formData.testing.Mname" maxlength="50" size="12" /><br/>
    <br/> Education:
    <br/>
    <select ng-model="formData.testing.Education">
      <option value="HighSchool">HighSchool</option>
      <option value="College">College</option>
    </select>
    <br/>
    <br/> Age:
    <input type="text" ng-model="formData.testing.Age" maxlength="2" size="10" /><br/>
    <br/> University:
    <br/>
    <select ng-model="formData.University">
      <option value="ABC">ABC</option>
      <option value="DEF">DEF</option>
    </select>
    <br/>
    <br/>
    Companies:<br/>
<select ng-model="formData.companies">
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option></select><br/>
    <p>
      <input type="submit" ng-click="serialize($event)" />
    </p>
  </form>

这意味着您想要在测试节点中的数据在绑定时以相同的格式放置，即用ng-model="formData.testing.Fname"替换ng-model="formData.Fname"

【讨论】：

感谢您的回复，按照我的要求工作正常。谢谢你！！
我有一个查询，如何默认选择任何下拉选项以及上述小提琴/html 中任何名字/姓氏/中间名的任何默认文本值？
初始化控制器内的范围值。结帐jsfiddle.net/KishoreBarik/Lf3m1ocb/2。它基于您的旧小提琴。因此，根据新的变化获得想法和修改

【解决方案2】：

$scope.serialize = function($event){
var testing = [
    {'Fname':$scope.formData.Fname},
  {'Lname':$scope.formData.Lname},
  {'Mname':$scope.formData.Mname},
  {'Education':$scope.formData.Education},
  {'Age':$scope.formData.Age},
];
$scope.formData = {
'testing' : testing, 
'University' : $scope.formData.University,
'Companies' : $scope.formData.companies,
};
console.log($scope.formData)
alert(JSON.stringify($scope.formData))
console.log(JSON.stringify($scope.formData));
$event.preventDefault()

}

使用此代码。

【讨论】：