How to include javascript library in javascript file?

Watchara

//cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment.min.js
//code.jquery.com/jquery-1.12.0.min.js
https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js
https://cdn.datatables.net/buttons/1.1.2/js/dataTables.buttons.min.js
https://cdn.datatables.net/select/1.1.2/js/dataTables.select.min.js
../../extensions/Editor/js/dataTables.editor.min.js

var editor; // use a global for the submit and return data rendering in the examples

$(document).ready(function () {
    editor = new $.fn.dataTable.Editor({
        ajax: '/Brand/DataHandler',
        table: '#datatab',
        fields: [{
            label: 'BrandName:',
            name: 'BrandName'
        }, {
            label: 'CreateBy:',
            name: 'CreateBy'
        },{
            label: 'UpdateBy:',
            name: 'UpdateBy'
        },
        {
            label: 'DateCreate:',
            name: 'DateCreate',
            type: 'datetime',
            def: function () { return new Date(); },
            format: 'M/D/YYYY',
            fieldInfo: 'US style m/d/y format'
        }, {
            label: 'DateUpdate:',
            name: 'DateUpdate',
            type: 'datetime',
            def: function () { return new Date(); },
            format: 'dddd D MMMM YYYY',
            fieldInfo: 'Verbose date format'
        }
        ]
    });

    $('#datatab').DataTable({
        dom: 'Bfrtip',
        ajax: '/Brand/DataHandler',
        columns: [
            { data: 'BrandName' },
            { data: 'CreateBy' },
            { data: 'UpdateBy' },
            { data: 'DateCreate' },
            { data: 'DateUpdate' }
        ],
        select: true,
        buttons: [
            { extend: 'create', editor: editor },
            { extend: 'edit', editor: editor },
            { extend: 'remove', editor: editor }
        ]
    });
});

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

allan

Thank you for the code above, however, I'm afraid I don't know what your question is. Could you elaborate on that please? Are you seeing any errors, or is something just not working?

Allan

Watchara

it's not working.

no data render to screen.

how to include javascript library on this file or other file. i dont know.

moment.min.js
jquery-1.12.0.min.js
jquery.dataTables.min.js
dataTables.buttons.min.js
dataTables.select.min.js
dataTables.editor.min.js

i think must be include these library but i don't know how and where?

allan

I would suggest using the download builder if you don't know how to inline CSS and Javascript in your HTML. Aside from that, I would need a link to the page to be able to debug it.

Allan

Watchara

Mr.allan, Could you tell me about the standard of jquery datatables for asp.net mvc

first i've installed jquery.datatables by nuget.

1.controller(.cs file)
2.view(index.cshtml)
3.js file or not?

How many file for create?

allan

I'm afraid the nuget package of DataTables is not managed by myself and I've never actually used it. You would need to as the author of that package if you are having problems with it.

Allan

Watchara

and if I not use nuget package. please describe me.

How many file for create?

1.controller(.cs file)
2.view(index.cshtml)
3.js file or not?

allan

I would suggest you use the download page which will give you the HTML to include in your page.

Allan

Watchara

How slow is it to render record at 10,000 records?

allan

It depends upon your data, server, internet connection, web-browser and host computer. There is no way for me to say. You'd need to try it and see if it is acceptable to you.

I've used 50k records client-side before with acceptable performance.

Allan

Watchara

ok. Mr.Allan

Is it possible to display data in thumbnail instead of table record?

Watchara.

allan

Yes. Have a look at the columns.render documentation for how to show an image. See also the manual page for renderers.

Allan

Watchara

I meant one thumbnail per one record. and if I have 100 records it will be display 100 thumbnails.

and now I used this HTML TAG for display data.

1. * <table class="table table-bordered" id="myTable">
2. *     <thead>
3. *         <tr class="active">
4. *             <th>Name</th>
5. *             <th>LastName</th>
6. *             <th>Gender</th>
7. *             <th>Age</th>
8. *             <th>Address</th>
9. *             <th>Tel</th>
10. *             <th>Post</th>
11. *         </tr>
12. *     </thead>
13. * </table>

How to change to thumbnail display?

Watchara.

allan

Sure - I don't see why you couldn't still use a renderer to create the img tag. The documentation I linked to above gives an example of how to create an img tag in the DataTable.

Watchara

Mr. Allan I'm still couldn't find solution to do gallery thumbnails.

Could you show me example code?

Watchara.

allan

DataTables isn't a grid component like in your image - it is a table library.

In your image it looks like each image is just left floated (or something), which is not how DataTables works, nor can it be made to work that way.

Allan

Watchara

ok.