[Stratos Provatopoulos]

Hello everybody,

 

So I am super excited about this library but I was really disappointed that it couldn't handle extra fields in n_n relations.

I decided to program this functionality and now I am sharing the results with you.

 

In order to use the extra fields functinality you need to pass one extra parameter to the set_relation_n_n function indicating that you want to edit the extra fields 

 

$crud->set_relation_n_n('actors', 'film_actor', 'actors', 'film_id', 'actor_id', 'name',null, null, TRUE);
 

 

 

You can also indicate that you don't want to edit one of the extra fields of the relation table by using the unset_edit_fields. You will however be required to prepend the name of the field you wish to exclude, with the string extra_field in order to avoid name conflicts

 

$crud->unset_edit_fields(array('extra_field_{relation_table_field_name}'));
 

 

 ie 

 

$crud->unset_edit_fields(array('extra_field_salary'))
 

 

 

By using the extra option a dropdown box will appear in your edit form that is populated from the selection_table (actors in the site example).

Each time you select one of the values in the dropdown a new tab will appear underneath that contans all the extra fields that are dynamically queried from the relation_table. If the tab already exists it makes that tab active.

The data types work as well but only for int, text, boolean, set, enum, date and datetime. No upload file (although I wanted to it proved hard and I am kinda tired for now) and no relations. 

I believe that if there are extra 1-n or n-n relations in the relation table it deserves to get a separate editing enviroment plus the complexity was simply too much for me.

 

That is pretty much it 

 

I am documenting the changes so if anyone is interested please check out my code

 

\assets\grocery_crud\themes\datatables\js\datatables-add.js

In the clear form I needed to trigger the change event of the <select> element

IMPORTANT! The changes currently work ONLY with the datatables theme. It shouldn't be hard however to make it happen for other themes as well

 

\assets\grocery_crud\js\jquery_plugins\config\jquery.tab.config.js

New file to handle the client-side tab initialization functionality 

 

\assets\grocery_crud\js\jquery_plugins\ui\jquery-ui-1.9.2.custom.min.js

I needed to add the tabs widget to the jQuery UI custom build. 

 

\assets\grocery_crud\css\ui\simple\jquery-ui-1.9.0.custom.min.css

Added a few classes for the tabs

 

\application\libraries\grocery_crud.php

Lots and lots of changes to support the new functionality. The changes (hopefully) will not interfere with the rest of the code

Most of the additions where here and some of the new lines of code are kind of ugly to read. If anyone is interested, this file could use some refactoring although I think that it should be done by someone who really understands and knows the rest of the code in order to make full use of it 

 

\application\models\grocery_crud_model.php

Added a couple of functions and modified the function that saved n_n relations and their data

 

\assets\grocery_crud\js\jquery_plugins\config\jquery.tine_mce.config.js

I had to put the config file in global scope in order to call it later on from my code. (There should be a better way to do this)

IMPORTANT! The changes currently work ONLY with tinymce. It should be refactored to work with any editor or at least not die.

 

\assets\grocery_crud\css\jquery_plugins\uniform\uniform.default.css

I had a strange bug where some of the uniform radio buttons got a display:none so this is pretty much a lousy hack to prevent this by doing .radio{display:inline-block !important}

[davidoster]

Hello Stratos. Please allow some time to inspect your findings and let you know about the results.

I would suggest you make a pull request, if you are familiar with github, from here https://github.com/scoumbourdis/grocery-crud/pulls

 

Thanks again for your post!

[dimazarno]

Hi Stratoe, i'm trying to use your tabs, but still no luck. I believe it will be a great component, since i always hack for adding extra fields, and its make my code look dirty. Can you explain more how to configure your tabs?

 

Thanks.

[Stratos Provatopoulos]

Hi dimazarno!

What kind of problem are you experiencing?

To setup this mod:

1. Download the tabs.zip and replace the original grocery files with the ones in the zip. 
   In the first post of this thread I list the path for each file where you should paste the file
    
2. Use the extra functionality like this 

   $crud->set_relation_n_n('actors', 'film_actor', 'actors', 'film_id', 'actor_id', 'name',null, null, TRUE);

   
   That's pretty much it

[davidoster]

Hello [member=Stratos Provatopoulos].

I had a quick look on your proposal.

If you can, it would be better to follow the guidelines on how we structure an extension for Grocery CRUD.

By doing this, you help everybody to use the functionality you propose, even with the future versions of Grocery CRUD.

We try to avoid the direct changes of the library itself.

 

So, when we post an extension/update, within the zip file (or via github), a) we honour the folder structure e.g.

 

assets\grocery_crud\js\your_file

 

and we try to use this suggestion that is endorsed by the creator of the library [member=web-johnny], as the proper way of extending the functionality of Grocery CRUD.

 

Thank you for your contribution. If you make the above recommended changes we will have a look at your code.

[ludwigbernard]

Hi Stratos, I've been trying to make it work by following your instructions, but I got some errors like: 

"Uncaught ReferenceError: jQuery is not defined

Uncaught ReferenceError: $ is not defined"

I think that it could be because of my GC version. Which was yours?

I'll be searching for the solution, but I'll really appreciate your help. Thanx!

[Stratos Provatopoulos]

