q-form not submitting the form

[sirfak]

Hi i have requriement the form redirect to 3rd party payment gateway endpoint with post data . However my below code does not submit.

<q-form
     id="app"
     @submit="submitPayment"
     action="https://redirect-browser-here-with-form-data"
     method="post"
     ref="form"
   >
     <p>
       <q-input id="name" v-model="name" type="text" name="name" />
     </p>

     <p>
       <q-btn type="submit" value="Submit" />
     </p>
   </q-form>

submitPayment: function() {      this.$refs.form.submit(); }

I am using v17 on ubuntu. I can see submit even fired in vue dev tools but the browser does not redirect to 3rd party url
Can anyone suggest what is wrong here?

[s.molinari]

Are you using v17 of Quasar? So, 0.17? If so, there is no such thing as q-form in v17.

Also, if that is your code, where are your script tags and the rest of your SFC code?

Scott

[sirfak]

@s-molinari its 1.5.5 (sorry about the type)

as far as SFC is concerned, i only added the relavant portion of the code ie q-form and submit method. here is how my SFC looks like

<template>
 <q-page padding>

   <q-form
     id="redirectForm"
     action="https://test.cashfree.com/billpay/checkout/post/submit"
     method="post"
     ref="paymentform"
     @submit.once="submitPayment"
   >
     
     <q-input type="hidden" name="customerName" value="John" />
     <q-input type="hidden" name="customerEmail" value="Johndoe@test.com" />
     <q-input type="hidden" name="customerPhone" value="9999999999" />
    
    

     <p>
       <q-btn value="Submit" type1="submit" type="submit" />
     </p>
   </q-form>
 </q-page>
</template>

<script>
export default {
 data() {
   return {
     name: null
   };
 },
 // name: 'PageName',
 methods: {
   submitPayment: function(e) {
     console.log("submitting");
     e.preventDefault();
     this.$refs.paymentform.submit();
   }
 }
};
</script>

Below is what is see in my vue developer tool

[sirfak]

hi i got this working with

this.$refs.paymentform.$el.submit();

as mentioned in this thread
https://forum.quasar-framework.org/topic/4547/error-after-upgrade-to-latest-version-for-triggering-qbtn-on-enter