如何使用AngularJs为表格生成JSON以保存表格数据？

我已经在AngularJS的帮助下创建了一个HTML。如何使用AngularJs为表格生成JSON以保存表格数据？

<form name="target" ng-submit="createAllKeywordsJSON(codeMasterList)"><!-- createAllKeywordsJSON() --> 
    <input type="submit" value="Save" class="myButton" name="submit" style="margin: 0px;float:right;"> 

    <div class="category-placer2" style="width:100%"> 
     <div class="category-header-keywords"> 
     <div class="icon-add"><a href="#"><img src="images/icon-add.png" alt="Add" border="0" title="Add phone Number" /></a></div> 
     <div class="category-header-text" ><span ng-bind="dispName"></span></div> 
     </div> 
     <div class="category-base"> 
     <div class="keywordplacer"> 

      <table width="99%" border="0" align="center" cellpadding="0" cellspacing="0" class="keywordsList"> 
       <tr>     
        <th width="60%" colspan="2">Code Master Name</th> 
        <th width="30%" colspan="2">Status</th> 
       </tr> 
       <tr ng-repeat="type in codeMasterList"> 
        <td width="1%" class=""> 
         <input type="hidden" name="codeMasterId" value="{{type.codeMasterId}}" /> 
        </td> 
        <td width="60%" class=""> 
         <input type="text" name="keywordName" value="{{type.name}}" alt="Name of Keyword" size="60" > 
        </td> 
        <td width="30%" class=""> 
         <input type="radio" value="1" name="{{type.codeMasterId}}" alt="Name of Keyword" ng-checked="{{(type.activeInd == 1) && ('true') || ('false')}}" />Active 
         <input type="radio" value="0" name="{{type.codeMasterId}}" alt="Name of Keyword" ng-checked="{{(type.activeInd == 0) && ('true') || ('false')}}" style="margin-left:50px;" />Inactive 
        </td> 
       </tr> 
      </table> 

     </div> 
     <center> 
      <hr style=" background-color: #ABBFC6; height: 2px; width: 90%;"> 
      <input type="submit" value="Save" class="myButton" style="margin: 0px;"/> 
     </center> 
     <!-- <div class="table-index">P - Primary</div> --> 
     </div> 
    </div> 
</form>

它将以可编辑模式显示值。

我想保存所有列表，只需点击一下保存按钮。我如何使用angularjs做这样的事情？

你能帮我生成名称以及单选按钮值的JSON数据吗？下面

是我的控制器：

keywordModule.controller('keywordTypeController',['$scope', '$http', 'keywordService', 
    function($scope, $http, keywordService) { 
     $scope.createAllKeywordsJSON = function() { 
      //alert($scope.codeMasterList.codeMasterId); 
      var tempItemList = []; 
      angular.foreach($scope.codeMasterList,function(item,index){ 
       tempItemList.push(item); 
      }); 
      alert(tempItemList); 
      /*keywordService.createAllKeywordsJSON().query(codeMasterList, 
        //Success Handler handler 
        function(data) { 

        }, 
        //Failure handler 
        function(error) { 

        } 
      );*/ 
      //alert(codeMasterList); 
     }; 
    } 
]);

来源

2014-09-02 Krunal Shah

$scope.codeMasterList会为您的列表JSON数据。

您可以使用ng-model而不是value来更新表单字段的值。这也会将输入值直接绑定到列表中的项目。所以，那么你可以节省$scope.codeMasterList

HTML样品

<input type="text" ng-model="type.name" alt="Name of Keyword" size="60" >

Working Fiddle

来源

2014-09-02 13:05:47 Malkus

谢谢你的答案，但我想传递的是最新的{{MYLIST}}控制器，所以我可以将它传递给服务并通过休眠来保存它，所以你可以在提交表单后帮助我将它传递给控制器吗？你可以帮助我http://jsfiddle.net/L78kfkx8/3 – 2014-09-02 13:50:22

[这是我会做的]（http://jsfiddle.net/Malkus/L78kfkx8/4/），你不需要传递一个引用将清单交给控制器。 – Malkus 2014-09-02 14:17:58

如果你想 – Malkus 2014-09-02 14:19:35

如何使用AngularJs为表格生成JSON以保存表格数据？

回答

相关问题