Search code examples
cakephpajaxformcakephp-2.4.7

Cakephp ajax form won't load the right view


I'm just trying to call a function from a form submision (which is also call from ajax).

I want to call the add method but it's the index which always called.

My ajax view with the ajax submission form :

<?php $count = count($files); ?>
<div id="message"></div>
<i><?= __('Nombre de fichiers liés : ') . $count ?></i>
<?= $this->Form->create('FilesManager', array('enctype' => 'multipart/form-data', 'url' => array('action' => 'add'))); ?>
<?= $this->Form->input('file', array('type' => 'file', 'label' => false, 'class' => 'form-control')); ?>
<?= $this->Js->submit('Envoyer', array('update' => '#message', 'div' => false, 'type' => 'json', 'async' => false)); ?>
<?= $this->Js->writeBuffer(); ?>

i've also tried :

<?= $this->Form->create(null, array('enctype' => 'multipart/form-data', 'url' => array('controller' => 'FilesManagers', 'action' => 'add'))); ?>

<?= $this->Form->create('FilesManager/add', array('enctype' => 'multipart/form-data')); ?>

EDIT

$this->Form->create('FilesManager', array('action' => 'add'))

Don't work for me but the form generated look like :

<form action="/agralis/files_managers/add" enctype="multipart/form-data" id="FilesManagerIndexForm" method="post" accept-charset="utf-8">...<input id="submit-838644811" type="submit" value="Envoyer"><script type="text/javascript">
//<![CDATA[
$("#submit-838644811").bind("click", function (event) {$.ajax({async:false, data:$("#submit-838644811").closest("form").serialize(), dataType:"html", success:function (data, textStatus) {$("#message").html(data);}, type:"post", url:"\/agralis\/FilesManagers"});
return false;});
//]]>
</script></form>

I can see that form action look good (when i copy/paste the action in the browser url he found the method) but the url called from the ajax submit button is wrong ! How can I change that ?


Solution

  • The helpers are working independently

    The Js helper is not aware of the Form helper, they don't interact with each other, and so the form URL is unknown to the Js helper.

    The solution for that problem is rather simple, just look at the docs:

    http://book.cakephp.org/2.0/en/core-libraries/helpers/js.html#JsHelper::submit

    The submit() method accepts a url option where you can specify a URL in case the default one that is based on the current request doesn't fit you.

    $this->Js->submit('Envoyer', array(
        'url' => array('action' => 'add')
        // ...
    ));
    

    File uploads are not supported

    The next problem that you'll encounter is that the file upload doesn't work. That's not part of the question, but I'll broach the subject.

    The Js helper doesn't support generating the required JavaScript to handle file uploads, it would need to make use of the XMLHttpRequest Level 2 (xhr2) functionalities that older browsers are lacking.

    You'll have to write custom JavaScript to handle that. Explanations and tutorials regarding that can be found all over the web.