Stuck at the tutorial at Chapter 12
Unanswered
Silver Fox posted this in #help-forum
Silver FoxOP
Dear Next.js fellows,
I am a newbie Next.js fan and just starting my journey. At the moment I am following the dashboard tutorial and got stuck exactly here:
https://nextjs.org/learn/dashboard-app/mutating-data#4-pass-the-id-to-the-server-action
The invoice update server action does not seem to be pushed correctly to the form action on the client. The effect is that if I click on the submit button (Edit Invoice), nothing happens and of course none of the props/values are changed persistently.
There is no XHR or any error in the server or in the client console. But, what I see is that the form action in the Firefox browser's DOM has the following value:
javascript:throw new Error('A React form was unexpectedly submitted. If you called form.submit() manually, consider using form.requestSubmit() instead. If you're trying to use event.stopPropagation() in a submit event handler, consider also calling event.preventDefault().')
I checked this error in Stack-Overflow, as some other people seemed to face a similar problem in React, but none of the situations and solutions seem to represent my problem and some of the solutions I was not able to follow as a newbie in React/Next.
I didn't change any of the tutorials code, so I hope it's OK, if I don't submit the sources here, as they can be viewed in the link above.
The only thing I do differently as in the tutorial is that I use my own local PostgreSQL database, instead of the Vercel online DB, which works perfectly fine, so I got the same results as supposed to from the tutorial until this point.
Also the desired UPDATE SQL query is never sent to the server and also no requests are received that throw errors or anything on my PG DB. This is why I don't exprect the error here.
Please let me know, if you need any more details to understand the problem and I am happy to provide it.
I hope someone already had the same issue and was able to solve it!
Many thx
I am a newbie Next.js fan and just starting my journey. At the moment I am following the dashboard tutorial and got stuck exactly here:
https://nextjs.org/learn/dashboard-app/mutating-data#4-pass-the-id-to-the-server-action
The invoice update server action does not seem to be pushed correctly to the form action on the client. The effect is that if I click on the submit button (Edit Invoice), nothing happens and of course none of the props/values are changed persistently.
There is no XHR or any error in the server or in the client console. But, what I see is that the form action in the Firefox browser's DOM has the following value:
javascript:throw new Error('A React form was unexpectedly submitted. If you called form.submit() manually, consider using form.requestSubmit() instead. If you're trying to use event.stopPropagation() in a submit event handler, consider also calling event.preventDefault().')
I checked this error in Stack-Overflow, as some other people seemed to face a similar problem in React, but none of the situations and solutions seem to represent my problem and some of the solutions I was not able to follow as a newbie in React/Next.
I didn't change any of the tutorials code, so I hope it's OK, if I don't submit the sources here, as they can be viewed in the link above.
The only thing I do differently as in the tutorial is that I use my own local PostgreSQL database, instead of the Vercel online DB, which works perfectly fine, so I got the same results as supposed to from the tutorial until this point.
Also the desired UPDATE SQL query is never sent to the server and also no requests are received that throw errors or anything on my PG DB. This is why I don't exprect the error here.
Please let me know, if you need any more details to understand the problem and I am happy to provide it.
I hope someone already had the same issue and was able to solve it!
Many thx
1 Reply
Silver FoxOP
Never mind! The issue was resolved, after I finished the rest of the chapter, including the deletion-part: https://nextjs.org/learn/dashboard-app/mutating-data#deleting-an-invoice
Are there any dependencies I overlooked in the buttons.tsx for example?
Otherwise it is really weird!
Are there any dependencies I overlooked in the buttons.tsx for example?
Otherwise it is really weird!