使用AngularJS中的AJAX删除单击按钮上的XML记录

时间:2015-12-28 08:25:58

标签: javascript jquery angularjs ajax xml

您好我试图从XML文件中删除记录,该文件使用AngularJS以表格形式显示数据,我的代码是:

XML文件

<UserDetail>
  <Detail>
    <EmployeeID>124578</EmployeeID>
    <EmployeeName>suresh</EmployeeName>
    <EmailID>suresh@xyz.com</EmailID>
  </Detail>
  <Detail>
    <EmployeeID>587458</EmployeeID>
    <EmployeeName>Namit</EmployeeName>
    <EmailID>Namit@xyz.com</EmailID>
  </Detail>
</UserDetail>

这是我的AngularJS代码,我将XML更改为JSON并以表格的形式出现

<script>
        var app = angular.module('myApp', []);
        app.controller('myCtrl', function ($scope, $http) {
            $http.get('myDB.xml')
            .then(function (response) {
                var x2js = new X2JS();
                $scope.details = [];
                var data = x2js.xml_str2json(response.data);
                $scope.details = data.UserDetail.Detail;
                $scope.getID = function (id) {                 
                    var index = 0
                    $scope.details.splice(index, 1);
                }
            });

        });
      </script>

HTML代码,我的数据以表格格式显示

<div ng-app="myApp" ng-controller="myCtrl">
            <table border="1" width="100%">
                <tr>
                    <th>Employee ID</th>
                    <th>Employee Name</th>
                    <th>Email ID</th>
                    <th>Status</th>
                </tr>
                <tr ng-repeat="detail in details" align="center">
                    <td>{{detail.EmployeeID}}</td>
                    <td>{{detail.EmployeeName}}</td>
                    <td>{{detail.EmailID}}</td>
                    <td>
                        <button ng-click="getID(detail.EmployeeID)" class="btnDelete">Delete Request</button>
                    </td>
                </tr>
            </table>
        </div>

请使用angularJS

中的ajax点击按钮删除记录表单XML文件

1 个答案:

答案 0 :(得分:0)

您可能需要转换xml to json again,然后删除该对象。

{
  "UserDetail": {
    "Detail": [
      {
        "EmployeeID": "124578",
        "EmployeeName": "suresh",
        "EmailID": "suresh@xyz.com"
      },
      {
        "EmployeeID": "587458",
        "EmployeeName": "Namit",
        "EmailID": "Namit@xyz.com"
      }
    ]
  }
}

$scope.getID = function (emp) {                 
   var jsondata = x2js.xml_str2json(xml); //Its an array of object hopefully
   var index = jsondata.map(function(item) { return item.id; })
                   .indexOf(emp.EmployeeID);

   jsondata.splice(removeIndex, 1); // your json here... 
            which you can convert it back to xml and update. 
}