更改表單提交按鈕的值以在表單提交後提交

Question

我在我的網站上有聯繫表單。我希望在提交表單成功提交後，將提交按鈕的文本更改爲「已提交」，甚至可以在提交表單時聲明「提交」。我不確定如何做到這一點，我可以做一個onclick事件，這將改變文本，但不是我想要採取的路由，因爲消息可能無法發送，並且按鈕仍然會提交。

這裏是我的形式

<form method="post" action="contact.php"> 
    <input type="text" name="name" placeholder="Name"><br> 
    <input type="email" name="email" placeholder="Email"><br> 
    <textarea rows="8" cols="65" name="message"placeholder="Message"></textarea><br> 
    <input id="submit" type="submit" name="submit" value="Let's Get In Touch"> 
</form> 

，這裏是我的PHP代碼的html：

<?php 

    $name = $_POST['name']; 
    $email = $_POST['email']; 
    $message = $_POST['message']; 
    $from = 'From: Portfolio Website'; 
    $to = 'kyle.a.binger@gmail.com'; 
    $subject = 'Message From Personal Site'; 

    $body = "From: $name\n E-Mail: $email\n Message:\n $message"; 

    if ($_POST['submit']) { 
     if (mail ($to, $subject, $body, $from)) { 
      echo '<p>Your message has been sent!</p>'; 
     } else { 
      echo '<p>Something went wrong, go back and try again!</p>'; 
     } 
    } 
?> 

有沒有辦法用我現有的PHP代碼做到這一點？預先感謝您的幫助。

Answer 1

你將需要什麼將數據傳遞給PHP腳本，並返回某些東西/回聲東西而不離開頁面。

看看AJAX。你將能夠完全實現這一點。 Here's a link to one of the first posts on stackoverflow that showed up. Here's a link to w3schools to give you a quick example/idea.

Answer 2

如果你不希望使用AJAX和你發佈到自己頁面，您可以執行以下操作

<form method="post" action=""> <!-- removed the PHP file name to post to itself --> 
    <input type="text" name="name" placeholder="Name"><br> 
    <input type="email" name="email" placeholder="Email"><br> 
    <textarea rows="8" cols="65" name="message"placeholder="Message"> </textarea><br> 
    <?php 
     if (isset($_POST['submit'])) { 
     echo '<input id="submit" type="button" name="submit" value="Submitted">'; //Changed type submit to button 
     } else { 
     echo '<input id="submit" type="submit" name="submit" value="Let\'s Get In Touch">'; 
     } 
    ?> 
</form> 

<?php 
    $name = $_POST['name']; 
    $email = $_POST['email']; 
    $message = $_POST['message']; 
    $from = 'From: Portfolio Website'; 
    $to = 'kyle.a.binger@gmail.com'; 
    $subject = 'Message From Personal Site'; 

    $body = "From: $name\n E-Mail: $email\n Message:\n $message"; 

    if ($_POST['submit']) { 
     if (mail ($to, $subject, $body, $from)) { 
      echo '<p>Your message has been sent!</p>'; 
     } else { 
      echo '<p>Something went wrong, go back and try again!</p>'; 
     } 
    } 
?>