Jump to content
Larry Ullman's Book Forums

Modal Window With A Form Problem


Recommended Posts

I am using a modal window as a container for a simple form. This "POST" form submission works fine in Firefox every time. In IE9 and Chrome the form action and method is apparently being ignored. In IE and Chrome the submission redirects the user to a random page because the method defaults to "GET" and  all of the POST data ends up in the query string.  The form should should "POST" data to a PHP script that saves the data and then redirects the user back to the original page.

 

Here is the form action:

<form id="edit_form" action="update_question.php" method="POST">

The submission ignores the action and method.

 

So, I guess the question is: Should I be able to use a modal window as a form container...that will work in all modern browsers of choice?

 

 

 

 

Link to comment
Share on other sites

Well, before anybody wastes any time trying to help me. I find the problem has nothing to do with the modal window. I copied the form code to a new script outside of the modal and I am having the same issue. I will look over my code and report my error. Sorry for wasting bandwidth.

Link to comment
Share on other sites

I am using the code from the book to make the modal, just a div. The way I am using the modal is this:

 

A row of questions in an HTML table is clicked by the user. This sends the row id of the clicked row to an ajax function that sends the row id to a PHP script that fetches the question and returns the string and this HTML inside the modal window:

<?php
echo'
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test</title>
</head>
<body>
	<div style="margin-top: 100px; margin-left:10px; overflow: hidden;">
		<form id="edit_form" action="update_question.php" method="POST" >
		<fieldset>
		<legend>Edit the selected text and submit the changes</legend>
			<textarea name="editText" rows="10" cols="100">This is some text to send to the script</textarea>
			<input type="hidden" name="quest_id" value="1">
			<div style="text-align: center; margin-top: 50px;"> 
				<input type="submit" name="submit" value="submit">
			</div>
		</fieldset>	
		</form>
	</div>
</body>
</html>';
?>

I simplified the script for clarity. Up to this point everything works fine. When I click submit, The form's action is ignored and the method defaults to GET and I get redirected to the same page every time. I var_dumped the POST at update_question.php, but I never actually get there. If I take the same code and put it into a separate script without using the modal window, it works as expected. It works fine in Firefox every time. It must be a problem with how I am using this echoed string as my response text to create the form in the first place. I am perplexed at this point. Thanks for your time.

Link to comment
Share on other sites

I refactored my javascript to jquery just for fun and the problem is fixed. Due to the lack of experience when I originally wrote the javascript, I had some ugly code. Lessons learned from my last thread helped me get through this and fix it. I am not sure really what was causing the problem specifically, but I suspect several things. That darn learning curve! Thanks.

Link to comment
Share on other sites

 Share

×
×
  • Create New...