Hey everyone! Thank you Johnny for this amazing GroceryCrud!
I would like to share an extension to the library, I attached the file named Grocery_CRUD_mod.php. Please be aware I am still using library 1.6.1, and do not know how it would transfer to other versions or the latest version 1.6.3.
This extension allows for rendering a completely custom form when clicking on your add_action button. It works by adding a custom state and then you can route the add_action url to that state, and have a validation url function and a final database insert/update/etc url function to the state. You can also add a callback function to the add_state that will pass additional data to the form before rendering it.
my_controller:
public function update_validate($pri_key=null) { $post_data = $this->input->post(); $validation_result = (object)array('success'=>false); $validation_result->error_message = "yo yo error msg"; $validation_result->success_message = "yo yo success msg <br /><br /><br />"; $validation_result->error_fields = array('field1' => 'field1 error', 'field2' => 'field2 error'); echo json_encode($validation_result); die(); } public function additional_data($primary_key) { $output = array(); $output['query_results'] = $this->db->query('SOME QUERY')->result_array(); $output['another_variable'] = "additional data here"; return $output; } public function table() { $crud = new grocery_CRUD_mod(); $crud->set_crud_url_path(site_url(strtolower(__CLASS__."/".__FUNCTION__)),site_url(strtolower(__CLASS__."/table"))); // make sure the state_name 'custom_edit' and the url for the add_action are the same 'my_controller/table/custom_edit' $crud->add_state('custom_edit', 'custom_edit_form.php', 'update_validate', NULL, array($this, 'additional_data')); $crud->add_action('My Custom Edit', '', 'my_controller/table/custom_edit', 'ui-icon-plus custom-action'); // custom-action css class is for modal dialog box $crud->set_table('table'); $crud->columns('col1', 'col2', 'col3'); $output = $crud->render(); $this->load->view('my_view.php', $output); }
custom_edit_form.php:
(I am using flexigrid theme. This file does have to be in assets/grocery_crud/themes/'theme you are using'/views/)
<?php $this->set_css($this->default_theme_path.'/flexigrid/css/flexigrid.css'); $this->set_js_lib($this->default_javascript_path.'/jquery_plugins/jquery.form.min.js'); $this->set_js_config($this->default_theme_path.'/flexigrid/js/flexigrid-edit.js'); $this->set_js_lib($this->default_javascript_path.'/jquery_plugins/jquery.noty.js'); $this->set_js_lib($this->default_javascript_path.'/jquery_plugins/config/jquery.noty.config.js'); ?> <div class="flexigrid crud-form" style='width: 100%;' data-unique-hash="<?php echo $unique_hash; ?>"> <div class="mDiv"> <div class="ftitle"> <div class='ftitle-left'> <?php echo $this->l('form_edit'); ?> <?php echo $subject?> </div> <div class='clear'></div> </div> <div title="<?php echo $this->l('minimize_maximize');?>" class="ptogtitle"> <span></span> </div> </div> <div id='main-table-box'> <div class='form-div'> <?php echo form_open( 'my_controller/update_validate/'.$primary_key, 'method="post" id="crudForm" enctype="multipart/form-data"'); ?> my custom form! Some of my additional vars from additional_data function callback <?php echo $additional_data['another_variable']; ?> <?php if ($is_ajax) { ?><input type="hidden" name="is_ajax" value="true" /><?php }?> <div id='report-error' class='report-div error'></div> <div id='report-success' class='report-div success'></div> </div> <div class="pDiv"> <div class='form-button-box'> <input id="form-button-save" type='submit' value='<?php echo $this->l('form_update_changes'); ?>' class="btn btn-large"/> </div> <?php if(!$this->unset_back_to_list) { ?> <div class='form-button-box'> <input type='button' value='<?php echo $this->l('form_update_and_go_back'); ?>' id="save-and-go-back-button" class="btn btn-large"/> </div> <div class='form-button-box'> <input type='button' value='<?php echo $this->l('form_cancel'); ?>' class="btn btn-large" id="cancel-button" /> </div> <?php } ?> <div class='form-button-box'> <div class='small-loading' id='FormLoading'><?php echo $this->l('form_update_loading'); ?></div> </div> <div class='clear'></div> </div> <?php echo form_close(); ?> </div> </div> <script type="text/javascript"> var validation_url = '<?php $my_controller_pos = strpos($list_url, 'my_controller'); $my_controller_len = strlen('my_controller'); $base_path = substr($list_url, 0, ($my_controller_pos + $my_controller_len)); echo $base_path . '/update_validate/' . $primary_key; ?>'; var list_url = '<?php echo $list_url?>'; var message_alert_edit_form = "<?php echo $this->l('alert_edit_form')?>"; var message_update_error = "<?php echo $this->l('update_error')?>"; </script>
The js validation_url variable needs to be taken from the php variables and passed to the view, that is a future improvement.
Also the 'custom-action' css class is for rendering a modal dialog box. I am not sure how to properly 'extend' to not modify the javascript files, but if you need the modal dialog box to pop up for your custom actions
in assets/grocery_crud/js/common/list.js these changes have to be made:
From:
$('.edit_button,.add_button').unbind('click'); $('.edit_button,.add_button').click(function(){
To:
$('.edit_button,.add_button,.custom-action').unbind('click'); $('.edit_button,.add_button,.custom-action').click(function(){
I hope this helps, and please give me feedback if possible.