How to use X-editable for dynamic fields in a Meteor template?

I would like to display the entire collection in a table and make the "name" field in each row in place editable with X-editable

editable can be attached to each name in the table using the recently added "selector" option:

$('#collectionTable').editable({
  selector: '.editable-click',
});

// I also need to setup a 'save' callback to update the collection...

$('a.editable-click').on('save', function(e, params) {
  console.log('Saved value: ' + params.newValue);
  // TBD: update the collection 
});

But I cannot run any of them until the template is completed and the DOM nodes are not accessible, so I put this in the “visualized” template callback.

, , , rendered, DOM node, . , , "".

, , , editable on ('save', function())?

+5
3

( , ). "", , :

Template.editableTable.rendered = function() {

    $('#myParentTable').editable({
      selector: '.editable-click'
    });

    $('a.editable-click').unbind('save').on('save', function(e, params) {
      // Make changes to your collection here.
    });

  };

, . , , - (, , ). , , , , .

+2

, , , ?

if (editable) {
 // enable editable and add the save listener
 // ...
 editable = true;
}
0

, , 29rep. . .

I had x-editable work in Meteor 0.7.2, but since upgrading to 0.8.0 it no longer displays correctly. I usually get a bunch of empty tags. This is disappointing because the data is there, just not at the point where the render function is running.

What is the best way to use x-editable at the moment, which only displays lights once and does not guarantee that the data is there.

I use Iron Router and my templates are not embedded in the {{#each}} block, which seems to be the main solution for the new rendering model.

0
source

All Articles