如何使用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以保存表格數據？

回答

相關問題