Session variable disapear ?!

Hi there,
I’m front a problem that I don’t understand. I put in my code a session value on a button click. This click open a modal by using bootstrap3 too. Here is my code of sessionning :

'click #print': function (e, obj) {
      Session.set("printDocumentId", this._id);

On this modal, i got another button who are actually doing this :

 'click #print': function (e, obj) {

        console.log("radio value : " + $('input[name="optradio"]:checked').val());
        console.log("selectedPrinter : " + Session.get("selectedPrinter"));
        console.log("idImp : " + Session.get("printDocumentId"));
        console.log("nbCopie : " + $("#inputNbCopie").val());

Here is my console log :

radio value : PDF
selectedPrinter : ay3
idImp : ef41314e-3c11-43ad-9b82-7f6c635ea107
nbCopie : 1

Until there, all is pretty fine…
But if I reclick on the same button, my “Session.get(“printDocumentId”));” become undefined.
Here is my console if I reclick :

radio value : PDF
selectedPrinter : ay3
idImp : undefined
nbCopie : 1

I use the session’s set function with argument printDocumentId at just one moment in my code, and it’s the click i described. Why this value just disapear when the second one (Session.get(“selectedPrinter”)) doesn’t !?

Thanks for your advices and tips :slight_smile:

It looks rather like a problem with this._id than Session.

So ‘click #print’ is working now? I remember having problems to use IDs instead of classes. But I don’t use events anymore anyways.

this._id is working for me, cause i see my : “idImp : ef41314e-3c11-43ad-9b82-7f6c635ea107” in my console on the first click. So my Session.set(“printDocumentId”, this._id); was well executed on the click yep.

Still, why do you use IDs? You define two elements with #print, one outside of the modal and one on the modal. HTML doesn’t allow for two elements with two same IDs. The id attribute

The id attribute specifies its element’s unique identifier (ID). [DOM]

The value must be unique amongst all the IDs in the element’s
home subtree and must contain at least one character. The value must not contain any
space characters.

While browsers allow you to use same ID, it can lead to serious problems when you use Javascript.

heum… this._id is not the html id hey ? :slight_smile:
this._id just refer at my current _id of my printJob object :

{{#each printJob selectedUser}}
    {{> printjoblistOneLine}}

<template name="printjoblistOneLine">
        [user : {{user}}] - [fileName : {{fileName}}] - [nbCopie : {{nbCopie}}] - [_id : {{_id}}]
        <div class="btn-group btn-group-sm" role="group" >
            <button type="button" class="btn btn-default" id="del">✘</button>
            <button type="button" class="btn btn-default" id="print" data-toggle="modal" data-target="#printerListModal">Réimprimer</button>

and i still use html ids cause i take care of placing my event in the correspondant template :{
      'click #print': function (e, obj) {

this._id is not the html id, but #print is. If you have click #print event defined on two buttons, that means you have two same ids in the same home subtree. I’d recommend to change the id of modal button to a different value. It won’t solve this particular case, but it will save you from unexpected JS issues in the future.

It does look like you may have multiple id="print" attributes in your DOM as @brajt says. See also this thread:

1 Like

Ok, i’m sorry, you are right !
I had confident in meteor template to separate well the two click #print… but it failed apparently !

I changed one and it works !

1 Like

Oh, and here I thought of it as a separate issue. :wink: I didn’t think it will solve this particular case.