Cakephp master/details add

Question

I have two tables, has-many relationship, in the master add.ctp, allow user to upload 0~5 files(file path information are stored in details table)

I want to dynamically display attachment(detail) form in the master/add.ctp

1, user choose number of files want to upload from dropdown list,

echo $this->Form->input('attachments', array( 'options' => array(1, 2, 3, 4, 5),'empty' => '(choose one)', 'onchange' => 'showNumber(this.value)'));

then forloop

{
        echo $this->Form->input('attachment_path', array('type'=>'file','label' =>'Attachment, Maximum size: 10M'));    
}

//but I don't know how to capture this.value, I know Javascript can not pass value to php.

or user click 'add another attachment' link, then detail form shows up.

How to achieve this function, any help would be appreciated.

I have read this article: Assign Javascript variable to PHP with AJAX and get same error: the variable is undefined

Edit: http://cakephp.1045679.n5.nabble.com/Adding-fields-to-a-form-dynamically-a-complex-case-td3386365.html

'For each field use a default name with [] at the end (which will make it stack like a array) example: data[][book_id] after the fields have been submitted'

Where should I place the []?

elboletaire elboletaire · Accepted Answer · 2012-09-24T09:46:26

I think you should use Ajax for this.

Simply create an ajax call on select.change() and then a method in the controller that returns the necessary info.

You can return an array of data using echo json_encode(array('key' => 'value')) directly on your controller (or better in a custom view) and access it with Javascript:

success: function(data) {
     alert(data.key);
}

Edit...

In your javascript use something like...

$('select').change(function(e) {
    var select = $(this);
    $.ajax({
        type: "POST",
        dataType: "json",
        url: "/attachments/youraction",
        data: { data: { id: select.find(":selected").val() } },
        success: function(data) {
            for (i in data) {
                var input = $('<input>', {type: "file", label: data[i].Attachment.label})
                $('form.your-form').append(input);
            }
        }
    })
});

Then in "Yourcontroller" create "youraction" method:

<?php
class AttachmentsController extends AppController
{
    public function youraction()
    {
        if (!$this->RequestHandler->isAjax() || !$this->RequestHandler->isPost() || empty($this->data['id']))
        {
            $this->cakeError('404');
        }

        // Do your logic with $this->data['id'] as the select value...
        $data = $this->Attachment->find('all', array('conditions' => array('id' => $this->data['id'])));
        // ....


        // then output it...
        echo json_encode($data);

        // This should be done creating a view, for example one named "json" where you can have there the above echo json_encode($data);
        // Then..
        // $this->set(compact('data'));
        // $this->render('json');
    }
}

It's more clear now?? If you have doubts about ajax + cakephp you should do a search on the web, where you will find a lot of tutorials.

Cakephp master/details add

2 Answers