nate-strauser / meteor-x-editable-bootstrap

Smart package for x-editable in place editor
80 stars 51 forks source link

Having to wait on this.data() - potential documentation update. #22

Open evolross opened 10 years ago

evolross commented 10 years ago

I'm using this package to insert a new document that I then want to edit immediately using x-editable in Meteor. It's basically an insert form, but you actually end up editing an inserted document with default values. So when a user hits a certain route, in the waitOn attribute the route calls a Meteor method to insert a new document with default values, it passes that document ID to the Session, and then in the data attribute I query for that document to pass to the template for editing.

I was getting a problem on the template page in that the editable() calls were running before the data was inserted into the template and thus all the x-editable fields were showing empty instead of being populated with the default values. To fix this I had to add an if(this.data()) check in the action attribute of the route. This makes sure the data is ready and then the x-editable fields all start with their appropriate default values. I thought you may want to add this to the documentation. I'm using Meteor 0.9.X

So my route looks like this:

this.route('displayDocument', {
    path: '/displayDocument',
    waitOn: function() {
        //  Insert a new document for them to edit using x-editable
        Meteor.call('insertBlankDocument', function(error, success) {               
                if(error)
                        return alert(error.reason);   
                else {
                    if(success) {    
                        Session.set("newDocumentId", success);

                        //  Subscribe to document
                        Meteor.subscribe('documents', success);

                        return;
                    }
                    else
                        return alert("There was a Meteor Method problem on inserting a blank document.");
                }
          });   
    },

    data: function() {  
        return newDocument = Documents.findOne(Session.get("newDocumentId"));
    },

    action: function() {
        if(this.data())
            this.render();
        else
            this.render('loading');
    }
});