Skip to content

irul / opensipkd-base

Go to a project
Commit 8ec0c6d1 by aa.gusti
Options

perbaikan de-table

1 parent 82226365
Inline Side-by-side
Showing 3 changed files with 415 additions and 213 deletions
opensipkd/base/views/routes.py
...@@ -6,7 +6,7 @@ from pyramid.view import view_config ...@@ -6,7 +6,7 @@ from pyramid.view import view_config
from sqlalchemy.orm import aliased from sqlalchemy.orm import aliased
from opensipkd.models import (DBSession, Route, ) from opensipkd.models import (DBSession, Route, )
from . import BaseView, get_urls from . import BaseView, get_urls, widget_os
_logging = logging.getLogger(__name__) _logging = logging.getLogger(__name__)
...@@ -104,6 +104,14 @@ class ListSchema(colander.Schema): ...@@ -104,6 +104,14 @@ class ListSchema(colander.Schema):
searchable=False, searchable=False,
global_search=False, global_search=False,
) )
# created = colander.SchemaNode(
# colander.Date(),
# widget=widget_os.BootStrapDateInputWidget(),
# search_method="equal",
# searchable=True,
# global_search=False,
# )
kode = colander.SchemaNode( kode = colander.SchemaNode(
colander.String(), colander.String(),
searchable=True) searchable=True)
...@@ -159,6 +167,7 @@ class Views(BaseView): ...@@ -159,6 +167,7 @@ class Views(BaseView):
self.form_params = dict(scripts="") self.form_params = dict(scripts="")
self.list_url = 'routes' self.list_url = 'routes'
self.list_route = 'routes' self.list_route = 'routes'
self.filter_columns = True
# self.list_buttons = (btn_view, btn_edit, btn_delete) # self.list_buttons = (btn_view, btn_edit, btn_delete)
self.list_buttons = () self.list_buttons = ()
# self.add_schema = AddSchema # self.add_schema = AddSchema
......
opensipkd/detable/detable.py
...@@ -11,7 +11,6 @@ from deform import field ...@@ -11,7 +11,6 @@ from deform import field
from . import widget from . import widget
# from deform import widget
log = logging.getLogger(__name__) log = logging.getLogger(__name__)
...@@ -119,10 +118,12 @@ class DeTable(field.Field): ...@@ -119,10 +118,12 @@ class DeTable(field.Field):
filter_columns=False, filter_columns=False,
**kw **kw
): ):
# field.Field.__init__(self, schema, **kw)
super().__init__(schema, **kw) super().__init__(schema, **kw)
self.request = kw.get("request") self.request = kw.get("request")
self.rows = kw.get("rows") self.rows = kw.get("rows")
self.action = action
self.tableid = tableid
new_buttons = kw.get("new_buttons") or () new_buttons = kw.get("new_buttons") or ()
params = params and f"?{params}" or "" params = params and f"?{params}" or ""
...@@ -157,6 +158,14 @@ class DeTable(field.Field): ...@@ -157,6 +158,14 @@ class DeTable(field.Field):
buttons = _buttons buttons = _buttons
_buttons = [] _buttons = []
_scripts = [] _scripts = []
if filter_columns:
button = f"""
<a href="#{tableid}-form-filter"
data-toggle="collapse"
class= "btn btn-warning dropdown">Filters</a>
"""
_buttons.append(button)
for button in buttons: for button in buttons:
_buttons.append( _buttons.append(
f"""<button f"""<button
...@@ -189,7 +198,11 @@ class DeTable(field.Field): ...@@ -189,7 +198,11 @@ class DeTable(field.Field):
columns = [] columns = []
headers = [] headers = []
cols2 = [] cols2 = []
filter_form = ""
field_index = 0
for f in schema: for f in schema:
field_index += 1
d = {'data': f.name, 'title': f.title} d = {'data': f.name, 'title': f.title}
data = [] data = []
if hasattr(f, 'width'): if hasattr(f, 'width'):
...@@ -224,10 +237,33 @@ class DeTable(field.Field): ...@@ -224,10 +237,33 @@ class DeTable(field.Field):
if isinstance(f.widget, deform.widget.HiddenWidget): if isinstance(f.widget, deform.widget.HiddenWidget):
d["visible"] = False d["visible"] = False
if isinstance(f.widget, deform.widget.CheckboxWidget): if isinstance(f.widget, deform.widget.CheckboxWidget):
d["checkbox"] = True d.update(self.widget_checkbox(f))
d["check_val"] = [f.widget.true_val, f.widget.false_val]
else: else:
d["checkbox"] = False d["checkbox"] = False
if hasattr(f, "url"):
url = f.url
d["render"] = """
function(data){
let result = "No Data"
if (data != null)
result = '<a href="' + url + data + '" target="_blank">Link</a>&nbsp;';
return result;
}"""
if f.name == "id" and self.action:
d["width"] = "30pt"
d["orderable"] = False
d["className"] = "text-center"
d["visible"] = True
d["render"] = """
function (id) {
return %s;
}
""" % self.action_url(f)
if filter_columns and hasattr(f, "searchable") and getattr(f, "searchable"):
filter_form += self.get_filter_form(f, field_index)
# if type(f.typ) == colander.Integer: # if type(f.typ) == colander.Integer:
# d["field_typ"] = f"int" # d["field_typ"] = f"int"
# elif type(f.typ) == colander.Boolean: # elif type(f.typ) == colander.Boolean:
...@@ -238,13 +274,13 @@ class DeTable(field.Field): ...@@ -238,13 +274,13 @@ class DeTable(field.Field):
# d["field_typ"] = f"str" # d["field_typ"] = f"str"
thousand = hasattr(f, 'thousand') and f.thousand or None thousand = hasattr(f, 'thousand') and f.thousand or None
separator = thousand and "separator" in thousand and thousand[ separator = thousand and "separator" in thousand \
"separator"] or ',' and thousand["separator"] or ','
decimal = thousand and "decimal" in thousand and thousand[ decimal = thousand and "decimal" in thousand and thousand[
"decimal"] or '.' "decimal"] or '.'
point = thousand and "point" in thousand and thousand["point"] or 0 point = thousand and "point" in thousand and thousand["point"] or 0
currency = thousand and "currency" in thousand and thousand[ currency = thousand and "currency" in thousand and \
"currency"] or "" thousand["currency"] or ""
if thousand or isinstance(f.typ, colander.Float) or \ if thousand or isinstance(f.typ, colander.Float) or \
isinstance(f.typ, colander.Integer): isinstance(f.typ, colander.Integer):
d["render"] = \ d["render"] = \
...@@ -252,9 +288,16 @@ class DeTable(field.Field): ...@@ -252,9 +288,16 @@ class DeTable(field.Field):
f"'{decimal}', {point}, '{currency}' )</script>" f"'{decimal}', {point}, '{currency}' )</script>"
if 'className' not in d: if 'className' not in d:
d["className"] = "text-right" d["className"] = "text-right"
columns.append(d) columns.append(d)
headers.append(f.title) headers.append(f.title)
# cols2.append(data) # cols2.append(data)
filter_scripts = self.get_filter_scripts(f)
self.filter_scripts = filter_scripts
self.filter_form = filter_form
self.headers = headers self.headers = headers
self.head = headers self.head = headers
...@@ -268,6 +311,120 @@ class DeTable(field.Field): ...@@ -268,6 +311,120 @@ class DeTable(field.Field):
self.filters = filters self.filters = filters
self.state_save = json.dumps(state_save) self.state_save = json.dumps(state_save)
def widget_checkbox(self, column):
d = {}
d["checkbox"] = True
d["check_val"] = [column.widget.true_val, column.widget.false_val]
d["className"] = "text-center"
d["width"] = "30pt"
# d["render"] = """
# function(value){
# if (typeof value == = "string" & & value.length > 0)
# return render_checkbox(value)
# if (["", false, 0, null].indexOf(value) === -1)
# return render_checkbox(true);
#
# return render_checkbox(false);
# }"""
return d
def action_url(self, f):
act = ""
if self.allow_view:
act = f"""
'<a href="{self.action}/' + id + '/view">'+
'<i class="fas fa-eye" aria-hidden="true" title="View"></i></a>';\n
"""
if self.allow_edit:
act += f"""
'<a href="{self.action}/' + id + '/edit">'+
'<i class="fas fa-edit" aria-hidden="true" title="Edit"></i></a>';\n
"""
if self.allow_delete:
act += f"""
'<a href="{self.action}/' + id + '/delete">'+
'<i class="fas fa-trash" aria-hidden="true" title="Delete"></i></a>';\n
"""
if self.allow_post:
act += f"""
'<a href="{self.action}/' + id + '/post">'+
'<i class="fas fa-signs-post" aria-hidden="true" title="Post"></i></a>';\n
"""
if self.allow_unpost:
act += f"""
'<a href="{self.action}/' + id + '/unpost">'+
'<i class="fas fa-delete-left" aria-hidden="true" title="Unpost"></i></a>';\n
"""
return act
def get_filter_form(self, f, field_index):
field_index -= 1
html = ""
col_id = f"{self.tableid}-{f.name}"
txt = f'id="{col_id}" data-index={field_index} '
html += '<div class="form-group">'
if isinstance(f.widget, deform.widget.CheckboxWidget):
check_val = [f.widget.true_val, f.widget.false_val]
radio_val = [["", 'Semua'], [check_val[0], 'Aktif'], [check_val[1], 'Pasif']]
html += '<label class="" for="' + col_id + '">' + f.title + '</label>'
html += '<div class="input-group" id="' + col_id + '">'
for rdo in range(len(radio_val)):
# selected = (col_val == = radioVal[rdo][0]) ? "checked": "";
log.debug(f"{rdo}, {radio_val[rdo]}")
txt = f'id="{col_id}-{radio_val[rdo][0]}" value="{radio_val[rdo][0]}" '
txt += f'class="{self.tableid}-control-filter" data-index="{field_index}" '
txt += f'name="{col_id}" '
html += '<label class="radio-inline">'
html += f'<input type="radio" {txt}/>'
html += f'<label for="{col_id}-{radio_val[rdo][0]}">'
html += f'{radio_val[rdo][1]}</label>'
html += '</label>'
html += '</div>'
# elif isinstance(f.typ, colander.Date):
# requirements = f.widget.requirements
# for requirement in requirements:
# if type(requirement) == dict and "js" in requirement:
# for req in requirement:
#
# html += f'<input type="text" class="form-control {self.tableid}-control-filter hasDatePicker"'
# html += f'placeholder="{f.title}" {txt}/>'
# html += """
# <script type="text/javascript">
# deform.addCallback(
# '%s',
# function deform_cb(oid) {
# $('#'+oid).datepicker();
# }
# );
# </script>
# """ % self.tableid
else:
html += f'<input type="text" class="form-control {self.tableid}-control-filter"'
html += f'placeholder="{f.title}" {txt}/>'
html += '</div>'
return html
def get_filter_scripts(self, f):
return ""
"""
for (let co in ${tableid}Columns) {
if (${tableid}Columns[co].checkbox === true) {
} else if (${tableid}Columns[co].hasOwnProperty("url")) {
} else
${tableid}Columns[co].width = "30pt";
${tableid}Columns[co].orderable = false;
${tableid}Columns[co].className = "text-center";
${tableid}Columns[co].visible = true;
//columns[1].order = "order_asc";
}
"""
class Button(object): class Button(object):
""" """
...@@ -341,9 +498,11 @@ class Button(object): ...@@ -341,9 +498,11 @@ class Button(object):
attributes = {} attributes = {}
if title is None: if title is None:
title = name.capitalize() title = name.capitalize()
name = re.sub(r"\s", "_", name) name = re.sub(r"\s", "_", name)
if oid is None: if oid is None:
self.oid = f"detable_btn_{name}" self.oid = f"detable_btn_{name}"
self.name = name self.name = name
self.title = title self.title = title
self.type = type # noQA self.type = type # noQA
......
opensipkd/detable/templates/detable.pt
...@@ -23,6 +23,8 @@ ...@@ -23,6 +23,8 @@
allow_unpost allow_unpost|field.allow_unpost; allow_unpost allow_unpost|field.allow_unpost;
state_save state_save|field.state_save; state_save state_save|field.state_save;
filter_columns filter_columns|field.filter_columns; filter_columns filter_columns|field.filter_columns;
filter_scripts filter_scripts|field.filter_scripts;
filter_form filter_form|field.filter_form;
" "
tal:attributes="style style; class css_class; attributes|field.widget.attributes|{};" tal:attributes="style style; class css_class; attributes|field.widget.attributes|{};"
i18n:domain="detable" i18n:domain="detable"
...@@ -40,6 +42,7 @@ ...@@ -40,6 +42,7 @@
<div class="row" tal:condition="filter_columns" > <div class="row" tal:condition="filter_columns" >
<div id="${tableid}-form-filter-container" class="col-md-6"> <div id="${tableid}-form-filter-container" class="col-md-6">
<div id="${tableid}-form-filter" class="collapse"> <div id="${tableid}-form-filter" class="collapse">
${structure:filter_form}
</div> </div>
</div> </div>
</div> </div>
...@@ -53,9 +56,6 @@ ...@@ -53,9 +56,6 @@
</thead> </thead>
<tbody></tbody> <tbody></tbody>
<!--? <tfoot>-->
<!--? <th talrepeat="child field">${child.title}</th>-->
<!--? </tfoot>-->
</table> </table>
</div> </div>
<!-- widget-body --> <!-- widget-body -->
...@@ -77,231 +77,265 @@ ...@@ -77,231 +77,265 @@
var o${tableid}Url = o${tableid}Uri + "${url_suffix}"; var o${tableid}Url = o${tableid}Uri + "${url_suffix}";
var m${tableid}ID; var m${tableid}ID;
deform.addCallback('${tableid}', function (oid) { deform.addCallback('${tableid}', function (oid) {
function displayEmptyID() { function displayEmptyID() {
$("#emptyID").show(); $("#emptyID").show();
$('#emptyID').animate({opacity: 0.8}, 2000); $('#emptyID').animate({opacity: 0.8}, 2000);
setTimeout(function () { setTimeout(function () {
$("#emptyID").fadeTo(500, 0).slideUp(500, function () { $("#emptyID").fadeTo(500, 0).slideUp(500, function () {
$("#emptyID").hide(); $("#emptyID").hide();
}); });
} }
, 4000); , 4000);
} }
var $btnFilter = $("<a/>", {
"href": "#${tableid}-form-filter",
"data-toggle": "collapse",
"class": "btn btn-warning dropdown"
}).html("Filters");
let tb_array = [
'<div class="btn-group pull-left">',
$btnFilter.get(0).outerHTML,
'${structure:buttons}',
' &nbsp;',
'</div>',
]
let ${tableid}Columns = ${structure: columns}; let tb_array = [
'<div class="btn-group pull-left">',
'${structure:buttons}',
' &nbsp;',
'</div>',
]
function render_checkbox(value) { let ${tableid}Language = {
if (value === true) { "search": "Cari: ",
return '<i class="fas fa-check-square" aria-hidden="true">'; "paginate": {
} "first": '<span class="glyphicon glyphicon-step-backward"></span> ',
if (value === false) { "last": '<span class="glyphicon glyphicon glyphicon-step-forward"></span> ',
return '<i class="fas fa-minus-square" aria-hidden="true">'; "previous": '<span class="glyphicon glyphicon-backward"></span> ',
//'Archived'; "next": '<span class="glyphicon glyphicon-forward"></span> ',
} },
return value; "lengthMenu": " _MENU_ baris "
} };
function render_checklist(value) {
return '<input type="checkbox" checked="' + {value} + '"></input>'; let ${tableid}Columns = ${structure: columns};
}
for (let co in ${tableid}Columns) { function render_checkbox(value) {
if (${tableid}Columns[co].checkbox === true) { if (value === true) {
${tableid}Columns[co].className = "text-center"; return '<i class="fas fa-check-square" aria-hidden="true">';
${tableid}Columns[co].width = "30pt";
${tableid}Columns[co].render = function (value) {
if (typeof value === "string" && value.length > 0) {
return render_checkbox(value)
} }
if (["", false, 0, null].indexOf(value) === -1) { if (value === false) {
return render_checkbox(true); return '<i class="fas fa-minus-square" aria-hidden="true">';
//'Archived';
} }
return render_checkbox(false); return value;
} }
} else if (${tableid}Columns[co].hasOwnProperty("url")) {
let url = ${tableid}Columns[co].url; function render_checklist(value) {
${tableid}Columns[co].render = function (data) {
let result = "No Data" return '<input type="checkbox" checked="' + {value} + '"></input>';
if (data != null) {
result = '<a href="' + url + data + '" target="_blank">Link</a>&nbsp;';
}
return result;
} }
} else if (${tableid}Columns[co].data === "id" && ${tableid}Columns[co].action === true) {
${tableid}Columns[co].render = function (id) {
let result = "" for (let co in ${tableid}Columns) {
if (${allow_view}) { if (${tableid}Columns[co].checkbox === true) {
result = '<a href="${url}/' + id + '/view"><i class="fas fa-eye" aria-hidden="true" title="View"></i></a>&nbsp;'; ${tableid}Columns[co].render = function (value) {
} if (typeof value === "string" && value.length > 0) {
if (${allow_edit}) { return render_checkbox(value)
result += '<a href="${url}/' + id + '/edit"><i class="fas fa-edit" aria-hidden="true" title="Edit"></i></a>&nbsp;' }
} if (["", false, 0, null].indexOf(value) === -1) {
if (${allow_delete}) { return render_checkbox(true);
result += '<a href="${url}/' + id + '/delete"><i class="fas fa-trash" aria-hidden="true" title="Delete"></i></a>'; }
} return render_checkbox(false);
if (${allow_post}) { }
result += '<a href="${url}/' + id + '/post"><i class="fas fa-signs-post" aria-hidden="true" title="Post"></i></a>'; } else if (${tableid}Columns[co].hasOwnProperty("url")) {
let url = ${tableid}Columns[co].url;
${tableid}Columns[co].render = function (data) {
let result = "No Data"
if (data != null) {
result = '<a href="' + url + data + '" target="_blank">Link</a>&nbsp;';
}
return result;
}
} else if (${tableid}Columns[co].data === "id" && ${tableid}Columns[co].action === true) {
${tableid}Columns[co].render = function (id) {
let result = ""
if (${allow_view}) {
result = '<a href="${url}/' + id + '/view"><i class="fas fa-eye" aria-hidden="true" title="View"></i></a>&nbsp;';
}
if (${allow_edit}) {
result += '<a href="${url}/' + id + '/edit"><i class="fas fa-edit" aria-hidden="true" title="Edit"></i></a>&nbsp;'
}
if (${allow_delete}) {
result += '<a href="${url}/' + id + '/delete"><i class="fas fa-trash" aria-hidden="true" title="Delete"></i></a>';
}
if (${allow_post}) {
result += '<a href="${url}/' + id + '/post"><i class="fas fa-signs-post" aria-hidden="true" title="Post"></i></a>';
}
if (${allow_unpost}) {
result += '<a href="${url}/' + id + '/unpost"><i class="fas fa-delete-left" aria-hidden="true" title="Unpost"></i></a>';
}
return result;
}
//columns[1].order = "order_asc";
} }
if (${allow_unpost}) { }
result += '<a href="${url}/' + id + '/unpost"><i class="fas fa-delete-left" aria-hidden="true" title="Unpost"></i></a>';
let ${tableid}Params = {
dom: '<"row"<"col-md-8"<"toolbar">Bl><"col-md-4"fr>>tip',
processing: true,
serverSide: ${server_side},
stateSave: ${state_save},
scrollCollapse: true,
sort: ${sorts},
info: false,
filter: ${filters},
autoWidth: false,
paginate: ${paginates},
paginationType: "full_numbers",
order: [],
lengthMenu: [
[10, 25, 50, 100],
[10, 25, 50, 100]
],
pageLength: 25,
columns: ${tableid}Columns,
language: ${tableid}Language,
initComplete: function () {
$('.dataTables_filter input').unbind()
.bind('keyup', function (e) {
var code = e.keyCode || e.which;
if (code === 13) {
o${tableid}.search(this.value).draw();
}
});
} }
return result;
} }
${tableid}Columns[co].width = "30pt";
${tableid}Columns[co].orderable = false;
${tableid}Columns[co].className = "text-center";
${tableid}Columns[co].visible = true;
//columns[1].order = "order_asc";
} if (!${server_side}) {
} ${tableid}Params.data = ${data};
} else {
${tableid}Params.ajax = o${tableid}Url;
}
let ${tableid}Language = { //<talblock talcondition="filter_columns">
"search": "Cari: ", //console.log(${tableid}Columns);
"paginate": { //var html = "";
"first": '<span class="glyphicon glyphicon-step-backward"></span> ', //for (let co in ${tableid}Columns) {
"last": '<span class="glyphicon glyphicon glyphicon-step-forward"></span> ', // var col = ${tableid}Columns[co];
"previous": '<span class="glyphicon glyphicon-backward"></span> ', // if (col.searchable === true) {
"next": '<span class="glyphicon glyphicon-forward"></span> ', // var col_id = "${tableid}-" + col.data;
}, // var col_val = localStorage.getItem(col_id);
"lengthMenu": " _MENU_ baris " // if (col_val === null || col_val === undefined) {
}; // col_val = "";
// }
// var txt = 'id="' + col_id + '" data-index="' + co + '" value="' + col_val + '"';
//
// html += '<div class="form-group">';
// if (col.checkbox === true) {
// var radioVal = [["", 'Semua'], [col.check_val[0], 'Aktif'], [col.check_val[1], 'Pasif']];
// html += '<label class="" for="' + col_id + '">' + col.title + '</label>';
// html += '<div class="input-group" id="' + col_id + '">';
// for (var rdo = 0; rdo < radioVal.length; rdo++) {
// var selected = (col_val === radioVal[rdo][0]) ? "checked" : "";
// txt = 'id="' + col_id + '-' + radioVal[rdo][0] + '" ' +
// 'class="${tableid}-control-filter" data-index="' + co + '"' +
// 'name="' + col_id + '" value="' + radioVal[rdo][0] + '" '+selected;
//
// html += '<label class="radio-inline">';
// html += '<input type="radio" ' + txt + '/>';
// html += '<label for="' + col_id + '-' + radioVal[rdo][0] + '">' + radioVal[rdo][1] + '</label>';
// html += '</label>';
// }
// html += '</div>';
// } else
// html += '<input type="text" class="form-control ' + "${tableid}" + '-control-filter" placeholder="' + col.title + '" ' + txt + '/>';
// html += '</div>';
// }
//}
let ${tableid}Params = {
dom: '<"row"<"col-md-8"<"toolbar">Bl><"col-md-4"fr>>tip',
processing: true,
serverSide: ${server_side},
stateSave: ${state_save},
scrollCollapse: true,
sort: ${sorts},
info: false,
filter: ${filters},
autoWidth: false,
paginate: ${paginates},
paginationType: "full_numbers",
order: [],
lengthMenu: [
[10, 25, 50, 100],
[10, 25, 50, 100]
],
pageLength: 25,
columns: ${tableid}Columns,
language: ${tableid}Language,
initComplete: function () {
$('.dataTables_filter input').unbind()
.bind('keyup', function (e) {
var code = e.keyCode || e.which;
if (code === 13) {
o${tableid}.search(this.value).draw();
}
});
}
}
if (!${server_side}) { ${structure: filter_scripts}
${tableid}Params.data = ${data};
} else {
${tableid}Params.ajax = o${tableid}Url;
}
//<talblock talcondition="filter_columns"> o${tableid} = $('#${tableid}').DataTable(${tableid}Params);
//console.log(${tableid}Columns);
var html = "";
for (let co in ${tableid}Columns) {
var col = ${tableid}Columns[co];
if (col.searchable === true) {
var col_id = "${tableid}-" + col.data;
var col_val = localStorage.getItem(col_id);
if (col_val === null || col_val === undefined) {
col_val = "";
}
var txt = 'id="' + col_id + '" data-index="' + co + '" value="' + col_val + '"';
html += '<div class="form-group">'; let tb = tb_array.join(' ');
if (col.checkbox === true) { $("div.toolbar").html(tb);
var radioVal = [["", 'Semua'], [col.check_val[0], 'Aktif'], [col.check_val[1], 'Pasif']]; $("div.toolbar").attr('style', 'display:block; float: left; margin-bottom:6px; line-height:16px;');
html += '<label class="" for="' + col_id + '">' + col.title + '</label>'; $('#${tableid} tbody').on('click', 'tr', function () {
html += '<div class="input-group" id="' + col_id + '">'; if ($(this).hasClass('selected')) {
for (var rdo = 0; rdo < radioVal.length; rdo++) { $(this).removeClass('selected');
var selected = (col_val === radioVal[rdo][0]) ? "checked" : ""; m${tableid}ID = null;
txt = 'id="' + col_id + '-' + radioVal[rdo][0] + '" ' + } else {
'class="${tableid}-control-filter" data-index="' + co + '"' + let aData = o${tableid}.row(this).data();
'name="' + col_id + '" value="' + radioVal[rdo][0] + '" '+selected; o${tableid}.$('tr.selected').removeClass('selected');
$(this).addClass('selected');
m${tableid}ID = aData.id;
//console.log("m${tableid}ID", m${tableid}ID);
o${tableid}.$('tr.row_selected').removeClass('row_selected');
$(this).addClass('row_selected');
}
});
html += '<label class="radio-inline">'; $(".${tableid}-control-filter").on('keyup', function (e) {
html += '<input type="radio" ' + txt + '/>'; var code = e.keyCode || e.which;
html += '<label for="' + col_id + '-' + radioVal[rdo][0] + '">' + radioVal[rdo][1] + '</label>'; if (code === 13) {
html += '</label>'; filter_table()
} }
html += '</div>'; });
} else
html += '<input type="text" class="form-control ' + "${tableid}" + '-control-filter" placeholder="' + col.title + '" ' + txt + '/>';
html += '</div>';
}
}
$("#${tableid}-form-filter").html(html);
$(".${tableid}-control-filter").on('keyup', function (e) { function filter_table() {
var code = e.keyCode || e.which; $(".${tableid}-control-filter").each(function (e) {
if (code === 13) { var col_id = $(this).attr("id")
o${tableid} var value;
.column($(this).data('index')) if ($(this).attr("type") === 'radio') {
.search(this.value) col_id = $(this).attr('id').split("-");
.draw(); col_id.length = 2;
localStorage.setItem($(this).attr('id'), $(this).val()); col_id = col_id.join("-");
} value = this.value;
}); if (this.checked) {
console.log(col_id, $(this).attr('id'), value, this.checked);
localStorage.setItem(col_id, value);
o${tableid}
.column($(this).data('index'))
.search(this.value)
}
} else {
col_id = this.id;
value = this.value;
if (value === undefined || value === null) {
value = "";
}
console.log(col_id, $(this).attr('id'), value, $(this).data('index'));
localStorage.setItem(col_id, value);
o${tableid}
.column($(this).data('index'))
.search(value);
}
});
o${tableid}.draw();
}
$(".${tableid}-control-filter").on('click', function (e) { $(".${tableid}-control-filter").on('click', function (e) {
var code = e.keyCode || e.which; console.log("Write Data Click");
if ($(this).attr("type") === 'radio') { if ($(this).attr("type") === 'radio') {
var col_id=$(this).attr('id').split("-"); filter_table()
col_id.length=2; }
col_id=col_id.join("-"); });
o${tableid}
.column($(this).data('index'))
.search(this.value)
.draw();
localStorage.setItem(col_id, $(this).val());
}
});
//</talblock> console.log("Read Data");
$(".${tableid}-control-filter").each(function (e) {
var col_id = $(this).attr("id")
var value;
if ($(this).attr("type") === 'radio') {
col_id = $(this).attr('id').split("-");
col_id.length = 2;
col_id = col_id.join("-");
value = localStorage.getItem(col_id);
if (value !== undefined && value != null)
if ($(this).val() === value) $(this).attr("checked", true);
else $(this).attr("checked", false);
} else {
value = localStorage.getItem(col_id);
if (value !== undefined && value !== null)
$(this).val(value);
}
console.log(col_id, $(this).attr('id'), value);
})
o${tableid} = $('#${tableid}').DataTable(${tableid}Params); ${structure:btnscripts}
let tb = tb_array.join(' ');
$("div.toolbar").html(tb);
$("div.toolbar").attr('style', 'display:block; float: left; margin-bottom:6px; line-height:16px;');
$('#${tableid} tbody').on('click', 'tr', function () {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
m${tableid}ID = null;
} else {
let aData = o${tableid}.row(this).data();
o${tableid}.$('tr.selected').removeClass('selected');
$(this).addClass('selected');
m${tableid}ID = aData.id;
//console.log("m${tableid}ID", m${tableid}ID);
o${tableid}.$('tr.row_selected').removeClass('row_selected');
$(this).addClass('row_selected');
} }
}); )
${structure:btnscripts} ;
});
</script> </script>
</div> </div>
\ No newline at end of file \ No newline at end of file
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!