dimanche 1 mars 2015

Zend form - ajax action to populate

in my Document controller I have action Detail with really huge functionality. It also shows table with costs, which belong to that document. On every row of this table i have icon to edit and delete this cost. If user clicks on edit icon of selected cost, the edit form will show in twitter bootstrap modal. I have a ajax js function which gets data atribut with cost id from edit link and send it to document controller (detail action). Then controller gets right data from model by cost id and data send back as json to my ajax function. In success ajax function will set (by jquery) edit form elements with right data. But is there any zend like way to populate the form with data from controller then by jquery.val() as I do it now?...I mean if I can use zend form populate in controller? Thx Controller (document/detail):



public function detailAction() {
$id = $this->_getParam("id", 0); //document id
$document = new Application_Model_DbTable_Document();
$doc = $document->findById($id);
//..and some another models and controller's work

$this->view->headScript()->appendFile($this->view->baseUrl('/js/document-edit_cost.js'));

$form_edit_cost = new Application_Form_EditCosts();

//in this section, how to make it working with $form_edit_cost->populate()
if ($this->_request->isXmlHttpRequest()) {
if ($this->getRequest()->isPost()) {
$formData = $this->getRequest()->getPost();
if ($formData["action"] == "edit_cost") {
$costs = new Application_Model_DbTable_Costs();
$this->_helper->json($costs->find($formData["id"]));

//just test data
//$data = array( 'edit_cost_name' => 'Mickey', 'edit_cost_price' => '998', '$edit_cost_date' => '09.02.2015' );
//this will not show data in form
//$form_edit_costs->populate($data)
//$this->view->form_edit_costs = $form_edit_costs;
}
}
}
else{
$this->view->form_edit_cost = $form_edit_cost;
}
}


ajax (document-edit_cost.js)



$(".edit-cost-link").click(function () {
var myData = {action:'edit_cost',id: $(this).data('costid')};

$.ajax(
{
url: location.href,
type: "POST",
context: document.ajax,
data: myData,
dataType: "html",
success: function (received_data)
{
var json = JSON.parse(received_data);
console.log("data:"+received_data);
console.log("json:"+json);

$('#edit_cost_date').val(json[0]['date']);
$('#edit_cost_price').val(json[0]['price']);
$('#edit_cost_name').val(json[0]['name']);

$('#editCostModal').modal('show');
},
error: function () {
console.log('error');
$('.cost-db-error').append("<div class='row'><div class='col-xs-12 col-sm-12 col-md-12 col-lg-12'><div class='alert alert-danger' role='alert'><p><span class='font-size-13'><strong>Error</strong></span> &nbsp;&nbsp;&nbsp;&nbsp;Something wrong with ajax</p></div></div></div>")
}
});
return false;
});


view (detail)



//here I call modal
<a href="" data-target="#editCostModal" data-toggle="modal" class="edit-cost-link" data-costid="<?php print $cost->id ?>" ><i class="fa fa-pencil fa-fw"></i></a>
....
//modal with form
<div class="modal fade" id="editCostModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header text-center">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h3 class="center-block">Úprava výdaje</h3>
</div>
<div class="modal-body">
<?php require_once APPLICATION_PATH . '/library/printFormElement.php'; ?>
<?php
$form_edit_costs = $this->form_edit_costs;
?>
<?php echo $form_edit_costs->renderForm(false); ?>
<fieldset>
<div class="cost-db-error"></div>
<div class="row">
<div class="form-group col-xs-12 col-sm-12 col-md-6 col-lg-6">
<?php printFormElement($form_edit_costs->edit_cost_date); ?>
</div>
<div class="form-group col-xs-12 col-sm-12 col-md-6 col-lg-6">
<?php printFormElement($form_edit_costs->edit_cost_price); ?>
</div>
</div>
<div class="row">
<div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
<?php printFormElement($form_edit_costs->edit_cost_name); ?>
</div>
</div>
<hr />

<div class="row">
<div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">

<div class="pull-right">
<?php print $form_edit_costs->edit_cost_submit->renderViewHelper() ?>
<a href="#" data-dismiss="modal" aria-hidden="true" type="button" class="btn btn-danger">Zrušit</a>
</div>
<p class="text-muted pull-left"><small>Prvky označené znakem * jsou povinné.</small></p>
</div>
</div>
</fieldset>
</form>
</div>
</div>
</div>
</div>
....


form



class Application_Form_EditCost extends Zend_Form {
public function init() {
$this->setMethod('post');

$edit_cost_name = new Zend_Form_Element_Text('edit_cost_name');
$edit_cost_name->addValidator('stringLength', false, array(3, 255));
$edit_cost_name->setRequired(true);
$edit_cost_name->class = 'form-control';
$edit_cost_name->setLabel('* Název:');
$edit_cost_name->setAttrib('placeholder', 'název/popis výdaje');

//another form elements

$this->addElements(array(
$edit_cost_date,
$edit_cost_name,
$edit_cost_price
));
$this->addElement('button', 'edit_cost_submit', array(
'ignore' => true,
'label' => 'Vložit',
'id' => 'send',
'onclick' => 'return submitForm();',
'class' => 'btn btn-success'
));
}
}

Aucun commentaire:

Enregistrer un commentaire