Hello ludwigbernard

 

My GC version is 1.3.

The error that you are getting is that there is no jQuery so you can simply include it yourself in the header of your file.

 

I am sorry that I have yet to submit my code as a proper extension, but I have been really swamped and I don't think that I will be able to in the foreseeable future

[Victacora]

Hi Stratos Provatopulos,  i need that you give me a solution for this problem please,  i´m using your library for assigning several roles to one functionary. for the moment this show me the information that i insert manually to database but it not insert and not update, it is always loading and never finish. bottom i give you some pictures. how can i debug the problem?

 

 

 

 

 

[Stratos Provatopoulos]

Hello Victacora

 

Can you tell me what is the output of the chrome console?

 

1. Right click and press inspect element before you press update/insert 

2. Go to the Network tab
3. Press update or insert. (don't press update and go back to list or insert and go back to list)

4. In the Network tab, there should be an new entry, since the update is done via AJAX, like this youdormain.com/your_controler/update/id

 

can you please tell me what is the output of AJAX call?

[Victacora]

Hi Stratos Provatopulos, here is the image that i get from chrome console, i dont understand the part where appear update_validation? this  function i have not implemented. i wait for you answer, thank you.

[Stratos Provatopoulos]

Update validation always runs whether you have implemented or not. Usually if you haven't set any rules you just get success:true.

But since I don't since the other ajax call that actually implements the update I am guessing that something is wrong.

 

If you click on that entry a new panel should appear on the right. I actually wanted that output.. sorry I forgot to mention it

[Victacora]

of course, this show me a new tab when i click in the option, and it show me the information of database. but it never update or insert on the database.

[Stratos Provatopoulos]

No I meant in the network tab, if you click on the update_validation ajax call, the one you showed me in your previous post, you should see the raw output of the server. Can you please attach a screenshot with this information

[Victacora]

ok, here is the output from chrome console http://politecnicodesistemaseidiomas.com/Output and addition here show me this error when i add new role to functionary this show me the new tab but appear this error  Uncaught ReferenceError: tinymce_options is not defined.HOWEVER works well. thanks again 

Stratos Provatopoulos

[Stratos Provatopoulos]

Am I also going to need the response of the ajax call not just the header.

Now for the second error. Are you using tiny_mce on your theme? I am afraid that for the time being my solution works only with tinyMce

[Victacora]

the problem is that it only show me this: Disallowed Key Characters. headers is the only option that show me something. the others tabs show me the sames words... but when i click in the http://localhost:8080/AGLV2/index.php/admin_controller/managementFunctionary/update_validation/1

this open a new tab in the google chrome and show me: {"success":true}.

 

i find this http://www.diegodicamillo.com.ar/blog/2009/09/28/disallowed-key-characters-codeigniter/ about Disallowed Key Characters.

and the result to modify was this:the Disallowed Key Characters.{primary_key_value}<- in this expression is the error.i hope that it can be of any use. thank you again...I will continue to trying again.

[Stratos Provatopoulos]

OK now I am starting to understand.

The problem is at the addTab function located at jquery.tab.config.js.

 

This function is supposed to replace the string "{primary_key_value}" with the value of the option that you select from the dropdown (in your example the dropdown is the input which says Seleccione Cargos). The select input is populated with the contents of the table that you are linking to (in you example Cargo).

 

My first question is whether that table (Cargo) has a primary key which is set to auto_increment

 

If you have set a primary key on that table, then I would like you to see if there are any javascript errors in the console that stop the execution of javascript. You should also check that the correct javascript files are linked from their respective paths.

 

 

If there aren't any javascript errors and the correct files are loaded, then I want you to go to the jquery.tab.config.js file which is located at \assets\grocery_crud\js\jquery_plugins\config\jquery.tab.config.js, go to line 12 and change the code from 

tabContentTemplate = $('#'+field+"Template").html(),
tabContentHtml = tabContentTemplate.replace( /\{primary_key_value\}/g, value )

to

tabContentTemplate = $('#'+field+"Template").html(),
alert(tabContentTemplate);
alert(value);
tabContentHtml = tabContentTemplate.replace( /\{primary_key_value\}/g, value )
alert(tabContentHtml); 

Execute your example and please reply with the contents of the alertbox.

[Victacora]

yes, my table has a key autoincrement CAR_ID. I send you the html that was generate when I click on edit button in a row on the table http://politecnicodesistemaseidiomas.com/output_html. This works perfectly and show me the information and I can edit the field but when I click on update button or insert this was send all, the fields that I modified and the template that you use to generate the form to fill the fields extra on the edit form  or insert form. where can i put a condition to obviate this?, thanks :).

this is the image result for you test. http://politecnicodesistemaseidiomas.com/output_test.jpg and the javascripts errors was solved changing my text editor for tinymce and put  the uniform.js reference on the scripts

[Stratos Provatopoulos]

I am afraid that I am having trouble understanding you.

If I understand correctly the problem is now solved and you can insert/update/normally.

But you want to obviate something... What exactly do you want to obviate?

[Victacora]

no the problem is the same, sorry but my pooor english. this was send all, the fields with information that i insert  and the fields with {primary_key_value} and this generate the error that exit on the server. i wanna obviate this part on the form values {primary_key_value}