Opening form in DIV

Robbie · 13-12-2008, 10:44 PM

Hey,

Im using AJAX to open pages in a div (obv

) but I have a page opened in it with a form in and when I submit the form it doesnt submit in the div but in a new page, how can I stop this?

Thanks

~~Jackboy~~ · 13-12-2008, 11:57 PM

Originally Posted by Robbie!

Hey,

Im using AJAX to open pages in a div (obv

) but I have a page opened in it with a form in and when I submit the form it doesnt submit in the div but in a new page, how can I stop this?

Thanks

I had this problem.

Basically Iszak and Matt coded Js for me to fix it.

You gotta call a function on form submit and it either requests a php file, my login form for instance, and returns var or w/e. Or just posts form info to file then reloads to submit page.

~~Moh~~ · 14-12-2008, 12:41 AM

I guess you mean submitting a form via javascript?

I have created a simple form which will submit via javascript if this is was you require.
http://www.habbcrazy.net/jack/contacttest.php

For this, you will have to download prototype and scriptaculous (google them)

contacttest.php

HTML Code:

<head>
<script type="text/javascript" language="javascript" src="js/prototype.js"></script>
<script type="text/javascript" language="javascript" src="js/scriptaculous.js"></script>

<script language="javascript" type="text/javascript">
function submitForm()
{
    name = document.getElementById("name").value;
    email = document.getElementById("email").value;
    message = document.getElementById("message").value;

    $('form-container').innerHTML = '<img src="loading.gif" />';
    
    new Ajax.Request('submit.php',
    {
        parameters: {name: name, email: email, message: message},
        onSuccess: function(transport)
        {
            $('form-container').innerHTML = transport.responseText;
        }
    });
}
</script>

</head>

<body>
<div id="form-container">
    <form id="form" action="javascript:submitForm();" method="post">
        <strong>Name</strong>:<br>
        <input type="text" size="20" id="name" name="name"></input><br>
        <br>
        <strong>Email</strong>:<br>
        <input type="text" size="20" id="email" name="email"></input><br>
        <br>
        <strong>Message</strong>:<br>
        <textarea cols="30" rows="5" id="message" id="message"></textarea><br>
        <br>
        <input type="submit" value="Submit"></input>
    </form>
</div>
</body>

submit.php

HTML Code:

<?php

if(isset($_POST["name"]) && isset($_POST["email"]) && isset($_POST["message"])) {
    
    $name = $_POST["name"];
    $email = $_POST["email"];
    $message = $_POST["message"];
    
    if($name == "" || $email == "" || $message == "") {
        echo("<p><font color=\"red\">You left a required field blank!</font></p>
                <form id=\"form\" action=\"javascript:submitForm();\" method=\"post\">
                    <strong>Name</strong>:<br>
                    <input type=\"text\" size=\"20\" id=\"name\" name=\"name\" value=\"$name\"></input><br>
                    <br>
                    <strong>Email</strong>:<br>
                    <input type=\"text\" size=\"20\" id=\"email\" name=\"email\" value=\"$email\"></input><br>
                    <br>
                    <strong>Message</strong>:<br>
                    <textarea cols=\"30\" rows=\"5\" id=\"message\" id=\"message\">$message</textarea><br>
                    <br>
                    <input type=\"submit\" name=\"Submit\"></input>
                </form></p>");
    } else {
        echo("<p><font color=\"green\">Your message has been sent (Well, not really)</font></p>
                <p>
                    <strong>Name</strong>: $name<br>
                    <strong>Email</strong>: $email<br>
                    <strong>Message</strong>:<br>
                    $message
                </p>");
    }
} else {
    header('Location: contacttest.php');
}

?>

Hope this helps

~~Jackboy~~ · 14-12-2008, 01:10 AM

Nice one Jack. You got a cool name too. Security would be in order next time.

~~Moh~~ · 14-12-2008, 01:29 AM

Originally Posted by Jackboy

Nice one Jack. You got a cool name too. Security would be in order next time.

Your names cool too

Yes, I'm really going to add security to an example

Jxhn · 14-12-2008, 08:25 AM

Originally Posted by Jack120

Your names cool too

Yes, I'm really going to add security to an example

You hosted it on habbcrazy so you probably should have.

Robbie · 14-12-2008, 08:31 AM

Thanks for help guys but I sorted it anyway. +Rep

Thread: Opening form in DIV

Thread Tools

Opening form in DIV

Posting Permissions