File Uploader attached to partial loaded via AJAX

[responsiv]

File Uploader attached to partial loaded via AJAX

[rajakhoury]

@daftspunk Thanks!

somehow made it work! :))

The problem was from my end not the plugin, as you can see above I am binding the component to a User, here the User is not the Logged in User but the model to update so $this->getUser() expects an input with the user's identifier and the problem was when the uploader submits the files it was missing an input User which is null - so I wrap the uploader component in a form and added a hidden input with the identifier - it works like a charm - here is what I have in case someone needs to do the same.

Component

public function init()
{

	if( !Auth::check() ){
		return;
	}
	
        $this->account      =  Auth::getAccount() ;
	$this->user         =  $this->getUser() ;

	$this->loadUploader();
}

public function getUser()
{
	return Input('user') ? $this->account
			->users()
			->where ( User::getTableName() .'.'. 'code' , '=' , ( int ) Input('user') )
			->first() 
			: null ;
}
public function loadUploader () 
{
	if ( $this->user )
	{

		$component = $this->addComponent(
			'Responsiv\Uploader\Components\FileUploader',
			'fileUploader',
			[
				'deferredBinding'   => false, 
				'fileTypes'         => ".jpg, .jpeg, .png, .pdf, .txt, .doc, .xls, .xlsx, .docx, .csv",
			]
		);
		$component->bindModel('attachments', $this->user );
	}
}
    // Loads a modal with the uploader
public function onGetAttachmentsModal ()
{

	$this->pageCycle();

	return [
		'#attachments-modal' => $this->renderPartial('@attachments', [
			'user'   =>  $this->user,

		])
	];
}

Partial

<div class="row">
	<div class="col-sm-12">
		{{ form_open({ files:  true , model : user  }) }}
			<input type="hidden" name="user" value="{{user.code}}">
			{% component 'fileUploader'  %}
		{{ form_close() }}
	</div>
</div>

[daftspunk]

Much success!

[daftspunk]

You must load it via the page or the layout, that is so the life cycle knows to look for the upload postback. Partials are not able to do this unfortunately.

https://octobercms.com/docs/cms/partials#life-cycle-limitations