0

I have been on this site all day and can't seem to find what I need - no duplicate post intended.

I have a form containing a link which calls a modal popup containing a different form.

###### PARENT PAGE #############
<form...>
...
<a href="php_page.php?id=<?php echo $id; ?>&sect=<?php echo $sect; ?>">link</a>
...
</form>

**** MODAL POPUP ****
<form...>
...
<input type="submit" />
</form>
**** END MODAL POPUP ****

### END PARENT PAGE #############

When I submit the form in the modal popup, the parent page is refreshed to show the updated info in the corresponding section of the page; except that the first form is not submitted and when the page refreshes to update the necessary section, the contents of the first form is lost.

I have tried using ajax to refresh only the necessary section of the page but that doesn't work as the sections that need refreshing use php variables with contents from mysql.

The system does what it needs to do and I don't mind the refresh. But I need a way to keep the user data entered into the first form.

Is it possible to submit the first form at the same time as the second to the same php page or any other way of preserving the user data in the first form on page reload without submitting it.

1
  • combine the two forms into one. Commented Dec 11, 2012 at 21:00

2 Answers 2

1

You cannot do this with pure php. You'll need javascript and write it in a way that when you hit submit on the modal it 'puts' the information back into the parent form.

One way is to make the modal form submit button not an actual submit button.

You might even be able to get away with taking the filled out section dom elements in the modal injected back into the parent form. Some jquery plugins already do this. For example colorbox

Here is a working example using only ONE <form> tag and jquery colorbox. http://jsbin.com/olalam/1/edit

Sign up to request clarification or add additional context in comments.

2 Comments

Thanks for your response Anthony. Can I also get the value of a file input type from the colorbox?
@echez yes, there is only one form, so technically once you remove the part that is doing the alert in the example and submit the form normally you'll get all the form values as normal.
0

I am not a php developer, so I'll suggest an alternative approach.

Before you refresh the page, you can serialize the form and store the data locally (e.g. in a cookie) then restore the data back into the form. Granted, that will require a bit more JS code, but should get you what you want.

UPDATE: Since you mentioned that you might need a little assistance on the JS front, here is some guidance:

  1. Grab the jquery.cookie plugin here.
  2. Grab the jquery.deserialize plugin here.
  3. Use the following code as a starting point.

.

// the name of the cookie
var cookieName = 'myCookieName';

function beforeSubmit() {
    // serialize the form into a variable
    var serializedForm = $('#id-of-form').serialize();
    // store the serialized form
    $.cookie(cookieName, serializedForm, { path: '/' });
}

function afterRefresh() {
    // read the cookie
    var serializedForm = $.cookie(cookieName);
    // de-serialize the form
    $('#id-of-form').deserialize(serializedForm, true);
}

HTH

2 Comments

Many thanks for the response. I will definitely look into this approach - though my JS is somewhat basic.
Thanks for the sample code... It will surely be of help if I implement this approach.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.