CODEWITHSUNDEEP
mongodbmeteor
robster
robster

Reputation: 656

Meteor / Mongo - Retrieving _id from template to use in function

I am new to programming so apologies if this seems obvious. I've spent quite some hours on this before asking so I hope this is ok.

I am trying to retrieve the ID of a mongo document so I can update it (via a form).

I will show what I have so far:

Iron Router takes me to the page via a URL:

Router.route('companyDetails', {
name: 'companyDetails',
template: 'companyDetails'

});

Template that displays the mongo document (it does work):

<template name = "companyDetails">
<h3>Update your Company Details</h3>
<form class = "companysave">
    <dl>
        {{#each company}}
            id is: {{_id}}<br>
            <p><input type = "text" value="{{name}}" name="companyName" size="35"></p>
            <p><input type = "text" placeholder="{{phone}}" name="companyPhone" size="35"></p>
            <p><input type = "text" placeholder="{{web}}" name="companyWeb" size="35"></p>
            <p><input type = "text" placeholder="{{twitter}}" name="companyTwitter" size="35"></p>
            <p><input type = "text" placeholder="{{facebook}}" name="companyFacebook" size="35"></p>
        {{/each}}
    </dl>
    <p><input type="submit" value="Reset">
    <input type="submit" value="Update"></p>
</form>

Template helper to send document data to template:

Template.companyDetails.helpers({
    'company': function(){
        return Organisations.find();            
    }
})

Template that is trying to get the ID of the document to send the updated info to a method on the server:

Template.companyDetails.events({

    'submit form': function(event){
        event.preventDefault();

        var documentId = this._id;

        var name = $('[name=companyName]').val();
        var web = $('[name=companyWeb]').val();
        var twitter = $('[name=companyTwitter]').val();
        var facebook = $('[name=companyFacebook]').val();
        Meteor.call('updateCompanyDetails', documentId, name, web, twitter, facebook);
    }

});

I also have a server method but I'm currently stuck at the above function in the template event.

The error I receive is based on:

var documentId = this._id;

It comes through as undefined. Interestingly if you look at the template itself I'm writing a bit of debug info called:

    id is: {{_id}}<br>

and it shows the correct ID. So the template has the ID. It loads and shows the data from the mongo document, but I can't retrieve it from the template event.

Can anyone offer some advice as to what I'm doing incorrectly here?

Again, I am new to this (and programming in general) so it may be a hand slap moment.

Thanks so much, Rob

Upvotes: 1

Views: 64

Answers (1)

Stephen Woods
Stephen Woods

Reputation: 4049

Based on your method call, it looks like you only want to update one particular company on this page, and there will only ever be one returned in your .find(). If that's not true, you'll need to update your publication and your route to only return one organization. Here is the code to make things work based on the assumption I made:

<template name = "companyDetails">
    <h3>Update your Company Details</h3>
    {{#with company}}
        <form class = "companysave">
            <dl>
                id is: {{_id}}<br>
                <p><input type = "text" value="{{name}}" name="companyName" size="35"></p>
                <p><input type = "text" placeholder="{{phone}}" name="companyPhone" size="35"></p>
                <p><input type = "text" placeholder="{{web}}" name="companyWeb" size="35"></p>
                <p><input type = "text" placeholder="{{twitter}}" name="companyTwitter" size="35"></p>
                <p><input type = "text" placeholder="{{facebook}}" name="companyFacebook" size="35"></p>
            </dl>
            <p><input type="submit" value="Reset">
            <input type="submit" value="Update"></p>
        </form>
    {{/with}}
</template>

Template.companyDetails.helpers({
    'company': function(){
        return Organisations.findOne();            
    }
});

I changed your find() to a findOne() to ensure you only get one document back. I then switched your #each to a #with to make sure we only use the one document returned in the helper. I also moved the #with outside your form element. This is important because it sets the data context of this inside your submit event. You'll want to check out the meteor guide for help on some of these concepts. Hope that helps!

Upvotes: 3

Related Questions