1<script type="text/x-jquery-tmpl" id="tmpl-item-row-<?= GRAPH_TYPE_NORMAL ?>"> 2 <tr id="items_#{number}" class="sortable"> 3 <!-- icon + hidden --> 4 <?php if ($readonly): ?> 5 <td> 6 <?php else: ?> 7 <td class="<?= ZBX_STYLE_TD_DRAG_ICON ?>"> 8 <div class="<?= ZBX_STYLE_DRAG_ICON ?>"></div> 9 <span class="ui-icon ui-icon-arrowthick-2-n-s move"></span> 10 <?php endif ?> 11 <input type="hidden" id="items_#{number}_gitemid" name="gitemid" value="#{gitemid}"> 12 <input type="hidden" id="items_#{number}_itemid" name="itemid" value="#{itemid}"> 13 <input type="hidden" id="items_#{number}_sortorder" name="sortorder" value="#{sortorder}"> 14 <input type="hidden" id="items_#{number}_flags" name="flags" value="#{flags}"> 15 <input type="hidden" id="items_#{number}_type" name="type" value="<?= GRAPH_ITEM_SIMPLE ?>"> 16 <input type="hidden" id="items_#{number}_drawtype" name="drawtype" value="#{drawtype}"> 17 <input type="hidden" id="items_#{number}_yaxisside" name="yaxisside" value="#{yaxisside}"> 18 </td> 19 20 <!-- row number --> 21 <td> 22 <span id="items_#{number}_number" class="items_number">#{number_nr}:</span> 23 </td> 24 25 <!-- name --> 26 <td> 27 <?php if ($readonly): ?> 28 <span id="items_#{number}_name">#{name}</span> 29 <?php else: ?> 30 <a href="javascript:void(0)"><span id="items_#{number}_name">#{name}</span></a> 31 <?php endif ?> 32 </td> 33 34 <!-- function --> 35 <td> 36 <select id="items_#{number}_calc_fnc" name="calc_fnc"> 37 <option value="<?= CALC_FNC_ALL ?>"><?= _('all') ?></option> 38 <option value="<?= CALC_FNC_MIN ?>"><?= _('min') ?></option> 39 <option value="<?= CALC_FNC_AVG ?>"><?= _('avg') ?></option> 40 <option value="<?= CALC_FNC_MAX ?>"><?= _('max') ?></option> 41 </select> 42 </td> 43 44 <!-- drawtype --> 45 <td> 46 <select name="drawtype"> 47 <?php foreach (graph_item_drawtypes() as $drawtype): ?> 48 <option value="<?= $drawtype ?>"><?= graph_item_drawtype2str($drawtype) ?></option> 49 <?php endforeach ?> 50 </select> 51 </td> 52 53 <!-- yaxisside --> 54 <td> 55 <select name="yaxisside"> 56 <option value="<?= GRAPH_YAXIS_SIDE_LEFT ?>"><?= _('Left') ?></option> 57 <option value="<?= GRAPH_YAXIS_SIDE_RIGHT ?>"><?= _('Right') ?></option> 58 </select> 59 </td> 60 61 <td> 62 <?= (new CColor('color', '#{color}', 'color_#{number}'))->appendColorPickerJs(false) ?> 63 </td> 64 65 <?php if (!$readonly): ?> 66 <td class="<?= ZBX_STYLE_NOWRAP ?>"> 67 <button type="button" class="<?= ZBX_STYLE_BTN_LINK ?>" id="items_#{number}_remove" data-remove="#{number}" onclick="removeItem(this);"><?= _('Remove') ?></button> 68 </td> 69 <?php endif ?> 70 </tr> 71</script> 72 73<script type="text/x-jquery-tmpl" id="tmpl-item-row-<?= GRAPH_TYPE_STACKED ?>"> 74 <tr id="items_#{number}" class="sortable"> 75 <!-- icon + hidden --> 76 <?php if ($readonly): ?> 77 <td> 78 <?php else: ?> 79 <td class="<?= ZBX_STYLE_TD_DRAG_ICON ?>"> 80 <div class="<?= ZBX_STYLE_DRAG_ICON ?>"></div> 81 <span class="ui-icon ui-icon-arrowthick-2-n-s move"></span> 82 <?php endif ?> 83 <input type="hidden" id="items_#{number}_gitemid" name="gitemid" value="#{gitemid}"> 84 <input type="hidden" id="items_#{number}_itemid" name="itemid" value="#{itemid}"> 85 <input type="hidden" id="items_#{number}_sortorder" name="sortorder" value="#{sortorder}"> 86 <input type="hidden" id="items_#{number}_flags" name="flags" value="#{flags}"> 87 <input type="hidden" id="items_#{number}_type" name="type" value="<?= GRAPH_ITEM_SIMPLE ?>"> 88 <input type="hidden" id="items_#{number}_drawtype" name="drawtype" value="#{drawtype}"> 89 <input type="hidden" id="items_#{number}_yaxisside" name="yaxisside" value="#{yaxisside}"> 90 </td> 91 92 <!-- row number --> 93 <td> 94 <span id="items_#{number}_number" class="items_number">#{number_nr}:</span> 95 </td> 96 97 <!-- name --> 98 <td> 99 <?php if ($readonly): ?> 100 <span id="items_#{number}_name">#{name}</span> 101 <?php else: ?> 102 <a href="javascript:void(0)"><span id="items_#{number}_name">#{name}</span></a> 103 <?php endif ?> 104 </td> 105 106 <!-- function --> 107 <td> 108 <select id="items_#{number}_calc_fnc" name="calc_fnc"> 109 <option value="<?= CALC_FNC_MIN ?>"><?= _('min') ?></option> 110 <option value="<?= CALC_FNC_AVG ?>"><?= _('avg') ?></option> 111 <option value="<?= CALC_FNC_MAX ?>"><?= _('max') ?></option> 112 </select> 113 </td> 114 115 <!-- yaxisside --> 116 <td> 117 <select name="yaxisside"> 118 <option value="<?= GRAPH_YAXIS_SIDE_LEFT ?>"><?= _('Left') ?></option> 119 <option value="<?= GRAPH_YAXIS_SIDE_RIGHT ?>"><?= _('Right') ?></option> 120 </select> 121 </td> 122 123 <td> 124 <?= (new CColor('color', '#{color}', 'color_#{number}'))->appendColorPickerJs(false) ?> 125 </td> 126 127 <?php if (!$readonly): ?> 128 <td class="<?= ZBX_STYLE_NOWRAP ?>"> 129 <button type="button" class="<?= ZBX_STYLE_BTN_LINK ?>" id="items_#{number}_remove" data-remove="#{number}" onclick="removeItem(this);"><?= _('Remove') ?></button> 130 </td> 131 <?php endif ?> 132 </tr> 133</script> 134 135<script type="text/x-jquery-tmpl" id="tmpl-item-row-<?= GRAPH_TYPE_PIE ?>"> 136 <tr id="items_#{number}" class="sortable"> 137 <!-- icon + hidden --> 138 <?php if ($readonly): ?> 139 <td> 140 <?php else: ?> 141 <td class="<?= ZBX_STYLE_TD_DRAG_ICON ?>"> 142 <div class="<?= ZBX_STYLE_DRAG_ICON ?>"></div> 143 <span class="ui-icon ui-icon-arrowthick-2-n-s move"></span> 144 <?php endif ?> 145 <input type="hidden" id="items_#{number}_gitemid" name="gitemid" value="#{gitemid}"> 146 <input type="hidden" id="items_#{number}_itemid" name="itemid" value="#{itemid}"> 147 <input type="hidden" id="items_#{number}_sortorder" name="sortorder" value="#{sortorder}"> 148 <input type="hidden" id="items_#{number}_flags" name="flags" value="#{flags}"> 149 <input type="hidden" id="items_#{number}_type" name="type" value="<?= GRAPH_ITEM_SIMPLE ?>"> 150 <input type="hidden" id="items_#{number}_drawtype" name="drawtype" value="#{drawtype}"> 151 <input type="hidden" id="items_#{number}_yaxisside" name="yaxisside" value="#{yaxisside}"> 152 </td> 153 154 <!-- row number --> 155 <td> 156 <span id="items_#{number}_number" class="items_number">#{number_nr}:</span> 157 </td> 158 159 <!-- name --> 160 <td> 161 <?php if ($readonly): ?> 162 <span id="items_#{number}_name">#{name}</span> 163 <?php else: ?> 164 <a href="javascript:void(0)"><span id="items_#{number}_name">#{name}</span></a> 165 <?php endif ?> 166 </td> 167 168 <!-- type --> 169 <td> 170 <select name="type"> 171 <option value="<?= GRAPH_ITEM_SIMPLE ?>"><?= _('Simple') ?></option> 172 <option value="<?= GRAPH_ITEM_SUM ?>"><?= _('Graph sum') ?></option> 173 </select> 174 </td> 175 176 <!-- function --> 177 <td> 178 <select id="items_#{number}_calc_fnc" name="calc_fnc"> 179 <option value="<?= CALC_FNC_MIN ?>"><?= _('min') ?></option> 180 <option value="<?= CALC_FNC_AVG ?>"><?= _('avg') ?></option> 181 <option value="<?= CALC_FNC_MAX ?>"><?= _('max') ?></option> 182 <option value="<?= CALC_FNC_LST ?>"><?= _('last') ?></option> 183 </select> 184 </td> 185 186 <td> 187 <?= (new CColor('color', '#{color}', 'color_#{number}'))->appendColorPickerJs(false) ?> 188 </td> 189 190 <?php if (!$readonly): ?> 191 <td class="<?= ZBX_STYLE_NOWRAP ?>"> 192 <button type="button" class="<?= ZBX_STYLE_BTN_LINK ?>" id="items_#{number}_remove" data-remove="#{number}" onclick="removeItem(this);"><?= _('Remove') ?></button> 193 </td> 194 <?php endif ?> 195 </tr> 196</script> 197 198<script type="text/x-jquery-tmpl" id="tmpl-item-row-<?= GRAPH_TYPE_EXPLODED ?>"> 199 <tr id="items_#{number}" class="sortable"> 200 <!-- icon + hidden --> 201 <?php if ($readonly): ?> 202 <td> 203 <?php else: ?> 204 <td class="<?= ZBX_STYLE_TD_DRAG_ICON ?>"> 205 <div class="<?= ZBX_STYLE_DRAG_ICON ?>"></div> 206 <span class="ui-icon ui-icon-arrowthick-2-n-s move"></span> 207 <?php endif ?> 208 <input type="hidden" id="items_#{number}_gitemid" name="gitemid" value="#{gitemid}"> 209 <input type="hidden" id="items_#{number}_itemid" name="itemid" value="#{itemid}"> 210 <input type="hidden" id="items_#{number}_sortorder" name="sortorder" value="#{sortorder}"> 211 <input type="hidden" id="items_#{number}_flags" name="flags" value="#{flags}"> 212 <input type="hidden" id="items_#{number}_type" name="type" value="<?= GRAPH_ITEM_SIMPLE ?>"> 213 <input type="hidden" id="items_#{number}_drawtype" name="drawtype" value="#{drawtype}"> 214 <input type="hidden" id="items_#{number}_yaxisside" name="yaxisside" value="#{yaxisside}"> 215 </td> 216 217 <!-- row number --> 218 <td> 219 <span id="items_#{number}_number" class="items_number">#{number_nr}:</span> 220 </td> 221 222 <!-- name --> 223 <td> 224 <?php if ($readonly): ?> 225 <span id="items_#{number}_name">#{name}</span> 226 <?php else: ?> 227 <a href="javascript:void(0)"><span id="items_#{number}_name">#{name}</span></a> 228 <?php endif ?> 229 </td> 230 231 <!-- type --> 232 <td> 233 <select name="type"> 234 <option value="<?= GRAPH_ITEM_SIMPLE ?>"><?= _('Simple') ?></option> 235 <option value="<?= GRAPH_ITEM_SUM ?>"><?= _('Graph sum') ?></option> 236 </select> 237 </td> 238 239 <!-- function --> 240 <td> 241 <select id="items_#{number}_calc_fnc" name="calc_fnc"> 242 <option value="<?= CALC_FNC_MIN ?>"><?= _('min') ?></option> 243 <option value="<?= CALC_FNC_AVG ?>"><?= _('avg') ?></option> 244 <option value="<?= CALC_FNC_MAX ?>"><?= _('max') ?></option> 245 <option value="<?= CALC_FNC_LST ?>"><?= _('last') ?></option> 246 </select> 247 </td> 248 249 <td> 250 <?= (new CColor('color', '#{color}', 'color_#{number}'))->appendColorPickerJs(false) ?> 251 </td> 252 253 <?php if (!$readonly): ?> 254 <td class="<?= ZBX_STYLE_NOWRAP ?>"> 255 <button type="button" class="<?= ZBX_STYLE_BTN_LINK ?>" id="items_#{number}_remove" data-remove="#{number}" onclick="removeItem(this);"><?= _('Remove') ?></button> 256 </td> 257 <?php endif ?> 258 </tr> 259</script> 260 261<script type="text/javascript"> 262 colorPalette.setThemeColors(<?= CJs::encodeJson(explode(',', getUserGraphTheme()['colorpalette'])) ?>); 263 var graphs = JSON.parse('<?= json_encode([ 264 'graphtype' => $data['graphtype'], 265 'readonly' => $readonly, 266 'hostid' => $data['hostid'], 267 'groupid' => $data['groupid'], 268 'is_template' => $data['is_template'], 269 'normal_only' => $data['normal_only'], 270 'parent_discoveryid' => $data['parent_discoveryid'], 271 'CALC_FNC_AVG' => CALC_FNC_AVG, 272 'ZBX_FLAG_DISCOVERY_PROTOTYPE' => ZBX_FLAG_DISCOVERY_PROTOTYPE, 273 'ZBX_STYLE_DRAG_ICON' => ZBX_STYLE_DRAG_ICON, 274 'GRAPH_YAXIS_TYPE_CALCULATED' => GRAPH_YAXIS_TYPE_CALCULATED, 275 'GRAPH_YAXIS_TYPE_FIXED' => GRAPH_YAXIS_TYPE_FIXED, 276 'GRAPH_TYPE_NORMAL' => GRAPH_TYPE_NORMAL, 277 'GRAPH_TYPE_PIE' => GRAPH_TYPE_PIE, 278 'GRAPH_TYPE_EXPLODED' => GRAPH_TYPE_EXPLODED 279 ]) ?>'); 280 281 function loadItem(number, gitemid, itemid, name, type, calc_fnc, drawtype, yaxisside, color, flags) { 282 var item = { 283 number: number, 284 number_nr: number + 1, 285 gitemid: gitemid, 286 itemid: itemid, 287 calc_fnc: calc_fnc, 288 color: color, 289 sortorder: number, 290 flags: flags, 291 name: name 292 }, 293 itemTpl = new Template(jQuery('#tmpl-item-row-' + graphs.graphtype).html()), 294 $row = jQuery(itemTpl.evaluate(item)); 295 296 $row.find('[name="type"]').val(type); 297 $row.find('[name="drawtype"]').val(drawtype); 298 $row.find('[name="yaxisside"]').val(yaxisside); 299 300 var $calc_fnc = $row.find('[name="calc_fnc"]'); 301 $calc_fnc.val(calc_fnc); 302 if ($calc_fnc[0].selectedIndex < 0) { 303 $calc_fnc[0].selectedIndex = 0; 304 } 305 306 jQuery('#itemButtonsRow').before($row); 307 $row.find('.input-color-picker input').colorpicker(); 308 309 colorPalette.incrementNextColor(); 310 311 !graphs.readonly && rewriteNameLinks(); 312 } 313 314 function addPopupValues(list) { 315 if (!isset('object', list) || list.object != 'itemid') { 316 return false; 317 } 318 var itemTpl = new Template(jQuery('#tmpl-item-row-' + graphs.graphtype).html()), 319 $row; 320 321 for (var i = 0; i < list.values.length; i++) { 322 var number = jQuery('#itemsTable tr.sortable').length, 323 item = { 324 number: number, 325 number_nr: number + 1, 326 gitemid: null, 327 itemid: list.values[i].itemid, 328 calc_fnc: null, 329 drawtype: 0, 330 yaxisside: 0, 331 sortorder: number, 332 flags: (typeof list.values[i].flags === 'undefined') ? 0 : list.values[i].flags, 333 color: colorPalette.getNextColor(), 334 name: list.values[i].name 335 }; 336 $row = jQuery(itemTpl.evaluate(item)); 337 338 $row.find('[name="calc_fnc"]').val(graphs.CALC_FNC_AVG); 339 jQuery('#itemButtonsRow').before($row); 340 $row.find('.input-color-picker input').colorpicker(); 341 } 342 343 if (!graphs.readonly) { 344 activateSortable(); 345 rewriteNameLinks(); 346 } 347 } 348 349 function getOnlyHostParam() { 350 return graphs.is_template 351 ? {only_hostid: graphs.hostid} 352 : {real_hosts: '1'}; 353 } 354 355 function rewriteNameLinks() { 356 var size = jQuery('#itemsTable tr.sortable').length; 357 358 for (var i = 0; i < size; i++) { 359 var popup_options = { 360 srcfld1: 'itemid', 361 srcfld2: 'name', 362 dstfrm: 'graphForm', 363 dstfld1: 'items_' + i + '_itemid', 364 dstfld2: 'items_' + i + '_name', 365 numeric: 1, 366 with_webitems: 1, 367 writeonly: 1 368 }; 369 if (jQuery('#items_' + i + '_flags').val() == graphs.ZBX_FLAG_DISCOVERY_PROTOTYPE) { 370 popup_options['srctbl'] = 'item_prototypes', 371 popup_options['srcfld3'] = 'flags', 372 popup_options['dstfld3'] = 'items_' + i + '_flags', 373 popup_options['parent_discoveryid'] = graphs.parent_discoveryid; 374 } 375 else { 376 popup_options['srctbl'] = 'items'; 377 } 378 379 if (graphs.normal_only !== '') { 380 popup_options['normal_only'] = '1'; 381 } 382 383 if (!graphs.parent_discoveryid && graphs.groupid && graphs.hostid) { 384 popup_options['groupid'] = graphs.groupid, 385 popup_options['hostid'] = graphs.hostid; 386 } 387 388 var nameLink = 'PopUp("popup.generic",' 389 + 'jQuery.extend('+ JSON.stringify(popup_options) +',getOnlyHostParam()), null, this);'; 390 jQuery('#items_' + i + '_name').attr('onclick', nameLink); 391 } 392 } 393 394 function removeItem(obj) { 395 var number = jQuery(obj).data('remove'); 396 397 jQuery('#items_' + number).find('*').remove(); 398 jQuery('#items_' + number).remove(); 399 400 recalculateSortOrder(); 401 !graphs.readonly && activateSortable(); 402 } 403 404 function recalculateSortOrder() { 405 var i = 0; 406 407 // rewrite ids, set "tmp" prefix 408 jQuery('#itemsTable tr.sortable').find('*[id]').each(function() { 409 var obj = jQuery(this); 410 411 obj.attr('id', 'tmp' + obj.attr('id')); 412 }); 413 414 jQuery('#itemsTable tr.sortable').each(function() { 415 var obj = jQuery(this); 416 417 obj.attr('id', 'tmp' + obj.attr('id')); 418 }); 419 420 // rewrite ids to new order 421 jQuery('#itemsTable tr.sortable').each(function() { 422 var obj = jQuery(this); 423 424 // rewrite ids in input fields 425 obj.find('*[id]').each(function() { 426 var obj = jQuery(this), 427 id = obj.attr('id').substring(3), 428 part1 = id.substring(0, id.indexOf('items_') + 5), 429 part2 = id.substring(id.indexOf('items_') + 6); 430 431 part2 = part2.substring(part2.indexOf('_') + 1); 432 433 obj.attr('id', part1 + '_' + i + '_' + part2); 434 435 // set sortorder 436 if (part2 === 'sortorder') { 437 obj.val(i); 438 } 439 }); 440 441 // rewrite ids in <tr> 442 var id = obj.attr('id').substring(3), 443 part1 = id.substring(0, id.indexOf('items_') + 5); 444 445 obj.attr('id', part1 + '_' + i); 446 447 i++; 448 }); 449 450 i = 0; 451 452 jQuery('#itemsTable tr.sortable').each(function() { 453 // set row number 454 jQuery('.items_number', this).text((i + 1) + ':'); 455 456 // set remove number 457 jQuery('#items_' + i + '_remove').data('remove', i); 458 459 i++; 460 }); 461 462 !graphs.readonly && rewriteNameLinks(); 463 } 464 465 function initSortable() { 466 var itemsTable = jQuery('#itemsTable'), 467 itemsTableWidth = itemsTable.width(), 468 itemsTableColumns = jQuery('#itemsTable .header td'), 469 itemsTableColumnWidths = []; 470 471 itemsTableColumns.each(function() { 472 itemsTableColumnWidths[itemsTableColumnWidths.length] = jQuery(this).width(); 473 }); 474 475 itemsTable.sortable({ 476 disabled: (jQuery('#itemsTable tr.sortable').length < 2), 477 items: 'tbody tr.sortable', 478 axis: 'y', 479 containment: 'parent', 480 cursor: IE ? 'move' : 'grabbing', 481 handle: 'div.' + graphs.ZBX_STYLE_DRAG_ICON, 482 tolerance: 'pointer', 483 opacity: 0.6, 484 update: recalculateSortOrder, 485 create: function() { 486 // force not to change table width 487 itemsTable.width(itemsTableWidth); 488 }, 489 helper: function(e, ui) { 490 ui.children().each(function(i) { 491 var td = jQuery(this); 492 493 td.width(itemsTableColumnWidths[i]); 494 }); 495 496 // when dragging element on safari, it jumps out of the table 497 if (SF) { 498 // move back draggable element to proper position 499 ui.css('left', (ui.offset().left - 2) + 'px'); 500 } 501 502 itemsTableColumns.each(function(i) { 503 jQuery(this).width(itemsTableColumnWidths[i]); 504 }); 505 506 return ui; 507 }, 508 start: function(e, ui) { 509 jQuery(ui.placeholder).height(jQuery(ui.helper).height()); 510 } 511 }); 512 } 513 514 function activateSortable() { 515 jQuery('#itemsTable').sortable({disabled: (jQuery('#itemsTable tr.sortable').length < 2)}); 516 } 517 518 jQuery(function($) { 519 $('#tabs').on('tabsactivate', function(event, ui) { 520 if (ui.newPanel.attr('id') === 'previewTab') { 521 var preview_chart = $('#previewChart'), 522 src = new Curl('chart3.php'); 523 524 if (preview_chart.find('.preloader').length) { 525 return false; 526 } 527 528 src.setArgument('period', '3600'); 529 src.setArgument('name', $('#name').val()); 530 src.setArgument('width', $('#width').val()); 531 src.setArgument('height', $('#height').val()); 532 src.setArgument('graphtype', $('#graphtype').val()); 533 src.setArgument('legend', $('#show_legend').is(':checked') ? 1 : 0); 534 535 if (graphs.graphtype == graphs.GRAPH_TYPE_PIE || graphs.graphtype == graphs.GRAPH_TYPE_EXPLODED) { 536 src.setPath('chart7.php'); 537 src.setArgument('graph3d', $('#show_3d').is(':checked') ? 1 : 0); 538 } 539 else { 540 if (graphs.graphtype == graphs.GRAPH_TYPE_NORMAL) { 541 src.setArgument('percent_left', $('#percent_left').val()); 542 src.setArgument('percent_right', $('#percent_right').val()); 543 } 544 src.setArgument('ymin_type', $('#ymin_type').val()); 545 src.setArgument('ymax_type', $('#ymax_type').val()); 546 src.setArgument('yaxismin', $('#yaxismin').val()); 547 src.setArgument('yaxismax', $('#yaxismax').val()); 548 src.setArgument('ymin_itemid', $('#ymin_itemid').val()); 549 src.setArgument('ymax_itemid', $('#ymax_itemid').val()); 550 src.setArgument('showworkperiod', $('#show_work_period').is(':checked') ? 1 : 0); 551 src.setArgument('showtriggers', $('#show_triggers').is(':checked') ? 1 : 0); 552 } 553 554 $('#itemsTable tr.sortable').each(function(i, node) { 555 var short_fmt = []; 556 $(node).find('*[name]').each(function(_, input) { 557 if (!$.isEmptyObject(input) && input.name != null) { 558 short_fmt.push((input.name).substr(0, 2) + ':' + input.value); 559 } 560 }); 561 src.setArgument('i[' + i + ']', short_fmt.join(',')); 562 }); 563 564 var image = $('img', preview_chart); 565 566 if (image.length != 0) { 567 image.remove(); 568 } 569 570 preview_chart.append($('<div>').addClass('preloader')); 571 572 $('<img />') 573 .attr('src', src.getUrl()) 574 .on('load', function() { 575 preview_chart.html($(this)); 576 }); 577 } 578 }); 579 580 if (graphs.readonly) { 581 $('#itemsTable').sortable({disabled: true}).find('input').prop('readonly', true); 582 $('select', '#itemsTable').prop('disabled', true); 583 584 var size = $('#itemsTable tr.sortable').length; 585 586 for (var i = 0; i < size; i++) { 587 $('#items_' + i + '_color').removeAttr('onchange'); 588 $('#lbl_items_' + i + '_color').removeAttr('onclick'); 589 } 590 } 591 592 // Y axis min clean unused fields 593 $('#ymin_type').change(function() { 594 switch ($(this).val()) { 595 case graphs.GRAPH_YAXIS_TYPE_CALCULATED: 596 $('#yaxismin').val(''); 597 $('#ymin_name').val(''); 598 $('#ymin_itemid').val('0'); 599 break; 600 601 case graphs.GRAPH_YAXIS_TYPE_FIXED: 602 $('#ymin_name').val(''); 603 $('#ymin_itemid').val('0'); 604 break; 605 606 default: 607 $('#yaxismin').val(''); 608 } 609 610 $('form[name="graphForm"]').submit(); 611 }); 612 613 // Y axis max clean unused fields 614 $('#ymax_type').change(function() { 615 switch ($(this).val()) { 616 case graphs.GRAPH_YAXIS_TYPE_CALCULATED: 617 $('#yaxismax').val(''); 618 $('#ymax_name').val(''); 619 $('#ymax_itemid').val('0'); 620 break; 621 622 case graphs.GRAPH_YAXIS_TYPE_FIXED: 623 $('#ymax_name').val(''); 624 $('#ymax_itemid').val('0'); 625 break; 626 627 default: 628 $('#yaxismax').val(''); 629 } 630 631 $('form[name="graphForm"]').submit(); 632 }); 633 634 var $form = $('form[name="graphForm"]'); 635 $form.on('submit', function(e) { 636 $form 637 .find('tr.sortable[id^="items_"]') 638 .each(function(i, node) { 639 var item = {}; 640 641 $(node) 642 .find('input, select') 643 .each(function(_, node) { 644 item[node.name] = node.value; 645 }) 646 .remove(); 647 648 item.sortorder = i + 1; 649 650 $form.append($('<input />', { 651 type: 'hidden', 652 name: 'items[' + i + ']', 653 value: JSON.stringify(item) 654 })); 655 }) 656 }); 657 658 !graphs.readonly && initSortable(); 659 }); 660</script> 661