Sumission issue

JavaScript
1

I am getting a submission error when I submit a form. The script initializes the object and the function $prod->process formats the form data and then outputs it to a string called $prod->results; I am tryign to get that output into a json array to output into a textarea on the form. Everythign works fine when I use the following code in the default of the switch:


$response_array['status'] = 'success';
$response_array['message'] = 'Great Job';

But when I use the PHP shown below, It gives me the error ‘There was an error submitting the form. Please try again.’

I have verified that $prod-process works correctly and the correct information is being put into $prod->results as well.

Not sure what is going on … please help.


include 'prod_creation.php';

$response_array = array();
switch(TRUE)
	{
		case empty($_POST['prod_name']):
			$response_array['status'] = 'error';
			$response_array['message'] = 'Error: Please enter a Product Name';
		break;
		case empty($_POST['manu']):
			$response_array['status'] = 'error';
			$response_array['message'] = 'Error: Please enter a Manufacturer';
		break;
		case empty($_POST['cat']):
			$response_array['status'] = 'error';
			$response_array['message'] = 'Error: Please enter a Product Category';
		break;
		case empty($_POST['prod_desc']):
			$response_array['status'] = 'error';
			$response_array['message'] = 'Error: Please enter a Product Description';
		break;
		case empty($_POST['pack_con']):
			$response_array['status'] = 'error';
			$response_array['message'] = 'Error: Please enter a Package Contents';
		default:
                        $prod=new prod_creation($_POST['prod_name'], $_POST['manu'], $_POST['cat'], $_POST['prod_desc'], $_POST['spec_field'], $_POST['feat'], $_POST['pack_con'], $_POST['extra']);
			$response_array['status'] = 'success';
			$prod->process($_POST['prod_name'], $_POST['manu'], $_POST['cat'], $_POST['prod_desc'], $_POST['spec_field'], $_POST['feat'], $_POST['pack_con'], $_POST['extra']);
			$response_array['message'] = $prod->results;
		break;
	}

echo json_encode($response_array);

Here is the jquery:


$(document).ready(function(){

    $("#open_form").submit(function(){

        $.ajax({
            type: "POST",
            url: "open_process.php",
            data: $("#open_form").serialize(),
            dataType: "json",

            success: function(msg){
				$('textarea[name=output]').html(msg.message);

            },
            error: function(){
                $('textarea[name=output]').html("There was an error submitting the form. Please try again.");
            }
        });

        //make sure the form doesn't post
        return false;

    });

});


<form id="open_form" method="POST" >
<table width="694">
	<tr>
        <td width="101"><label for"prod_name">Product Name: </label></td><td colspan="3"><input type="text" name="prod_name" size="74" /></td>
    </tr>
    <tr>
        <td><label for"manu">Manufacturer: </label></td><td width="246"><input type="text" name="manu" size="40"/></td>
        <td width="99"><label for"prod_num">Prod Number:</label></td> <td width="228"><input type="text" name="prod_num" size="15"/></td>
    </tr>
    <tr>
        <td><label for"cat">Category: </label></td><td colspan="3"><input type="text" name="cat" size="40"/></td>
	</tr>
</table>
<label for"prod_desc">Product Description: </label><br />
<textarea name="prod_desc" cols="115
" rows="5"></textarea><br /><br />

<label for"spec_field">Specifications: </label><br />
<textarea name="spec_field" cols="115" rows="5"></textarea><br /><br />

<label for"feat">Features: </label><br />
<textarea name="feat" cols="115" rows="5"></textarea><br /><br />

<label for"pack_con">Package Contents: </label><br />
<textarea name="pack_con" cols="115" rows="5"></textarea><br /><br />

<label for"extra">Extra code: </label><br />
<textarea name="extra" cols="115" rows="5"></textarea><br /><br />

<input name="submitForm" type="submit" value="Submit">&nbsp;<input type="reset" value="Reset" /><br /><br />

<label for"output">Output: </label><br />
<textarea name="output" cols="115" rows="5"></textarea>

</form>
2

Your best bet would be to use a tool like Firebug for Firefox or the Google developer tools as to me it sounds like your request is failing and not the code itself.

3

Sorry it took so long to reply and thank you for that suggestion. I am no longer getting the error but when I submit the page nothing is showing in the text area after the script is executed with the exception of in Google Developer tools. When I view the output field in there I see the correct information is actually there, but it it is not being displayed when I am viewing the page and even if I right click on the page and go to ‘view source’ it shows nothing.

I am thinking it might have something to do with the HTML tags that are being generated by the script. There is a command in PHP (htmlspecialchars) that outputs a string so you can see any and all html tags on the screen without the browser executing any of them. Is there an equivalent in javascript? I have been looking but haven’t found anything or I just might be completely off track on this. Any and all help is very much appreciated.

4

View source does not show you what happens after the page has loaded. The only thing that view source shows you is the original HTML content that was retrieved from the server.

What can be done with Chrome’s developer tools is to set a breakpoint on the statement in the success function so that you can then easily investigate the msg response from the server.

5

Thanks again for the reply… I will try it and let you know what happens…

6

Got it…

Once I changed the encoding from HTML to text in the javascript from:

$(‘textarea[name=output]’).html(msg.message);

to this:

$(‘textarea[name=output]’).text(msg.message);

it worked fine.