{"id":1029,"date":"2020-09-21T12:30:23","date_gmt":"2020-09-21T11:30:23","guid":{"rendered":"https:\/\/greladesign.co\/blog\/?p=1029"},"modified":"2020-09-21T12:30:23","modified_gmt":"2020-09-21T11:30:23","slug":"when-you-click-and-page-reloads","status":"publish","type":"post","link":"https:\/\/greladesign.co\/blog\/2020\/09\/21\/when-you-click-and-page-reloads\/","title":{"rendered":"When you click and page reloads&#8230;"},"content":{"rendered":"<p>when you have a button on a page that, when you click, reloads the page and you don&#8217;t know why, it maybe that your button is within the <code>form<\/code> tag and defaults the type to <code>submit<\/code>. Make sure your button has a type specified as a <code>button <\/code>to solve that.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n&lt;Form&gt;\r\n{\/* some code *\/}\r\n  &lt;MyButton&gt;My Button&lt;\/MyButton&gt;\r\n{\/* some code *\/}\r\n&lt;\/Form&gt;\r\n<\/pre>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nimport React from 'react';\r\n\r\nconst MyButton = () =&gt; &lt;button type=&quot;button&quot;&gt;{children}&lt;\/button&gt;\r\nexport default MyButton;\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>when you have a button on a page that, when you click, reloads the page and you don&#8217;t know why, it maybe that your button is within the form tag and defaults the type to submit. Make sure your button &hellip; <a href=\"https:\/\/greladesign.co\/blog\/2020\/09\/21\/when-you-click-and-page-reloads\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":""},"categories":[138,141,325],"tags":[350,348,347,322,349],"_links":{"self":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts\/1029"}],"collection":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/comments?post=1029"}],"version-history":[{"count":5,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts\/1029\/revisions"}],"predecessor-version":[{"id":1035,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts\/1029\/revisions\/1035"}],"wp:attachment":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/media?parent=1029"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/categories?post=1029"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/tags?post=1029"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}