onsen ui: change page on Enter key press?

[Jackson]

I’m using onsen ui and I need to know how I can change page on enter key press.

Basically I have a tab bar with 3 buttons in it and I also have an input button for search.

I need to know how I can change the page once the user types something into the search input field and then presses Enter button on their keyboard.

This is my code:

<ons-tabbar id="menu" animation="slide">
    <ons-tabbar-item
          active="true"
          label="Search"
          icon="search"
          page="search.html" id="buttonSearch"></ons-tabbar-item>
    <ons-tabbar-item
          label="signup"
          icon="user-plus"
          page="pts.html" ></ons-tabbar-item>
    <ons-tabbar-item
          label="Locations"
          icon="map-marker"
          page="tab2.html"></ons-tabbar-item>
</ons-tabbar>

and this is my javascript:

<script>

$(document).keypress(function(e) {
    if(e.which == 13) {
    login();
    }
});

</script>
<script>
var login = function() {
  var user_input = document.getElementById('search-input').value;

  var men = document.getElementById('menu');

  if (user_input != '') {
    men.resetToPage('tab2.html', { animation: 'slide' });
  }
  else {
/////////////////

  }
};
</script>

The code above gives me this error:

TypeError: men.resetToPage is not a function
could someone please advise on this issue?

Thanks in advance.

A working FIDDLE:

https://jsfiddle.net/txx296on/1/

[munsterlander]

@Jackson Here is a working fiddle: https://jsfiddle.net/u3wy27s7/

Basically, you are calling a function (method) that does not exist for tabbar. Try setActiveTab. More information here:

https://onsen.io/v2/docs/js/ons-tabbar.html#method-setActiveTab

Working code:

men.setActiveTab(2);

[Jackson]

@munsterlander Thank you very much. it works like a charm.

Do you know if I could use a separate “animation” for this function?

Currently the animation for all the page transitions is set at ‘slide’, I was wondering if I could use ‘lift’ as animation for this function that you’ve shown in your Fiddle?

[Jackson]

ignore my last post. I just noticed that there are only (slide, fade and none) available for the setactive tabbar…

Thanks for your help…