More control over fields in Editor template

CuskitLimited

Is there any way to get more control over how individual fields are rendered within a custom editor template.

I know I can extend $.fn.dataTable.Editor.classes to change the classes on all of the fields but I can't see anything to override these on a field level.

Potentially by doing something like the following:
<editor-field name="field1" label-class="col-lg-2" input-class="col-lg-10" ></editor-field>

Is anything like this possible?

allan

Hi,

To an extent yes you can. If you have a look in the editor.bootstrap4.js file you'll find that it sets a number of class names for the form elements on the $.fn.dataTable.Editor.classes object. You could modify the classes there, or extend the defaults in your own file with the values you need.

Allan

CuskitLimited

Hi Allan,

I'm aware of being able to set the classnames in $.fn.dataTable.Editor.classes object, my issue is that I can only set it once for the whole form.
I want to set the classes differently for different fields in the same form.

So in my form different rows will ideally have different number of inputs but I want everything to align neatly.

I've made an example that shows the kind of thing the template is giving me versus what I'm trying to achieve https://jsfiddle.net/fuzzyexponent/hqydcw3v/

allan

I see what you mean - thanks. At the moment what you'd need to do is call field().node() which will give you the container node for the field after initialisation and you can manipualte its classes there (i.e. remove the columns you don't want and then add the ones you want in).

Being able to define classes per field could be useful, I can see that in this case.

Allan

CuskitLimited

I've managed to get what I need working now and figured I'd post what I did in the hope it can be included in a future version.

In dataTables.editor.js, I've added classes = $.extend({}, classes, opts.classes); to the Editor.Field function.

Essentially this gives a new fields.classes option that overrides the defaults from $.fn.dataTable.Editor.classes.field

allan

That's a good idea - I like that. Thanks!

Allan