New object type IMG VIDEO AUDIO

sharkowolf

Dear DataTables Developers, Allan!

I feel pleasure and real buzz more and more understanding the flexibility and power of DataTables mechanisms. Thanks!

I want to prepare 3 types of objects - picture, audio and video, which will be displayed in the table row in the corresponding DIV.

Please tell me
1) How to correctly pass the URL value in the fields block from the database, which corresponds to the object, in order to apply it in the HTML Tag template with the src = "" value.

2) I would like to turn off Label output to use the entire table width for the object. Of course it is possible to break this through CSS, but perhaps there is a better way?

Parsed in detail and ran the example at the link:

https://editor.datatables.net/examples/plug-ins/fieldPlugin.html

With deep respect,
Andrey

allan

Hi Andrey,

1) Do you mean you have an id (or whatever) for the video and you need to output it in the DataTable with a <video> tag? If so, use a renderer for that. I’m not sure how well a DataTable with videos in each row will work from a UX point of view though.

2) Do you mean inside the Editor form? If so, then yes, CSS is how this would be done. See also this example which shows an example of how you can change the CSS.

Allan

sharkowolf

Allan,

Thanks for the answer. I will slightly correct the question on the first point. I have a code as below (from example). In the template of which for the object - the Video tag, I want to set values ​​through the attributes.

_fieldTypes.todo = {
    create: function ( conf ) {
        var that = this;
 
        conf._enabled = true;
 
        // Create the elements to use for the input
        conf._input = $(
            '<div id="'+Editor.safeId( conf.id )+'">'+
        '<video src="/img/123.mp4" width="320" height="240" controls></video>'+
           '</div>');
 
        // Use the fact that we are called in the scope of the Editor instance to call
        // the API method for setting the value when needed
        $('button.inputButton', conf._input).click( function () {
            if ( conf._enabled ) {
                that.set( conf.name, $(this).attr('value') );
            }
 
            return false;
        } );
 
        return conf._input;
    },

something like this:

 fields: [ {
            label:  'quest_img',
            name:   'quest_img',
            type:   'readonly'
                }, {
            label: "",
            name: "done",
            type: "todo", // Using the custom field type
            width: "520",
            height: "320",
            src_def: "default_url"

            def: 0
        }, {
            label:  'quest_enable_img',
            name:   'quest_enable_img',
            type:   'readonly'
                }

The video link itself is stored in the SRC column and the name is passed, which is saved by the typical mechanism when loading the file using this code:

-> upload (Upload :: inst ($ _SERVER ['DOCUMENT_ROOT']. '/ uploadimg / __ ID __.__ EXTN__')

I just want to take this name and substitute it into the SRC, taking into account additional attributes.

{
                       label: '',
                       name: 'quest_video',
                       type: 'upload',
                       display: function ( file_id ) {
                           return '<img src="'+editor_quest.file( 'files', file_id ).web_path+'"/>';
                        },
                       clearText: 'clear',
                       noImageText: 'No'
                }

Only the file itself with my class, not the upload form.

Please tell me how to do it right?

Thanks!

With respect,
Andrey

allan

Hi Audrey,

Thanks for the clarification. The conf parameter that is passed into the plug-in functions is the original object used to define the field. So you could do conf.src_def to access that parameter.

Allan

sharkowolf

Allan,

Thank you. Thanks!

With respect,
Andrew, but not Audrey