Change content button on click form [closed]

Question

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.

---

Questions must demonstrate a minimal understanding of the problem being solved. Tell us what you've tried to do, why it didn't work, and how it should work. See also: Stack Overflow question checklist

Closed 8 years ago.

Improve this question

I have a contact form for people to fill in if they want to contact me. A php page does the action of sending the stuff to my emailadress.

2 problems:

1. I want the content of the confirm button to change to: "MESSAGE SEND!" when someone clicks on the button. But I want it to change back to original state after 3 sec.

2. When you click the button it loads the php page in my browser! That's not what I want. I just want the button to send me an email and not to go to another page.

Hope you can help!

Answer 1

At first, you are going to have to use Javascript and AJAX. And why don't you use a javascript library like Jquery?

Assuming you are going to use it, the code goes like this.

HTML:

<form id="yourForm">
    <label for="name">Name</label>
    <input id="name" name="name" type="text" />
    <input class="submitBtn" type="submit" value="OK"/>
</form>

Javascript:

$(document).ready(function(){
    $('#yourForm').submit(function(event){
        $('.submitBtn').attr('value','MESSAGE SEND');

        setTimeout(function(){
            $('.submitBtn').attr('value','OK');
        }, 3000);

        var stuff = $('#yourForm').serialize();

        jQuery.ajax({
            type: 'POST',
            url: 'your_php_code.php', 
            data:{
                'stuff':stuff,                
            }
            ,success: function( response ){
                alert('OK');
            }
        });

        //Prevents form submission
        return false;        
    });
});

PHP

<?php
    parse_str($_POST['stuff']);
    mail("youremail@gmail.com", "subject", $name);
?>

Answer 2

try this

1.

<input type="button" onclick="showLoad()" id="send" name="send" value="SEND"/>
<script>
function showLoad() {
document.getElementById('send').value="MESSAGE SEND!";
setTimeout(swap, 3000);
}
function swap() {
document.getElementById('send').value="SEND";
}
</script>

2.

<form action="" method="post">
......
......
/*your html code*/
<input type="button" onclick="showLoad()" id="send" name="send" value="SEND"/>
</form>
<?php 
if(isset($_post['send']))
{
/*your mail function*/
}
?>

Answer 3

For your 1 Problem, you'll Need JavaScript to Change the Button behavior, for your 2 Problem just make a Header Redirect from the PHP Script doing the Action