Question on registering a function to receive form data and files

[jaxon-php]

Question on registering a function to receive form data and files

[feuzeu]

Hi,
Try this

$jaxon->register(Jaxon::USER_FUNCTION, 'myFunction', ['upload' => "'upload_example'"]);

That's how options are passed to functions when they are registrered.

[seba1rx]

I had some progress now thanks to your advice, now I am saving the image but lost all other form data.

I get PHP Notice: Undefined index because there is no form data.
I debugged the content and nothing is being received as agrs in the function.

$jaxon->setOption('upload.default.dir',$_SERVER['DOCUMENT_ROOT'].'/upl/temp');
$jaxon->register(Jaxon\Jaxon::USER_FUNCTION, 'myFunction', ['upload' => "'upload_example'"]);

I decided to go arroud this and created a simple ajax function that creates a formData var and adds the image to it, then it POSTs it to myUploaderController.php and waits for the response, if ok, then it calls

jaxon_myFunction(jaxon.getFormValues('myForm'));

Here is my workarroud:

html calling ajax function:
<button type="button" onclick="processImage();">Save all this data</button>

Jaxon controller:

$jaxon->register(Jaxon\Jaxon::USER_FUNCTION, 'prepareForm');
$jaxon->register(Jaxon\Jaxon::USER_FUNCTION, 'myFunction');
$jaxon->processRequest(); 

function prepareForm(){
	$jxnr = new Jaxon\Response\Response();
	
	// setup form html with smarty in my case
	
	$jxnr->setFunction('processImage', '', "
		var fileInput = document.getElementById('upload_example');
		var file = fileInput.files[0];
		var formData = new FormData();
		formData.append('file', file);
		
		//##DEBUG:
		//for (var [key, value] of formData.entries()) { 
		//	console.log('log: ' + key, value);
		//}
		
		//2097152 = 2MB
		
		if(formData.get('file')['size'] > 2097152 ){
			console.log('too big')
		}else{
			$.ajax({
				url: 'util/myUploaderController.php',
				type: 'POST',
				data:  formData,
				contentType: false,
				cache: false,
				processData: false,
				dataType: 'json'
			}).done(function (response) {
				if(response.hasError){
					//ok, call jaxon
					jaxon_myFunction(jaxon.getFormValues('myForm'));
				}else{
					//ERROR, popMsg
					console.log('ERROR: '+response.msg)
				}
				//console.log('bo: '+response.bo);
				//console.log('msg: '+response.msg);
			});
		}
		
		return false;
	");
	
	return $jxnr;
}

function myFunction( $formData ){
	$jxnr = new Jaxon\Response\Response();
	$jxnr->setReturnValue($formData );		
	$jxnr->script(" console.log('debugging in browser console...') ");
	
	//validate form data and do whatever I need to do with it
	
	return $jxnr;
}

My uploader controller demo:

<?php

// deal with image here

$response = array(
	'hasError' => true,
	'msg' => 'demo msg',
	'data' => null
);

echo json_encode($response);
?>

[feuzeu]

Hi,
Does your browser support FormData?
When the browser does not support FormData, Jaxon will send 2 requests to your application. The first request uploads the files, and thus contains no data other than the files. The second request will then contain your form data.
Replace $jaxon->canProcessRequest(); with the following to handle this case

if($jaxon->canProcessRequest())
{
    // Process the request.
    $jaxon->processRequest();
}
else if($jaxon->hasUploadedFiles())
{
    // Process upload.
    $jaxon->saveUploadedFiles();
}

[seba1rx]

Hello, thanks for your reply!

I tried

if($jaxon->canProcessRequest()){
	// Process the request.
	$jaxon->processRequest();
}else if($jaxon->hasUploadedFiles()){
	// Process upload.
	$jaxon->saveUploadedFiles();
}

and also

if($jaxon->canProcessRequest()){
	// Process the request.
	$jaxon->processRequest();
}else if($jaxon->hasUploadedFiles()){
	// Process upload.
	$jaxon->processRequest();
	$jaxon->saveUploadedFiles();
}

I get the image in my configured directory, but still myFunction wont get the args.

[feuzeu]

Run the request in debug mode and see what's the value returned by the jaxon.getFormValues('myForm') call.

Also try to put the file input field in a separated form.

<form id="myForm" name="myForm">
	<input id="someText" name="someText" type="text">    
</form>

<form>
	<input type="file" id="upload_example" name="example_file" />
</form>

[feuzeu]

Hi,

I have made a change to properly decode parameters when they are "multipart/formdata" encoded.
Check out the 2.2.6 release.

There've also been some changes in the js library: Raw values of input fields of type file are no more included form data, and "multipart/formdata" encoding is used if the user actually selects files to upload.
They are in the 2.2.6 release.

[seba1rx]

Wow thanks!

I'll check it out!