jQWidgets Forums
Forum Replies Created
-
Author
-
June 5, 2015 at 4:04 pm in reply to: How to populate combobox in toolbar How to populate combobox in toolbar #72102
Hi Ivailo
Thanx!!
May 15, 2015 at 12:43 pm in reply to: How to populate jqxInput with field from database How to populate jqxInput with field from database #71179Hi Ivailo,
thanks for you quick answer. I have noticed your example.
But I still have a question: the contents of the jqxInput needs to be at startup the contents of the first field of the first record of the database. That’s why I wrote ‘records[0]’. The first field is called ‘Titel’. It is that contents that I want to present at startup. I also made systeemvariabelen a global variable.
I have copied my script below. Can you help me once again?var systeemvariabelen;
//laden van tabel systeem
// prepare the data
var systeemsource =
{
datatype: “json”,
datafields: [
{ name: ‘Titel’, type: ‘string’ },
{ name: ‘VoorbladAanUit’, type: ‘string’ },
{ name: ‘LogboekAanUit’, type: ‘string’ }
],
url: ‘sql_get_systeem.php’
};var systeem_dataAdapter = new $.jqx.dataAdapter(systeemsource, {
loadComplete: function (records) {
var records = systeem_dataAdapter.records;
systeemvariabelen = records[0];
alert(‘1-‘ + systeemvariabelen.Titel);
},
loadError: function (jqXHR, status, error) {
},
beforeLoadComplete: function (records) {
}
});
systeem_dataAdapter.dataBind();alert(‘2-‘ );
//input titel voorblad displayMember: ‘Titel’, valueMember: ‘Titel’,
$(“#invoertitel”).jqxInput({ source: systeem_dataAdapter, displayMember: ‘Titel’, placeHolder: “Voer titel in”, height: 25, width: 200 });May 8, 2015 at 8:24 pm in reply to: Losing filter after grid printing Losing filter after grid printing #70864Hi Nadezhda, it works!!
Thanks for your good advice!Arneault
May 8, 2015 at 11:42 am in reply to: Losing filter after grid printing Losing filter after grid printing #70850Hi Nadezhda
Thanks for your answer.
I have implemented your examplecode in mine and see that the problem is not in the grid, but in the toolbar.
In my code (see below) I have two print buttons. One in a toolbar and one in the html code. When pressing the printbutton in the html code, the filter remains in the grid. But when I press the printbutton in the toolbar, the filter is reset.
I want to use the printbutton in the toolbar and keeping the filter. Can you tell me what to do?Thanks, Arneault
<!DOCTYPE html>
<html>
<head>
<title>Administratie</title><!–<link rel=”stylesheet” href=”styles/admin.css”>–>
<link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css” />
<link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.fresh.css” type=”text/css” /><script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxdata.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxscrollbar.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxmenu.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxlistbox.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxdropdownlist.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.edit.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.selection.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.columnsresize.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.filter.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.sort.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.pager.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.grouping.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxcheckbox.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.aggregates.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxtoolbar.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxcombobox.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxinput.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxdata.export.js”></script>
<script type=”text/javascript” src=”../../jqwidgets/jqxgrid.export.js”></script><script type=”text/javascript”>
$(document).ready(function () {
var source =
{
dataType: “json”,
cache: false,
dataFields: [
{ name: ‘record_id’, type: ‘integer’ },
{ name: ‘ToetsNr’, type: ‘string’ },
{ name: ‘PakketVak’, type: ‘string’ },
{ name: ‘LesGroep’, type: ‘string’ },
{ name: ‘Surveillant’, type: ‘string’ },
{ name: ‘Lokaal’, type: ‘string’ },
{ name: ‘AantalMinuten’, type: ‘string’ },
{ name: ‘Datum’, type: ‘string’ },
{ name: ‘Tijd’, type: ‘string’ },
{ name: ‘ToetsNaam’, type: ‘string’ },
{ name: ‘AantalLeerlingen’, type: ‘string’ },
{ name: ‘GewAantalSurv’, type: ‘string’ },
{ name: ‘VakDocentCode’, type: ‘string’ },
{ name: ‘VakCode’, type: ‘string’ },
{ name: ‘Afdeling’, type: ‘string’ },
{ name: ‘LesGroep2’, type: ‘string’ },
{ name: ‘NietAfdrukken’, type: ‘string’ },
{ name: ‘ingeleverd’, type: ‘integer’ }
],
url: ‘sql_getrooster.php’/*,
filter: function()
{
// update the grid and send a request to the server.
$(“#admintable”).jqxGrid(‘updatebounddata’, ‘filter’);
}*/
};$(“#admintable”).jqxGrid(
{
width: 1150,
theme: ‘fresh’,
pageable: true,
columnsResize: true,
sortable: true,
editable: true,
autoheight: true,
filterable: true,
selectionmode: ‘singlerow’,
showfilterrow: true,
altrows: true,
ready: function () {
addfilter();
},
autoshowfiltericon: true,
pageSize: 25,
pagermode: ‘simple’,
pagerButtonsCount: 10,
showstatusbar: true,
statusbarheight: 50,
showaggregates: true,
source: source,
columns: [
{ text: ‘Ingeleverd’, dataField: ‘ingeleverd’, width: 150, columntype: ‘checkbox’, filtertype: ‘checkedlist’, editable: true,
aggregates: [{
‘Ingeleverd’: function (aggregatedValue, currentValue) {
if (currentValue) {
return aggregatedValue + 1;
}
return aggregatedValue;
}
}, {
‘Niet ingeleverd’: function (aggregatedValue, currentValue) {
if (!currentValue) {
return aggregatedValue + 1;
}
return aggregatedValue;
}
}]},
/*{ text: ‘ID’, dataField: ‘record_id’, width: 50, editable: false },*/
{ text: ‘Datum’, dataField: ‘Datum’, width: 130, editable: false, filtertype: ‘checkedlist’ },
{ text: ‘Groep’, dataField: ‘LesGroep’, width: 70, editable: false },
{ text: ‘Surveillant’, dataField: ‘Surveillant’, width: 100, editable: false },
{ text: ‘Lokaal’, dataField: ‘Lokaal’, width: 70, editable: false },
{ text: ‘Omschrijving’, dataField: ‘ToetsNaam’, width: 200, editable: false },
{ text: ‘Tijd’, dataField: ‘Tijd’, width: 100, editable: false },
{ text: ‘Tijdsduur’, dataField: ‘AantalMinuten’, width: 90, editable: false, cellsalign: ‘center’ },
{ text: ‘Vakdocent’, dataField: ‘VakDocentCode’, width: 110, editable: false },
{ text: ‘Vak’, dataField: ‘VakCode’, width: 60, editable: false, cellsalign: ‘center’ },
{ text: ‘Aantal lln’, dataField: ‘AantalLeerlingen’, width: 70, editable: false, cellsalign: ‘center’ }
]
});$(“#admintable”).on(‘cellvaluechanged’, function (event) {
var args = event.args;
var datafield = event.args.datafield;if (datafield == ‘ingeleverd’) {
// synchronize with the server – send update command
var rowBoundIndex = args.rowindex + 1;
var newvalue = args.newvalue;
var data = “ID=” + rowBoundIndex + “&ingeleverd=” + newvalue;/*alert(data);*/
$.ajax({
dataType: ‘json’,
url: ‘sql_update_ingeleverd.php’,
cache: false,
data: data,
success: function (data, status, xhr) {
// update command is executed.
commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
// update failed
commit(false);
}
});
}
});$(“#knoppen”).jqxToolBar({
theme: ‘energyblue’,
width: 1150,
height: 50,
/*tools: ‘button | button | button | button | button | button’,*/
tools: ‘button’,
initTools: function (type, index, tool, menuToolIninitialization)
{
switch (index) {
case 0:
tool.jqxButton({ height: 40, width: 140});
tool.text(‘Afdrukken’);tool.on(“click”, function () {
var gridContent = $(“#admintable”).jqxGrid(‘exportdata’, ‘html’);
var newWindow = window.open(”, ”, ‘width=1000, height=800’),
document = newWindow.document.open(),
pageContent =
‘<!DOCTYPE html>\n’ +
‘<style>@page{size:landscape;}</style>’ +
‘<html>\n’ +
‘<head>\n’ +
‘<meta charset=”utf-8″ />\n’ +
‘<title>Voorblad – Dr.Knippenbergcollege</title>\n’ +
‘</head>\n’ +
‘<body>\n’ + gridContent + ‘\n</body>\n</html>’;
document.write(pageContent);
document.close();
newWindow.print();
});
tool.text(‘Afdrukken’);break;
}
}
});$(“#print”).jqxButton();
$(“#print”).click(function () {
var gridContent = $(“#admintable”).jqxGrid(‘exportdata’, ‘html’);
var newWindow = window.open(”, ”, ‘width=1000, height=800’),
document = newWindow.document.open(),
pageContent =
‘<!DOCTYPE html>\n’ +
‘<style>@page{size:landscape;}</style>’ +
‘<html>\n’ +
‘<head>\n’ +
‘<meta charset=”utf-8″ />\n’ +
‘<title>jqWidgets</title>\n’ +
‘</head>\n’ +
‘<body>\n’ + gridContent + ‘\n</body>\n</html>’;
document.write(pageContent);
document.close();
newWindow.print();
});
});
</script></head>
<body>
<!–<div id=”jqxToolBar”></div>–>
<div id=”knoppen”></div>
<div style=’margin-top: 20px;’>
<div style=’margin-left: 10px; float: left;’>
<input type=”button” value=”Afdrukken” id=’print’ />
</div>
</div><div style=”float: left;” id=”admintable”></div>
</form>
</body>
</html> -
AuthorPosts