CODEWITHSUNDEEP
jqueryhtml
Domas
Domas

Reputation: 1133

A solution for a pop up form notification needed

I use this jquery script to invoke a modal pop up which basically is a contact form.

What happengs in the code is that the following div is hidden before one of the images is clicked:

    <div id="toPopup"> 

        <div class="close"></div>
        <span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
        <div id="popup_content"> <!--popup content starts-->


<form action="mail.php" method="POST">
<input id="firstinput" type="text" name="name" placeholder="Navn"><br/>
<input type="text" name="email" placeholder="Email"><br/>
<input type="text" name="phone" placeholder="Telefon nr">

<br />

<textarea name="message" rows="6" cols="25" placeholder="Besked"></textarea><br />
<input type="submit" value="Send">
</form>
        </div>
    </div>

After the form is filled in and sent, the php script just echos a thak you message. What I want to do is after the form is submitted a thank you message to appear in the same pop up. I wonder what solution would make most sense.

Any help or guidance is much appreciated.

Upvotes: 0

Views: 266

Answers (2)

William Buttlicker
William Buttlicker

Reputation: 6000

There can be two solutions for this.

1. Use AJAX to submit the form

You may submit the form using ajax. Now when you get the response you can change the HTML inside the Popup showing thank you message.

2. Submit the Form and add a parameter in the URL

Submit the form as you are doing now. If the form submission is successfull, add a variable in session or URL. Now check if that variable is set and open the popup with message.

I would say 1st approach is the best.

Upvotes: 1

markusthoemmes
markusthoemmes

Reputation: 3120

If you want it as a kind of "in-place" approach, use AJAX to submit the form and insert the thank you message using JavaScript.

See: jQuery AJAX submit form for enormous details on submitting a form using AJAX/jQuery.

Another solution without using Javascript to submit would be to simply send the form with PHP like it is. You could reference the same file in your form and after checking for success insert your "Thank you" message in the popups code. In that case also insert a class on the popups outer element to force it to show without activating it.

Upvotes: 1

Related Questions