How to display only the datatable rows where the textbox is greater than 0
↧
display only rows where input not null on click checkbox
↧
Individual Search Columns not working in Fixed Columns
I have a table and applied a Fixed column on it fixing the first two columns which was successful on my end. In Addition to this, I also applied individual search columns but it seems to work only on the not fixed columns. It does not work on the fixed columns. If you need to see how I copied and reconstructed the JS here's the code.
$(document).ready(function() { $('#example tfoot th').each( function () { var title = $('#example thead th').eq( $(this).index() ).text(); $(this).html( '' ); } ); var table = $('#example').DataTable({ setTimeout: "50", scrollY: "350px", scrollX: true, scrollCollapse: true, paging: false, heightMatch: "auto", columnFilter: true, fixedColumns: { leftColumns: 2 }, }); table.columns().every( function () { var that = this; $( 'input', this.footer() ).on( 'keyup change', function () { that .search( this.value ) .draw(); } ); } ); });<style type="text/css">
/* Ensure that the demo table scrolls */
th, td { white-space: nowrap; }
div.dataTables_wrapper {
width: 1210px;
margin: 0 0 0 0;
}
</style>
Note: To explain it more clear, I have let's say 6 columns and the first two columns (columns 1,2) are freezed/fixed. The indivudual column search works on 3,4,5,6 but not it 1 and 2.
↧
↧
I want to show only login user profile records in the data table.? what you are using to display ?
help me ; i want to show records only logged user delails , how to display
↧
I have been trying to use Editor. I have valid JSON but it wont load the data.
Thank you in advance.
I thought I could do this after using DataTables but Editor has me stumped.
Here is a link: http://www.murray5.com/preditor/prshow.php
Here is the main file:
<!doctype html>
<html>
<head>
<title>View Current Prayer Requests</title>
<script type="text/javascript" src="../js/jquery-2.2.4.js"></script>
<script type="text/javascript" src="../DataTables/datatables.min.js"></script>
<script type="text/javascript" src="../DataTables/Editor-2017-02-26-1.6.1/js/dataTables.editor.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="../DataTables/datatables.min.css" rel="stylesheet" type="text/css">
<link href="../DataTables/Editor-2017-02-26-1.6.1/css/editor.dataTables.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<script>
var editor; // use a global for the submit and return data rendering in the examples
$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
ajax: "prq.php",
table: "#mytable",
idSrc: "rnu",
fields: [ {
label: "date:",
name: "date",
type: "datetime"
}, {
label: "name:",
name: "name"
}, {
label: "cell:",
name: "cell"
}, {
label: "email:",
name: "email"
}, {
label: "prayer:",
name: "prayer"
}, {
label: "contact:",
name: "contact"
}, {
label: "privacy:",
name: "privacy"
}
]
} );
$('#mytable').DataTable( {
dom: "Bfrtip",
ajax: "prq.php",
columns: [
{ data: "date" },
{ data: "name" },
{ data: "cell" },
{ data: "email" },
{ data: "prayer" },
{ data: "contact" },
{ data: "privacy" }
],
select: true,
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
} );
} );
</script>
<table id="mytable" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Date</th>
<th>Name</th>
<th>cell</th>
<th>email</th>
<th>prayer</th>
<th>contact</th>
<th>privacy</th>
</tr>
</thead>
<tfoot>
<tr>
<th>date</th>
<th>name</th>
<th>cell</th>
<th>email</th>
<th>prayer</th>
<th>contact</th>
<th>privacy</th>
</tr>
</tfoot>
</table>
</body>
</html>
Here is the php file.
<!doctype html>
<html>
<head>
<title>View Current Prayer Requests</title>
<script type="text/javascript" src="../js/jquery-2.2.4.js"></script>
<script type="text/javascript" src="../DataTables/datatables.min.js"></script>
<script type="text/javascript" src="../DataTables/Editor-2017-02-26-1.6.1/js/dataTables.editor.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="../DataTables/datatables.min.css" rel="stylesheet" type="text/css">
<link href="../DataTables/Editor-2017-02-26-1.6.1/css/editor.dataTables.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<?php
date_default_timezone_set('America/Chicago');
/*
* Example PHP implementation used for the index.html example
*/
// DataTables PHP library
include( "../DataTables/php/DataTables.php" );
// Alias Editor classes so they are easy to use
use
DataTables\Editor,
DataTables\Editor\Field,
DataTables\Editor\Format,
DataTables\Editor\Mjoin,
DataTables\Editor\Options,
DataTables\Editor\Upload,
DataTables\Editor\Validate;
// Build our Editor instance and process the data coming from _POST
Editor::inst( $db, 'prequest', 'rnu' )
->fields(
Field::inst( 'date' )
->validator( 'Validate::dateFormat', array(
"format" => Format::DATE_ISO_8601,
"message" => "Please enter a date in the format yyyy-mm-dd"
) )
->getFormatter( 'Format::date_sql_to_format', Format::DATE_ISO_8601 )
->setFormatter( 'Format::date_format_to_sql', Format::DATE_ISO_8601 ),
Field::inst( 'name' )->validator( 'Validate::notEmpty' ),
Field::inst( 'cell' ),
Field::inst( 'email' ),
Field::inst( 'prayer' )->validator( 'Validate::notEmpty' ),
Field::inst( 'contact' ),
Field::inst( 'privacy' )
)
->process( $_POST )
->json();
?>
</body>
</html>
↧
DataTables + ColVis+ Responsive + Export buttons not exporting all the data.
Hi All
I don't know if this is a bug or if the export is referencing the wrong data but when you have a DT table set as responsive and some of the columns are hidden because the window is too small to display all the data (and then responsive collapse it under blue plus button) then only the visible columns are exported.
Is there any way to fix this and to ignore the responsive collapsed columns as if it is the full visible table?
Thanks
↧
↧
DataTable Jquery Server Side With Adobe Cold Fusion and SQL Server
-- AUTHOR ADAM JACLOU,
-- FOUNDER AND SENIOR PROGRAMMING ON OCTAPUSH JS https://github.com/octapush
-- FACEBOOK https://www.facebook.com/adam.lery.7
1. Step 1 create DB in your database Sql Server
2. Step 2 create Table In SQL server
https://www.facebook.com/adam.lery.7
CREATE TABLE [dbo].[TAccount](
[Account_Id] [int] IDENTITY(1,1) NOT NULL,
[Account_Name] varchar NULL,
[Account_Address1] varchar NULL
CONSTRAINT [PK_TAccount] PRIMARY KEY CLUSTERED
(
[Account_Id] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
- Create page html and js in adobe cold fusion, I Have Created with name index.cfm
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="misc/global/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="misc/global/plugins/datatables/css/dataTables.bootstrap.min.css">
<script type="text/javascript" src="misc/global/plugins/jquery.min.js"></script>
</head>
<body>
",
"
"
].join(""),
width: "150px"
}
]
});
}
},
ROUTINES: {
register: function(){
main.ROUTINES.getSelectedRow.apply();
},
getSelectedRow: function(obj){
return {
index : $(obj).closest('tr').index(),
data: globalVars.tableId.dataTable().fnGetData($(obj).closest('tr').index())
}
}
},
EVENTS: {
register: function(){
main.EVENTS.eventButtonRow.apply();
},
eventButtonRow: function(){
globalVars.tableId
.on('preXhr.dt', function(e, setting, data) {
console.log(data);
})
.on('xhr.dt', function(e, setting, data) {
})
.on('draw.dt', function() {
main.EVENTS.gridBtnTable.apply();
});
},
gridBtnTable: function(){
var oBtn = $('button[data-tag="pilih"]');
oBtn.unbind().bind('click',function(){
var that = $(this).attr('data-tag');
if(that=='pilih'){
var data = main.ROUTINES.getSelectedRow($(this));
console.log(data); //GET POSITION ID DATA AND ALL DATA
console.log(data.data[1]); //SEPCIFIK DATA YOU CHICE
}
});
}
}
} //END MAIN
main.register.apply();
});
",
" ",
"
",
"
</body>
</html>
- and for proccessing data i have created file cfc with name proses.cfc
<cfcomponent>
<cffunction name="dataTable" access="remote" format="json">
<cfset sTableName = "TAccount" />
<cfset listColumns = "Account_Id,Account_Name,Account_Address1" />
<cfset sIndexColumn = "Account_Id" />
<cfset coldfusionDatasource = "dbcserpdev1608"/>
<cfparam name="url.sEcho" default="1" type="integer" />
<cfparam name="url.iDisplayStart" default="0" type="integer" />
<cfparam name="url.iDisplayLength" default="10" type="integer" />
<cfparam name="url.sSearch" default="" type="string" />
<cfparam name="url.iSortingCols" default="0" type="integer" />
<!--- Data set after filtering --->
<cfquery datasource="#coldfusionDatasource#" name="qFiltered">
SELECT #listColumns#
FROM #sTableName#
<cfif len(trim(url.sSearch))>
WHERE <cfloop list="#listColumns#" index="thisColumn"><cfif thisColumn neq listFirst(listColumns)> OR </cfif>#thisColumn# LIKE <cfif thisColumn is "version"><!--- special case ---><cfqueryparam cfsqltype="CF_SQL_FLOAT" value="#val(url.sSearch)#" /><cfelse><cfqueryparam cfsqltype="CF_SQL_VARCHAR" value="%#trim(url.sSearch)#%" /></cfif></cfloop>
</cfif>
<cfif url.iSortingCols gt 0>
ORDER BY <cfloop from="0" to="#url.iSortingCols-1#" index="thisS"><cfif thisS is not 0>, </cfif>#listGetAt(listColumns,(url["iSortCol_"&thisS]+1))# <cfif listFindNoCase("asc,desc",url["sSortDir_"&thisS]) gt 0>#url["sSortDir_"&thisS]#</cfif> </cfloop>
</cfif>
</cfquery>
<!--- Total data set length --->
<cfquery datasource="#coldfusionDatasource#" name="qCount">
SELECT COUNT(#sIndexColumn#) as total
FROM #sTableName#
</cfquery>
<!---
Output
--->
<cfcontent reset="Yes" />
{"sEcho": <cfoutput>#val(url.sEcho)#</cfoutput>,
"iTotalRecords": <cfoutput>#qCount.total#</cfoutput>,
"iTotalDisplayRecords": <cfoutput>#qFiltered.recordCount#</cfoutput>,
"aaData": [
<cfoutput query="qFiltered" startrow="#val(url.iDisplayStart+1)#" maxrows="#val(url.iDisplayLength)#">
<cfif currentRow gt (url.iDisplayStart+1)>,</cfif>
[<cfloop list="#listColumns#" index="thisColumn"><cfif thisColumn neq listFirst(listColumns)>,</cfif><cfif thisColumn is "version"><cfif version eq 0>"-"<cfelse>"#replacenocase(jsStringFormat(version),"\'","'","all")#"</cfif><cfelse>"#replacenocase(jsStringFormat(qFiltered[thisColumn][qFiltered.currentRow]),"\'","'","all")#"</cfif></cfloop>]
</cfoutput> ] }
</cffunction>
</cfcomponent>
↧
make row bold given a cell value
Hi,
I'm looking for a way to make the last row in my datatable bold (for each cell). My table is populated through JSON data.
I tried the following code but this doesn't work:
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
/* All cells in 4th row will be bolded */
if ( iDisplayIndex == 3 ) {
$('td', nRow).each(function(){
$(this).html( '<td><b>'+$(this).text()+'</b><td>' );
});
}
return nRow;
},
Any thoughts?
Bart
↧
Suggestion/Autocomplete option values for input
I'm appending options to an input to show suggestions when searching for a value. The below is looking only in the current json though ... (so the first 100 values (at beginning) out of 10000 records). Is it possible to not limit the values to 100 and use the whole returning name.php ?
<input class="input-name form-control" list="datalist-name" type="text">
<datalist id="datalist-name"></datalist>
table = $('#my_table').DataTable( {
dom: "Blfrtip",
ajax: {
url: "/name.php",
type: "POST",
data: function (d) { } },
serverSide: true,
processing: true,
columns: [
...
],
lengthMenu: [100, 250, 500],
'initComplete': function(settings, json) {
$.each(json.data, function (i, item) {
var name = item.name;
$('#datalist-name').append('<option value="' + name + '">' + name + ' </option>');
});
}
} );
Many thanks
↧
Editing in Related Tables
I'm trying to port an existing web app into DataTables/Editor. Any record in the table being edited might have zero to many related records in another table. Is there any way from within an Editor form to invoke the editor again on the related table record in the related table? I'd like to be able to create a record in the related table when necessary, as well as to display the related records in that table. So far, I haven't found a way to do this within the DataTables/Editor framework.
Since this is a feasibility question, I don't have a problem pagers debug or link to. However, I can provide more detailed information if that would help someone who wants to respond.
↧
↧
PDF Export Styles
I want to style the exported pdf. in the console.log(doc) I see some styled named tabelHeader,...
Is it possible to change these settings?
I tried with
customize: function(doc){
styles: {
tableHeader:{
fillColor:"#F0F8FF"
}
}
But this did not work.
Andreas
↧
Apply functions to new rows
Sorry to be such a pain, but I have yet another question. Mainly, I have a function that enables scrolling row selection like this:
function () {
var isMouseDown = false,
isSelected;
$("#homeTable tr")
.mousedown(function () {
isMouseDown = true;
$(this).toggleClass("selected");
isSelected = $(this).hasClass("selected");
return false; // prevent text selection
})
.mouseover(function () {
if (isMouseDown) {
$(this).toggleClass("selected", isSelected);
}
})
.bind("selectstart", function () {
return false;
})
$(document)
.mouseup(function () {
isMouseDown = false;
});
}
I define this function before initializing my table. My problem is that if I add new row, this function is not applied to those new rows. I have tried adding a callback like this:
$(document).ready(function () {
var table = $('#homeTable').DataTable({
scrollY: "500px",
//scrollX: true,
responsive: true,
scrollCollapse: true,
paging: true,
lengthMenu: [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
drawCallback: function (settings) {
var isMouseDown = false,
isSelected;
$("#homeTable tr")
.mousedown(function () {
isMouseDown = true;
$(this).toggleClass("selected");
isSelected = $(this).hasClass("selected");
return false; // prevent text selection
})
.mouseover(function () {
if (isMouseDown) {
$(this).toggleClass("selected", isSelected);
}
})
.bind("selectstart", function () {
return false;
})
$(document)
.mouseup(function () {
isMouseDown = false;
});
}
});
However, if I do that, I am unable to select any rows on initialization, but if I add new rows, I CAN select those new rows and only those new rows. How can I apply this function across the board to all rows on initialization as well as any new rows upon their addition? Again, sorry to be such a bother!
Edit:
More generally, is there a way to reset the table to the same state it was on intitalization? I tried destroying the table and creating a new one, but this gave me problems because rows I had removed did not reappear on reinitlization. Is that normal? Moreover, when clicking the back button on a mobile device, I can see the responsive CSS did not get applied. So instead of recreating the table, I push all rows I remove into an array and then add them back on page hide so they are back if the user clicks back. Bascially I just want the table to be in its initial state when the user clicks back on a mobile device. Would ajax.reload() be the way to go? Haven't tried that yet. Anyway, thanks again for you responsiveness. This plugin is one of the coolest things out there for sure!
↧
Issue with Invalid JSON, yet lints clean
I'm trying to build a tabbed report using 5 datatables. I have abandoned this idea, as I have been unable to get it to work.
I have switched to single pages for each, but hitting the same issues.
3 of the tables are returning invalid JSON errors, in fact I'm getting 8+ alerts per page on the same query.
I don't understand why the JSON is not working, and why its attempting to run AJAX 8+ times per page
I've included my code here: http://live.datatables.net/jamidaza/1/edit?html,js
The example doesn't work, as it requires the php data component.
However, I've included a small working set of data below as it is returned from php/ajax
{"draw":15,"recordsTotal":"56282","recordsFiltered":"13","data":[["2","06-JUN-14","246246","246246","246246","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","246246criteria_null_value",null,"criteria_null_value",null],["3","06-JUN-14","26500?","265000","265009","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26500?criteria_null_value",null,"criteria_null_value",null],["4","06-JUN-14","26501?","265010","265019","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26501?criteria_null_value",null,"criteria_null_value",null],["5","06-JUN-14","26502?","265020","265029","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26502?criteria_null_value",null,"criteria_null_value",null],["6","06-JUN-14","26503?","265030","265039","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26503?criteria_null_value",null,"criteria_null_value",null],["7","06-JUN-14","26504?","265040","265049","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26504?criteria_null_value",null,"criteria_null_value",null],["8","06-JUN-14","26505?","265050","265059","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26505?criteria_null_value",null,"criteria_null_value",null],["9","06-JUN-14","26506?","265060","265069","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26506?criteria_null_value",null,"criteria_null_value",null],["10","06-JUN-14","26507?","265070","265079","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26507?criteria_null_value",null,"criteria_null_value",null],["11","06-JUN-14","26508?","265080","265089","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26508?criteria_null_value",null,"criteria_null_value",null],["12","06-JUN-14","26509?","265090","265099","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","26509?criteria_null_value",null,"criteria_null_value",null],["13","06-JUN-14","2651??","265100","265199","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","2651??criteria_null_value",null,"criteria_null_value",null],["14","06-JUN-14","265265","265265","265265","000-AOLIM","AOLIM-SAOLIM","AOLIM-SAOLIM","000-AOLIM","Native","265265criteria_null_value",null,"criteria_null_value",null]]}
Any assistance appreciated
Allan
↧
Sorting by computed column doesn't work (server side)
Hello @Alan
Please check this bin with Access-Control-Allow-Origin enabled
Check the Priority column. It doesn't seem to be ordered. Table is ordered by column #0 instead...
Screenshot
I've also tried data render within ColumnDefs - same problem. When I tried the same with no server side data load - works fine,
Will appreciate your help!
Thanks
↧
↧
"Requested unknown parameter" when colspan is used
Im getting the "Requested unknown parameter" warning because my table has a row which uses colspan. See attached image.
<tr class="t2_tr">
<td colspan="15" class="t2_hc_line table-header-lines">Cold War Kids - First</td>
</tr>
Is there a setting I can use to avoid this warning?
↧
FixedButtons... (or how to keep buttons from scrolling)?
I've just started with datatables and while I have integrated FixedHeaders and can get that to work, I was wondering if there is anyway to also keep the buttons from scrolling as well (i.e. keep them with the fixed header).
Thx
↧
Need help with this please
Okay, I am not a programmer but know a little. I have written quite complex scripts in autoit etc and have programmed in the past. I have been tasked with creating reports using data tables. We use Sybase and stored procedures. We then call the webservice. My boss has this working in a previous report for different data but for some reason, I just can't get this to show the search box. This displays the table nicely and is by no means complete but I am getting frustrated at this stage. I have tried different combinations of .js and .css files. I have also tried using base script call and various other combinations. What am I missing?
```
ALTER PROCEDURE "WEBDBA"."StockCheck"(
@param_Location varchar(15)= '0001',
@param_Code varchar(255)= null )
/* RESULT( column_name column_type, ... ) /
as
begin
declare @location_no varchar(5),
@prod_code varchar(40),
@prod_desc varchar(40),
@ShopStock numeric(18,4),
@html_body TEXT,
@results TEXT,
@tablebody long varchar,
@stk_qty varchar(25),
@shoplist long varchar,
@shopname long varchar,
@shopnumber varchar(10)
message 'Location ['+@param_Location+']' to log
--message 'Code ['+param_Code+']' to log;
--set @results = '';
--set @tablebody = '';
set @shoplist = (select
LIST(
'<option value="' || ClientNumber || '">' || ClientName || '</option>')
from DBA.Locations)
-- set @shopnumber = (select ClientNumber from DBA.Client where ClientName = shopname and ClientType = 'L');
--if(param_Code is not null) then
-- SET location_no = COALESCE(param_Location, '0006' );
-- set location_no = param_Location;
-- MESSAGE 'Location [' + param_Location + ']' TO LOG;
--Endif;
--SET @bodydata = ''/
execute sa_set_http_header 'Content-Type','text/html'
--call sa_set_http_header('Content-Type','text/html');
set @tablebody
= (select
LIST(
'<tr>'
|| '<td>' || Productcode || '</td>'
|| '<td><B>' || Barcode || '</B></td>'
|| '<td><i>' || ProductDescription || '</i></td>'
|| '<td><B>' || Totalshelfstockquantity || '</B></td>'
-- '<td>'||sa.updatetimestamp||'</td>'||
|| '</tr>','') from DBA.StockListView)
select '<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Available Stock Warehouse</title>
<link rel="stylesheet" type="text/css" href="/css/foundation.css"/>
<link rel="stylesheet" type="text/css" href="/css/foundation.min.css"/>
<link rel="stylesheet" type="text/css" href="/css/app.css"/>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"/>
<link rel="stylesheet" href="DataTables/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="jquery.dataTables_themeroller.css"/>
<link rel="stylesheet" type="text/css" href="/css/reset.css"/>
<link rel="stylesheet" type="text/css" href="/css/opera.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/datatables.mark.js/2.0.0/datatables.mark.min.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/plug-ins/1.10.13/features/mark.js/datatables.mark.min.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.13/css/dataTables.jqueryui.min.css"/>
</head>
<body>
<
div class="container">
$(document).ready(function() { $("#example").dataTable( { "paging": false, "ordering": false, "info": false } ); } );<Table id="image"><td valign="top" align="right"><a href="/"><img src="/images/Store_logo.png" width="358" height="105" border="0"></a></td></table>
<BR/>
<
table id="example1" class="display" cellspacing="0" width="100%">
| Product Code | Product Barcode | Product Description | Safdar Warehouse Stock | Last Sold Date |
|---|---|---|---|---|
| Product Code | Product Barcode | Product Description | Stock At Safdar | Last Sold Date |
'
end ```
↧
Trouble with checkbox.
Hi, everyone.
Im trying to use a checkbox set to indicate in the editor form a set of optios which can be individually check or unchecked. Everything is ok if I define the options in the checkbox field definition. However, if I try to create the options dinamically, by using the preOpen event, all the options are shown unchecked.... just the first time I open the editor. The second, third etc times, the options are shown properly cheked or unchecked, depending on the data base contents. It only fails the first time I open the editor.
The field is defined like this:
{
label: 'Especialidades:',
name: 'id_especialidades[]',
type: 'checkbox',
fieldInfo: 'Selecciona las especialidades'
},
The options are loaded dinamically by the preOpen event, like this:
objetoEditor.on('preOpen', function(e, mode, action){
if (action == "remove") return;
$.ajax({
url:"leer_especialidades_editor_08.php",
async:false,
dataType: "JSON",
complete:function(datosRecibidos) {
listaDeEspecialidades = datosRecibidos.responseText;
}
});
var matrizDeEspecialidades = JSON.parse(listaDeEspecialidades);
objetoEditor.field('id_especialidades[]').update(matrizDeEspecialidades);
});
Ant the field in the Datatables is defined like this:
{"data": 'id_especialidades[]'}
When I open the editor, the preOpen event gives the right JSON response from the first time, like this:
0:{label: "Bootstrap", value: "9"}
1:{label: "CSS 3", value: "3"}
2:{label: "HTML 5", value: "1"}
3:{label: "JavaScript 6", value: "2"}
4:{label: "jQuery", value: "7"}
5:{label: "jQuery Mobile", value: "10"}
6:{label: "jQueryUI", value: "8"}
7:{label: "MySQL", value: "6"}
8:{label: "PHP", value: "5"}
9:{label: "SCSS", value: "4"}
The first time I try to edit a user profiles, they appear all the checkboxes unchecked. If I close the form and reopen it, the checkboxes appear properly checked or unchecked, on the real sate in the MySQL table.
Why does it not work just the first time?
Thanks everyone.
↧
↧
With select-checkbox, appears, cannot check after refreshing table
I am using the select-checkbox className for a checkbox column which generally works well. I allow the user to select one or more rows and remove the items from the table (by deleting the row(s) in the database and refreshing the table). However, when attempting to check one of the remaining rows after refreshing, the checkboxes for the remaining items cannot be checked. I did a comparison of the html for the checkbox table cells and they both look the same (before and after removing/refreshing items from the table). Any ideas on how to troubleshoot this?
Thanks.
Tom
↧
Upgrade from 1.5.6 to 1.6.1
Hi Allan,
I downloaded and tried to upgrade to 1.6.1. I don't see any php file to be upgraded at all. Am I right? Thanks Allan.
↧
Help with Custom Button -> pass selected column to a csv url
I'm relatively new at this, so please forgive me if I'm missing something obvious.
I've built a page that allows the user to submit a bunch of device serial numbers, and which will then query the database for all the information available within the system on those serials and display the result via datatables on the page. I've also added the ability into the page it identify and automatically select the rows in which the database doesn't contain any information on the queried serial numbers.
As the user will often then need to followup with those serials in another internal tool, I've added a copy-to-clipboard button that will pull just the serial numbers of the selected rows. This is currently working great, however like in all ventures, there's always room to improve the user experience, so I'm trying to determine if I can take those selected serials and then pass them directly into another system's API to allow the user to skip the step of copying to the clipboard and going to another page to submit that information.
Here's my current buttons code that handles the copy-to-clipboard and the filtering of just the serials:
buttons: [{
extend: 'copy',
text: 'Copy Selected Serials to Clipboard',
header: false,
exportOptions: {
columns: 1,
modifier: {
selected: true
}
}
}],
I'm trying to add a button that will take the same data from above, and instead of copying it to the clients clipboard, will generate a redirect or link to another page where the data is passed as a comma seperated parameter in the URL. At this point, I dont really care if the link generation is handled all client side, or if it is handled server side thru an ajax query to a server side script that takes the array and processes it to generate the API URL (I'm honestly more comfortable with PHP than Jquery, so the server side option might be easier for me to work out). The big issue is I'm having a hard time finding information on how to pull the data from datatables and pass it on click to another ajax call or other internal process.
any help anyone could provide would be greatly appreciated.
~Daryl
↧