How to access DOM or value of template


#1

This is my meteor template:

{{#each p}}
<div class="cpl">
<div class="chat-post">
    <li class="post">
        <div class="nm" id={{_id}}>
            <a>{{username}}</a>
        </div>
        <div class="con">{{content}}</div>
        <div class="cnm">
            <div class="t">{{time}}</div>
            <div class="m" id="cm">
                <a>message </a>
            </div>
        </div>
    </li>
 </div></div>
 {{/each}}

//TEMPLATE FOR PF

    <template name="pf">
  <form id="post-box">
  <textarea id="new" required></textarea>
  <button type="submit">Post</button>
  </form>
  </template>

//THIS IS MY HELPERS AND EVENT HANDLERS FOR PF AND PC,COLLECTION NAME ROST

   Template.pc.helpers({
  p: function(){
    return Rost.find({}, {sort:{created:-1}});
  }
});



Template.pf.events({
  'submit form': function(event){
    event.preventDefault();
    var content= document.getElementById('new').value;


 var date= new Date(),
 h=(date.getHours()<10?'0':'') +date.getHours(),
 m=(date.getMinutes()<10?'0':'')+date.getMinutes();
var time=h+':'+m;
 var username= Meteor.user().username;
    Rost.insert({
      content: content,
      created:date,
      time:time,
      username: username
    });
    event.target.reset();
  }
});

I am using meteor and mongo as DB where {{username}}, {{content}} and {{time}} are variables of object.
How can I access {{username}} using JavaScript?


#2

Where do you want to access username?


#4

I assume you want to use that helper from inside {{#each}} block. In this case you can do it like this:

In template:

...
{{myHelperName _id}}
...

In JS:

 Template.pc.helpers({
   myHelperName: function(_id) {
     var item = Rost.findOne(_id);
     // Use the item.username here
   },
   ...
 });

#6

its an group chat application …i needed the value of the {{username}} from pc template so that i can remove ‘message’ link for current user[one doesn’t message it self]and to make the posts of current user to float on the other side …for that i need to get value of {{username}} n then i have to compare that if username == curent user …then change the visibility of link ‘message’ to hidden and make that post float on other side –


#7

thanks sir
its an group chat application …i needed the value of the {{username}} from pc template so that i can remove ‘message’ link for current user[one doesn’t message it self]and to make the posts of current user to float on the other side …for that i need to get value of {{username}} n then i have to compare that if username == curent user …then change the visibility of link ‘message’ to hidden and make that post float on other side –


#8

That’s not the correct way of dealing with this kind of problem :slight_smile:. There’s a better way - you create a helper to check you this message was sent by a current user (I assume that you have username stored in the profile field of your Meteor.users collection):

Template.pc.helpers({
...
  sentByCurrentUser(p) {
    return Meteor.user() && p.username == Meteor.user().profile.username;
  }
...
});

And then in your template:

{{#each p}}
<div class="cpl">
<div class="chat-post">
    <li class="post">
        <div class="nm {{#if sentByCurrentUser p}}float-right-class{{/if}}" id={{_id}}>
            <a>{{username}}</a>
        </div>
        <div class="con">{{content}}</div>
        <div class="cnm">
            <div class="t">{{time}}</div>
            {{#unless sentByCurrentUser p}}
            <div class="m" id="cm">
                <a>message </a>
            </div>
            {{/unless}}
        </div>
    </li>
</div></div>
{{/each}}

Change float-right-class to a class you use to style messages sent by current user.


#10

Thanks sir can i have your email id…:slight_smile: