163 theme: theme, |
163 theme: theme, |
164 showstatusbar: true, |
164 showstatusbar: true, |
165 localization: getLocalization(), |
165 localization: getLocalization(), |
166 renderstatusbar: function (statusbar) { |
166 renderstatusbar: function (statusbar) { |
167 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); |
167 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); |
168 var addButton = $("<div style='float: right; margin-right: 15px;'><img style='position: relative; margin-top: 2px;' src='images/add.png'/><span style='margin-left: 4px; position: relative; top: -3px;'>Add</span></div>"); |
168 var addButton = $("<div style='float: right; margin-right: 15px;'><img style='position: relative; margin-top: 2px;' src='images/add.png'/><span style='margin-left: 4px; position: relative; top: -3px;'>Nieuw</span></div>"); |
169 container.append(addButton); |
169 container.append(addButton); |
170 statusbar.append(container); |
170 statusbar.append(container); |
171 addButton.jqxButton({ width: 60, height: 20 }); |
171 addButton.jqxButton({ theme: theme, width: 120, height: 20 }); |
172 // add new row. |
172 // add new row. |
173 addButton.click(function (event) { |
173 addButton.click(function (event) { |
174 editrow = -1; |
174 editrow = -1; |
175 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); |
175 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); |
176 $("#name").val(''); |
176 $("#name").val(''); |
197 }); |
197 }); |
198 }, |
198 }, |
199 filterable: true, |
199 filterable: true, |
200 filtermode: 'excel', |
200 filtermode: 'excel', |
201 columns: [ |
201 columns: [ |
202 { text: 'Vergistbaar product', datafield: 'name', width: 250 }, |
202 { text: 'Vergistbaar product', datafield: 'name', width: 270 }, |
203 { text: 'Soort', datafield: 'type', align: 'center', cellsalign: 'center', width: 90 }, |
203 { text: 'Soort', datafield: 'type', align: 'center', cellsalign: 'center', width: 90 }, |
204 { text: 'Mout type', datafield: 'graintype', align: 'center', cellsalign: 'center', width: 90 }, |
204 { text: 'Mout type', datafield: 'graintype', align: 'center', cellsalign: 'center', width: 90 }, |
205 { text: 'Herkomst', datafield: 'origin', width: 150 }, |
205 { text: 'Herkomst', datafield: 'origin', width: 150 }, |
206 { text: 'Producent', datafield: 'supplier', width: 150 }, |
206 { text: 'Producent', datafield: 'supplier', width: 200 }, |
207 { text: 'Kleur', datafield: 'color', width: 70, align: 'right', cellsalign: 'right' }, |
207 { text: 'Kleur', datafield: 'color', width: 70, align: 'right', cellsalign: 'right' }, |
208 { text: 'Opbrengst', datafield: 'yield', width: 70, align: 'right', cellsalign: 'right', cellsformat: 'p1' }, |
208 { text: 'Opbrengst', datafield: 'yield', width: 70, align: 'right', cellsalign: 'right', cellsformat: 'p1' }, |
209 { text: 'Vooraad', datafield: 'inventory', width: 70, align: 'right', cellsalign: 'right', cellsformat: 'f3' }, |
209 { text: 'Vooraad', datafield: 'inventory', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f3' }, |
210 { text: 'Prijs', datafield: 'cost', width: 70, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, |
210 { text: 'Prijs', datafield: 'cost', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, |
211 { text: 'Edit', datafield: 'Edit', width: 120, align: 'center', columntype: 'button', cellsrenderer: function () { |
211 { text: 'Wijzig', datafield: 'Edit', width: 120, align: 'center', columntype: 'button', cellsrenderer: function () { |
212 return "Edit"; |
212 return "Wijzig"; |
213 }, buttonclick: function (row) { |
213 }, buttonclick: function (row) { |
214 // open the popup window when the user clicks a button. |
214 // open the popup window when the user clicks a button. |
215 editrow = row; |
215 editrow = row; |
216 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); |
216 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); |
217 // get the clicked row's data and initialize the input fields. |
217 // get the clicked row's data and initialize the input fields. |