in line edit table.....

[lcollong]

Hi,

I know it is a sensitive subject !

I really need a way to make list view quickly editable the Excell way (or phpmyadmin). ie click on a cell, change a value and the DB row would be updated as soon as the mouse leave the cell (without popup or further click).

Is there any plan to address this need from within Fabrik ? I'm aware of the inline edit plugin but it has been said no longer supported and lack to do quick and easy fast cells updates.

I know the difficulty to deal with the raw/rendered value which involves to load the FModel. But, in my case, being able to edit the raw value just like phpmadmin does would be enough.

I'm thinking of using such a tool (http://www.editablegrid.net/en/ ) to build dedicated page to deal with specific tables being grid editables (outside Fabrik but inside Joomla). Thus I will have a mix of Fabrik's list, view and all others possibilities and these editablegrids.

Did someone already do something like that ? Any advices or thoughts about this approach ?

Thx,

Laurent

 

[cheesegrits]

Have you tried the inline edit plugin? While I'm not investing any effort in it, it is still provided "as is", and either works for your use case or doesn't.

-- hugh

 

[lcollong]

Hi Hugh,

As I said, I know the inline edit plugin. As far as I know, it works only with a popup. So you have to click on the cell, move the mouse to the field in the popup, fill in the field, click on ok in the popup and then click on the next cell to change. The "tab" feature does not work on my test drive. This is fair and good to have.

In this particular case, there are a lot of figures to change/fill. The way phpmyadmin or the editablegrid interacts allow to work faster with more comfort (UX). As an example, phpmyadmin allows to double-click any cell displayed as a result of a "select * from mytable", change the value in that place and that's it. As far as you click elsewhere, including the next cell you want to change, it submit the new value, update the table and display back the new value in the cell. It's very efficient (like Excell) when you have a lot of change to make in a grid. Very few click, no need to "find" the popup, immediate feedback. In some particular situations it's a real advantage.

http://www.editablegrid.net/en/ sounds efficient for this purpose but it might exist a better solution ?.... using the "contenteditable" html tags (http://html5doctor.com/the-contenteditable-attribute/ ) inside the current Fabrik plugin in place of the popup ?

 

[skyrun]

lcollong, after trying the unsupported inline edit, we found that it is not very difficult to accomplish this within a custom template (easy for me to say, my developer does all the work). we access the fabrik datamodel and then display it and add .js and .css to accomplish this. the fabrik custom template capability is often overlooked.

then any list we want to be editiable, we assign the layout to our custom template which we call 'bootstrap-checklist' (named for it's legacy first use-case in a checklist list).

this template makes elements editable in different ways, some that are specific to our use-case:

• Y/N are rendered as a big (for phone use) checkbox that the user can check and uncheck.
• Radio button lists (like the priority column) cycle through the choices when you click on them.
• Other fields like Database joins, dropdowns, dates and fields display like they would in a form (assigned to opens a dropdown, datepicker shows the caln, etc). data is modified immediately when changed.
• NOTE THAT NOT ALL element types are handled... just the most common ones.

View attachment 17303
there are also options for 'strikethrough' based on the y/n field which you see above that worked for us on the checklist.

our users like editing a list inline so much we use this on most of the lists we display now.

another template we use is called bootstrap-checklist-databtables. it takes all of the data from all of the data on a list and formats it using datatables.js libraries. datatables.js sounds like it could be similar to the tools you mention above. this template also still allows inline editing in the datatables contruct. using datatables allows us to sort multi-page data more clearly (and instantly/not requiring more data to be loaded). it also allows the use of 'calc' elements in the filtered/sorted columns which is another 'sensitive subject' ;-) we find ourselves using 'calc' elements more and more often in our designs to provide 'richer' column data (for example that combines elements with other elements on this form or on other tables). calc is a very useful element but has the limitation of not allowing filtering and sorting in a list... so this is a workaround for that allowing us to use calc for freely.

here's a screenshot of that (had to make it very small to see the top and bottom of the datatables):
obviously, don't use this on lists with 1,000's of rows... but works well with <100 or even 200 rows.

we use fabrik filters to do the first level of filtering, then the user can use datatables to full-text-search the whole table in their 'search' box. our users also like the datatables pdf/excel/csv/print options which seem to work very reliably.
View attachment 17304

i will provide it for you AS-IS, but it's hardcoded/hacked to meet our needs vs. being generally useful in every situation. but may be a good starting point for you as an overall approach.

our developer warns that these templates probably use libraries that you will need to install (like datatables.js) and that there may be customizations in files like /templates/js/theme.js and custom.css also.

writing code for our own use is very different than writing production-ready code like hugh has to do... so you will find this is... rough.... remember... AS-IS an an example. this isn't something you will be able to install and use. (i purposely don't say where to put these .zipped templates because i figure that people that don't know where probably wouldn't be able to use them without help anyway.)

we need all this documented anyway, so i will ask him to write a readme over the next few weeks that may help you figure out what we've attached here. hope it helps you use fabrik as productively as we have been for over 10 years now.

 

[lcollong]

Thanks a lot skyrun (Barry ?). Your very complete explanations sounds promising as it could help me save a lot of time figuring out how to do. Indeed I'm using customized templates of most on my projects. Although they are only marginally modified in my cases (mostly design).
I really appreciate you've shared these two template and will dig down these next days to see how much I could adapt them to my needs. I perfectly understand that they have been developed for your owns needs and will require adaptations/rewrite to meet mines. I'll be back to you to tell if I've been able to use these works either as a starting point or even an almost turn-key ready solution !
Again, thanks for sharing.

Laurent