title: VueJS prevent form submission on submit and submit the form on keyup
body: <p>I have a form that looks like this:</p>
  
  <pre><code>&lt;form id="myForm" action="/searchuser" method="POST" @submit.prevent="onSubmit(inputValue)"&gt;
     &lt;div class="field"&gt;
        &lt;label class="label"&gt;Name&lt;/label&gt;
        &lt;div class="control"&gt;
           &lt;input class="input" type="text" placeholder="Text input" v-model="inputValue" @keyup="onKeyUp" @blur="inputFocused = false"&gt;
           &lt;ul v-if="inputFocused"&gt;
              &lt;li v-for="value in values"&gt;&lt;a class="panel-block is-primary" :href="value.link"&gt;@{{value.title}}&lt;/a&gt;&lt;/li&gt;
           &lt;/ul&gt;
        &lt;/div&gt;
     &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>And in my JavaScript, I have two methods onSubmit and onKeyPress:</p>
  
  <pre><code>&lt;script&gt;
  export default {
    data() {
      return {
        inputValue: "",
        inputFocused: false,
        values: [
          { title: "facebook", link: "http://facebook.com" },
          { title: "twitter", link: "http://twitter.com" },
          { title: "gplus", link: "http://plus.google.com" },
          { title: "youtube", link: "http://youtube.com" }
        ]
      };
    },
    methods: {
      onKeyUp: function() {
        document.forms["myForm"].submit();
        this.inputFocused = true;
      },
      onSubmit: function(inputval) {
        console.log(inputval);
      }
    }
  };
  &lt;/script&gt;
  </code></pre>
  
  <p>What I am trying to achieve is when the user presses a key, I want the form to be submitted but I don't want the page to be redirected to <code>/searchuser</code> route. But as soon as I press a key, the page gets redirected even though I am using the <code>prevent</code> modifier to prevent the submission. How do I prevent it from being redirected and submit it on keyup/keydown only? My goal is to perform an ajax call through <code>onSubmit</code> by sending the <code>inputval</code> to the server.</p>