--- a/www/js/profile_mash.js Sat Jan 26 22:27:28 2019 +0100
+++ b/www/js/profile_mash.js Sun Jan 27 17:39:26 2019 +0100
@@ -43,7 +43,12 @@
$(document).ready(function () {
+
+ var steprow = 0;
+ var stepData = {};
+ var dataRecord = {};
var url = "includes/db_profile_mash.php";
+
// tooltips
$("#name").jqxTooltip({ content: 'De naam voor dit maisch profiel.' });
$("#notes").jqxTooltip({ content: 'De uitgebreide opmerkingen over dit maisch profiel.' });
@@ -111,6 +116,26 @@
});
}
};
+ // Initialize the input fields.
+ $("#m_step_name").jqxInput({ theme: theme, width: 320, height: 23 });
+ $("#m_step_type").jqxDropDownList({
+ theme: theme,
+ source: MashStepTypeAdapter,
+ valueMember: 'id',
+ displayMember: 'nl',
+ width: 180,
+ height: 23,
+ autoDropDownHeight: true
+ });
+ $("#m_step_temp").jqxNumberInput( Spin1dec5 );
+ $("#m_step_temp").jqxNumberInput({ Min: 30, Max: 80 });
+ $("#m_end_temp").jqxNumberInput( Spin1dec5 );
+ $("#m_end_temp").jqxNumberInput({ Min: 30, Max: 80 });
+ $("#m_step_time").jqxNumberInput( PosInt );
+ $("#m_step_time").jqxNumberInput({ Min: 1, Max: 120 });
+ $("#m_ramp_time").jqxNumberInput( PosInt );
+ $("#m_ramp_time").jqxNumberInput({ Min: 1, Max: 30 });
+
var dataAdapter = new $.jqx.dataAdapter(source);
// Inline steps editor
var editsteps = function (data) {
@@ -144,13 +169,11 @@
};
var stepAdapter = new $.jqx.dataAdapter(stepSource);
$("#grid").jqxGrid({
- width: 800,
+ width: 1020,
height: 330,
source: stepAdapter,
theme: theme,
selectionmode: 'singlerow',
- editmode: 'selectedcell',
- editable: true,
localization: getLocalization(),
showtoolbar: true,
rendertoolbar: function (toolbar) {
@@ -158,7 +181,7 @@
var container = $("<div style='margin: 5px;'></div>");
toolbar.append(container);
container.append('<input style="margin-left: 100px;" id="addrowbutton" type="button" value="Nieuwe stap" />');
- container.append('<input style="margin-left: 290px;" id="deleterowbutton" type="button" value="Verwijder stap" />');
+ container.append('<input style="margin-left: 450px;" id="deleterowbutton" type="button" value="Verwijder stap" />');
$("#addrowbutton").jqxButton({ template: "primary", theme: theme, width: 150 });
$("#deleterowbutton").jqxButton({ template: "primary", theme: theme, width: 150 });
// create new row.
@@ -178,53 +201,32 @@
},
columns: [
{ text: 'Stap naam', datafield: 'step_name' },
- { text: 'Stap type', datafield: 'step_type', width: 150, columntype: 'dropdownlist',
- createeditor: function (row, cellvalue, editor, celltext, cellwidth, cellheight) {
- var dataSource = [ "0", "1", "2" ];
- editor.jqxDropDownList({
- source: dataSource,
- dropDownHeight: 95,
- dropDownWidth: 120
- });
+ { text: 'Stap type', datafield: 'step_type', width: 150,
+ cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) {
+ return "<div style='margin: 4px;'>" + MashStepTypeData[value].nl + "</div>";
}
},
- { text: 'Temperatuur', datafield: 'step_temp', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1',
- validation: function (cell, value) {
- if (value < 35 || value > 80) {
- return { result: false, message: "De temperatuur moet tussen 35 en 80 zijn." };
- }
- return true;
- }
- },
- { text: 'Eind temp', datafield: 'end_temp', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1',
- validation: function (cell, value) {
- if (value < 35 || value > 80) {
- return { result: false, message: "De temperatuur moet tussen 35 en 80 zijn." };
+ { text: 'Begin °C', datafield: 'step_temp', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' },
+ { text: 'Eind °C', datafield: 'end_temp', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' },
+ { text: 'Rusttijd', datafield: 'step_time', width: 80, align: 'right', cellsalign: 'right' },
+ { text: 'Opwarmtijd', datafield: 'ramp_time', width: 80, align: 'right', cellsalign: 'right' },
+ { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 100, align: 'center', cellsrenderer: function () {
+ return "Wijzig";
+ }, buttonclick: function (row) {
+ steprow = row;
+ stepData = $("#grid").jqxGrid('getrowdata', steprow);
+ $("#m_step_name").val(stepData.step_name);
+ $("#m_step_type").val(stepData.step_type);
+ $("#m_step_temp").val(stepData.step_temp);
+ $("#m_end_temp").val(stepData.end_temp);
+ $("#m_step_time").val(stepData.step_time);
+ $("#m_ramp_time").val(stepData.ramp_time);
+ // show the popup window.
+ $("#popupStep").jqxWindow('open');
}
- return true;
- }
- },
- { text: 'Rusttijd', datafield: 'step_time', width: 80, align: 'right', cellsalign: 'right',
- validation: function (cell, value) {
- if (value < 1 || value > 360) {
- return { result: false, message: "De tijd moet tussen 1 en 360 zijn." };
- }
- return true;
- }
- },
- { text: 'Staptijd', datafield: 'ramp_time', width: 80, align: 'right', cellsalign: 'right',
- validation: function (cell, value) {
- if (value < 1 || value > 60) {
- return { result: false, message: "De tijd moet tussen 1 en 60 zijn." };
- }
- return true;
- }
- }
+ }
]
});
- $("#grid").on('cellendedit', function (event) {
- $('#grid').jqxGrid('sortby', 'step_temp', 'asc');
- });
};
// initialize the input fields.
@@ -248,7 +250,6 @@
// add new row.
addButton.click(function (event) {
editrow = -1;
- $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } });
$("#name").val('Nieuw maisch schema');
$("#notes").val('');
editsteps('');
@@ -263,9 +264,7 @@
{ text: 'Wijzig', datafield: 'Edit', width: 100, align: 'center', columntype: 'button', cellsrenderer: function () {
return "Wijzig";
}, buttonclick: function (row) {
- // open the popup window when the user clicks a button.
editrow = row;
- $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } });
// get the clicked row's data and initialize the input fields.
var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);
$("#name").val(dataRecord.name);
@@ -281,6 +280,7 @@
$("#popupWindow").jqxWindow({
width: 1050,
height: 580,
+ position: { x: 110, y: 30 },
resizable: false,
theme: theme,
isModal: true,
@@ -291,6 +291,31 @@
$("#popupWindow").on('open', function () {
$("#name").jqxInput('selectAll');
});
+ $("#popupStep").jqxWindow({
+ width: 800,
+ height: 300,
+ position: { x: 230, y: 100 },
+ resizable: false,
+ theme: theme,
+ isModal: true,
+ autoOpen: false,
+ cancelButton: $("#Ready"),
+ modalOpacity: 0.40
+ });
+
+ // step detail popup update values.
+ $("#Ready").jqxButton({ template: "success", width: '90px', theme: theme });
+ $("#Ready").click(function () {
+ $("#grid").jqxGrid('setcellvalue', steprow, 'step_name', $("#m_step_name").val());
+ $("#grid").jqxGrid('setcellvalue', steprow, 'step_type', $("#m_step_type").val());
+ $("#grid").jqxGrid('setcellvalue', steprow, 'step_temp', $("#m_step_temp").val());
+ $("#grid").jqxGrid('setcellvalue', steprow, 'end_temp', $("#m_end_temp").val());
+ $("#grid").jqxGrid('setcellvalue', steprow, 'step_time', $("#m_step_time").val());
+ $("#grid").jqxGrid('setcellvalue', steprow, 'ramp_time', $("#m_ramp_time").val());
+ $('#grid').jqxGrid('sortby', 'step_temp', 'asc');
+ });
+
+ // mash profile popup.
$("#Delete").jqxButton({ template: "danger", width: '90px', theme: theme });
$("#Delete").click(function () {
if (editrow >= 0) {