Difference between revisions of "WebDev"
Jump to navigation
Jump to search
| Line 1: | Line 1: | ||
<br /> | <br /> | ||
| − | == DataTable == | + | ==DataTable== |
| − | === WordWrap specific column of the table === | + | ===WordWrap specific column of the table=== |
| − | * first add a class to the target column | + | *first add a class to the target column |
<syntaxhighlight lang="javascript+myghty"> | <syntaxhighlight lang="javascript+myghty"> | ||
$('#example').dataTable( { | $('#example').dataTable( { | ||
| Line 14: | Line 14: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | * Then add css to customize column | + | *Then add css to customize column |
<syntaxhighlight lang="css"> | <syntaxhighlight lang="css"> | ||
table td.wrapcol { | table td.wrapcol { | ||
| Line 25: | Line 25: | ||
| − | === render very large tables === | + | ===render very large tables=== |
| − | + | * https://www.reddit.com/r/django/comments/3hlhgq/best_way_to_render_large_data_tables_in_django/ | |
| − | + | * https://www.datatables.net/examples/server_side/simple.html | |
| − | == Divers == | + | ==Divers== |
| − | === Dessin download === | + | ===Dessin download=== |
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
<i class="fa fa-download"> | <i class="fa fa-download"> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | == CSS == | + | ==CSS== |
| − | === Hide elements === | + | ===Hide elements=== |
<syntaxhighlight lang="css"> | <syntaxhighlight lang="css"> | ||
#ref{ | #ref{ | ||
| Line 47: | Line 47: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | == Javascript == | + | ==Javascript== |
<br /> | <br /> | ||
| − | === Link directly to specific boostrap tab === | + | ===Link directly to specific boostrap tab=== |
<br /><syntaxhighlight lang="javascript"> | <br /><syntaxhighlight lang="javascript"> | ||
// Javascript to enable link to tab | // Javascript to enable link to tab | ||
Latest revision as of 19:50, 28 July 2019
DataTable
WordWrap specific column of the table
- first add a class to the target column
$('#example').dataTable( {
"columnDefs": [
{ className: "wrapcol", "targets": [ 1 ] }
]
} );
- Then add css to customize column
table td.wrapcol {
word-break: break-all;
word-wrap: break-word;
width: auto;
}
render very large tables
- https://www.reddit.com/r/django/comments/3hlhgq/best_way_to_render_large_data_tables_in_django/
- https://www.datatables.net/examples/server_side/simple.html
Divers
Dessin download
<i class="fa fa-download">
CSS
Hide elements
#ref{
display: none;
}
Javascript
Link directly to specific boostrap tab
// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href="#' + url.split('#')[1] + '"]').tab('show');
}
// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
window.location.hash = e.target.hash;
})