Ad

How To Submit A Value Of Hidden Input In Meteorjs

- 1 answer

In my meteor app, I submit the value of the picker number by clicking sbmit button bellow

enter image description here

When I tried to submit it with Enter key (keyboard), it does not work, knowing that i set a hidden input and trying to submit it; I think the problem come from the hidden input so after a hours of search I don't know how to submit a hidden input, any help please; here my code

<template name="range">
<div class="row">
<div class="col-xs-9 col-sm-9 col-md-9 col-lg-9">
<div class="valueSliders">
  <div class="verticleNumberSelect">
  <span class="firstNumber">
    <span class="up"> </span>
    <span class="numberValue" tabindex="1">0</span>
    <span class="down"></span>
  </span>
  <span class="secondNumber">
    <span class="up"></span>
    <span class="numberValue" tabindex="1">0</span>
    <span class="down"></span>
  </span>
  <span class="thirdNumber">
    <span class="up"></span>
    <span class="numberValue" tabindex="1">0</span>
    <span class="down"></span>
  </span>
  <span class="fourthNumber">
    <span class="up"></span>
    <span class="numberValue" tabindex="1">0</span>
    <span class="down"></span>
  </span>
  <form>
  <input type="hidden" id="verticleNumber" />
  <input type="submit" style="visibility: hidden; position: absolute;" />

  </form>

</div>
</div>
</div>
</template>

and my js is

Template.range.events({
'submit form': function (event) {

    event.preventDefault();

    if (Session.get('times') && Session.get('times') > 0) {
    var RESPONSE, responseClass;
    var GUESS = $('#verticleNumber').val();
    if (GUESS >  ANSWER) {
        RESPONSE = "-";
        responseClass = 'lower';
    }
    else if (GUESS <  ANSWER) {
        RESPONSE = "+";
        responseClass = 'higher';
    }
    else if (GUESS ==  ANSWER) {
        RESPONSE = "✔";
        responseClass = 'win';
      }

     }
    }
});

I set the value of hidden input dynamically and it's a value chosen by the player with picker number, I means the value of verticleNumber; answer it random value

Thank's a lot

Ad

Answer

The enter key only works on a form if it is considered focused - I think form only having one hidden input is preventing that from ever occurring. Assuming that your submit function is not being called at all, I'd actually break Meteor convention and do a jQuery event listener in your template's onCreated function:

$(document).keypress(function(e) {
    if(e.which == 13) {
        console.log('enter pressed');
        // Your code here to get values and do stuff.
    }
});
Ad
source: stackoverflow.com
Ad