javascript passing textbox value to PHP file

Hi I have a code that take an image from someones cam and save the picture to my server.
I am trying to make it save the picture with a filename same as what is written in the Name Textbox.

Here is the Javascript code that Im trying in test.html where it is part of a form.

 <script type="text/javascript">
		 var filename = document.getElementById('first_name').value;

		webcam.set_api_url( 'test.php?filename=' + escape(filename));

		webcam.set_quality( 90 ); // JPEG quality (1 - 100)
		webcam.set_shutter_sound( true ); // play shutter click sound
	 </script>

Code (markup):

And here is test.php

<?php

$filename = date('mdHis') . '.jpg';

$result = file_put_contents( $filename, file_get_contents('php://input') );

if (!$result) {
	print "ERROR: Failed to write data to $filename, check permissions\n";
	exit();
}

$url = 'http://' . $_SERVER['HTTP_HOST'] . dirname($_SERVER['REQUEST_URI']) . '/' . $filename;
print "$url\n";

?>

PHP:

any ideas on what I am doing wrong??
Thanks in Advance

 

Even if you would get the filename argument with $_POST['filename'], the POSTed image data of the raw source "php://input" would get merged with the data of that filename.

How will look $_POST with "var_dump($_POST)"?

With that limited information you shown here we can just do a wild guess.

 

Thanks for your reply.
I attached all files so you get an idea of whats happeneing.

 

This is including your changes or the original?

 

No this was with my changes
Attached now is the original...