Lucien Dubois
Lucien Dubois

Reputation: 1704

Updating data string with Angularfire and Angular-xeditable

I'm working on my first small AngularFire/AngularJs application. I would like to use the Angular-xeditable plugin. Up to now, I can create and save new data but I can't find how to update existing data with Angular-xeditable.

I got not error messages, what is wrong:

HTML

<table class="table table-hover" ng-controller="premiercontrolleur">
<tr><th>Prénom</th><th>Nom</th></tr>
    <tr ng-repeat="client in clients">
    <td editable-text="client.prenom" onbeforesave="saveClient($data)">{{client.prenom}}</td>
    <td editable-text="client.nom" onbeforesave="saveClient($data)">{{client.nom}}</td>
</tr>
</table>

Javascript

var app = angular.module("crmfirebase", ["firebase", "xeditable"]);

app.run(function(editableOptions) {
  editableOptions.theme = 'bs3'; // bootstrap3 theme. Can be also 'bs2', 'default'
});

app.controller("premiercontrolleur", function($scope, $firebase) {
  var ref = new Firebase("https://mydatabaseurl.firebaseio.com/clients");
  var sync = $firebase(ref);

  $scope.clients = sync.$asArray();

  $scope.addClient = function(client) {
    $scope.clients.$add({prenom: client.prenom, nom: client.nom});
  }

  $scope.saveClient = function(data) {
    $scope.clients.$save({prenom: data});
  }
});

I try to understand how to make it work with the save method here: https://www.firebase.com/docs/web/libraries/angular/api.html#angularfire-firebasearray-save-recordorindex

Upvotes: 1

Views: 484

Answers (1)

Lucien Dubois
Lucien Dubois

Reputation: 1704

I found the answer!

Javascript

$scope.saveClient = function (client) {
  $scope.clients.$save(client);
};

HTML

<table class="table table-hover" ng-controller="premiercontrolleur">
<tr><th>Prénom</th><th>Nom</th></tr>
    <tr ng-repeat="client in clients">
    <td editable-text="client.prenom" onbeforesave="saveClient(client)">{{client.prenom}}</td>
    <td editable-text="client.nom" onbeforesave="saveClient(client)">{{client.nom}}</td>
</tr>
</table>

I you don't use xeditable, just pass the client argument like this:

ng-submit="updateClient(client)"

Upvotes: 1

Related Questions