question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Ionic v4] Reactive form reloads the page on submitting

See original GitHub issue

Bug Report

Ionic Info Run ionic info from a terminal/cmd prompt and paste the output below.

Ionic:

   ionic (Ionic CLI)          : 4.0.0-rc.13 (C:\Users\##\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.0
   @angular-devkit/core       : 0.7.0-rc.3
   @angular-devkit/schematics : 0.7.0-rc.3
   @angular/cli               : 6.0.8
   @ionic/ng-toolkit          : 1.0.0
   @ionic/schematics-angular  : 1.0.0

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : none

System:

   Android SDK Tools : 25.2.5
   NodeJS            : v8.11.3 (C:\Program Files\nodejs\node.exe)
   npm               : 5.6.0
   OS                : Windows 10

Environment:

   ANDROID_HOME : C:\Program Files (x86)\Android\android-sdk

Describe the Bug Reactive forms not working as expected in ionic v4 beta. When submitting the form it reloads the page instead, it should just submit the form values.

Steps to Reproduce Steps to reproduce the behavior:

  1. Go to ‘https://reactive-form-bug.stackblitz.io/login
  2. Fill form fields / leave empty
  3. Click on ‘submit’
  4. Page reloads

Related Code StackBlitz.

Expected Behavior Submitting the form it should just submit the form values.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:6

github_iconTop GitHub Comments

2reactions
gagaXDcommented, Jul 26, 2018

Hello there,

I’m having the same issue.

I may have found something :

If I use

<form class="list-form" [formGroup]="loginForm"  (ngSubmit)="onSubmit(loginForm)">
    ....
    <ion-button type="submit"></ion-button>
</form

The page is reloading when clicking on the button

But, If I use

<button type="submit" >Test</button>

Then, my submit function is called.

Hope this will helps !

Cheers

0reactions
ionitron-bot[bot]commented, Sep 1, 2018

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Ionic-5, Reactive Form, refresh the page on submit
On click of Submit, it refresh the page. Anyone suggestion pls for this. I don't want click event in button. ionic-framework.
Read more >
FormSubmit doesn't update value without refresh page
When I submit my form, the values are updated well but not reactive. I have to refresh the page to see the modification....
Read more >
How to Create a (Reactive) Form using Ionic Framework
Learn how to use Ionic Framework components and Angular's Reactive Forms to display a form in your application, capture, and validate its ...
Read more >
Submit a Form Without Page Refresh Using jQuery - Code
A great way to improve the user experience of your website is to validate and submit forms without a page refresh.
Read more >
Angular 9 Reactive Forms On Submit Reloading The Route
With reactive forms, we can add validation to the fields and access their When we click on the submit button, Angular will catch...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found