How to return results of submitted form in a modal

335
November 23, 2016, at 9:13 PM

I have a contact form on contactpage1.php (department, name, email, message). When it is submitted the form 'action' is contactpage2.php which validates the data and either return error messages or emails the message.

Rather than having to go to contactpage2.php, I would prefer to keep everything on one page and have contactpage2.php open in a modal.

How would I do that?

So far, I've seen lots of example of clicking a button to open a modal with the contact form but that's not what I am after. Can I do it as described above?

I'm using Bootstrap modals elsewhere on the site.

Answer 1

Answer taken from a comment by Shehary

Here are the steps according to your question

  1. you have form on contactpage1.php.
  2. Submit it with Ajax.
  3. show modal in Ajax success function with $('#selector').modal('show');

You can also bind the element in modal to show the message in modal, so what you need is the Ajax Method and all other steps can be taken care inside Ajax call.

READ ALSO
jquery each if statement highlight matching variable

jquery each if statement highlight matching variable

I am blanking on how to get this to work. Basically I am just trying to go over a list of items that are nav links and compare them to the title of the page.

315
Visual Studio 2015 + TypeScript 1.6.3 + JQuery

Visual Studio 2015 + TypeScript 1.6.3 + JQuery

I'm using Visual Studio 2015, and I have a project that uses Typescript 1. 6.

450
Scroll to div position unless browser back button is pressed

Scroll to div position unless browser back button is pressed

I'm using hash in url (like http://somepage. com/text#hash) scrolling to div with id #hash.

307
Mobile navigation toggle won't work when clicking on it

Mobile navigation toggle won't work when clicking on it

I made navigation for smaller screen. When I click on menu toggle the menu will show.

267