title: Avoid form resubmission on reload with AJAX and Warning: Cannot modify header FIX
body: <p>The problem that I am facing here is that the form is resubmitted when the page is being refreshed. Now I know there are plenty of answers online for the problem I have stated above. But what is different in my problem is that I am using ajax to submit the form so the form is not redirecting and only a section of it is updated. Since I don't want the page to redirect therefore I can not use the post/redirect/get method.</p>
  
  <p>This is my code:</p>
  
  <p>HTML:</p>
  
  <pre><code> &lt;form method="post" onsubmit="return submitdata();"&gt;
     &lt;textarea maxlength="3000" id="profile-post" name="profile-post" placeholder="Write a post..." rows="3" cols="65" required&gt;&lt;/textarea&gt;
     &lt;input type="submit" value="Post"&gt;
   &lt;/form&gt;
  </code></pre>
  
  <p>script:</p>
  
  <pre><code> function submitdata()
          {
           var post=document.getElementById( "profile-post" );
  
           $.ajax({
            type: 'post',
            url: 'page.php',
            data: {
             post:post
            }
           })
           };
  </code></pre>
  
  <p>PHP:</p>
  
  <pre><code>if(isset($_POST['profile-post'])){
    $post = $_POST['profile-post'];
    mysqli_query($dbc,"INSERT INTO make_post (post, time, date, user_id) VALUES ('$post', CURTIME(), CURDATE(), '$id_profile')"); 
    }
  </code></pre>
  
  <p>}</p>
  
  <p>Is there any other way I can achieve the desired result which I couldn't find during my search online.</p>
  
  <p>Thanks.</p>