phpmyadmin/js/tbl_select.js

   1 /* vim: set expandtab sw=4 ts=4 sts=4: */
   2 /**
   3  * @fileoverview JavaScript functions used on tbl_select.php
   4  *
   5  * @requires    jQuery
   6  * @requires    js/functions.js
   7  */
   8
   9 /**
  10  * Ajax event handlers for this page
  11  *
  12  * Actions ajaxified here:
  13  * Table search
  14  */
  15
  16 /**
  17  * Checks if given data-type is numeric or date.
  18  *
  19  * @param string data_type Column data-type
  20  *
  21  * @return bool|string
  22  */
  23 function PMA_checkIfDataTypeNumericOrDate(data_type)
  24 {
  25     // To test for numeric data-types.
  26     var numeric_re = new RegExp(
  27         'TINYINT|SMALLINT|MEDIUMINT|INT|BIGINT|DECIMAL|FLOAT|DOUBLE|REAL',
  28         'i'
  29     );
  30
  31     // To test for date data-types.
  32     var date_re = new RegExp(
  33         'DATETIME|DATE|TIMESTAMP|TIME|YEAR',
  34         'i'
  35     );
  36
  37     // Return matched data-type
  38     if (numeric_re.test(data_type)) {
  39         return numeric_re.exec(data_type)[0];
  40     }
  41
  42     if (date_re.test(data_type)) {
  43         return date_re.exec(data_type)[0];
  44     }
  45
  46     return false;
  47 }
  48
  49 /**
  50  * Unbind all event handlers before tearing down a page
  51  */
  52 AJAX.registerTeardown('tbl_select.js', function () {
  53     $('#togglesearchformlink').unbind('click');
  54     $(document).off('submit', "#tbl_search_form.ajax");
  55     $('select.geom_func').unbind('change');
  56     $(document).off('click', 'span.open_search_gis_editor');
  57     $('body').off('click', 'select[name*="criteriaColumnOperators"]');
  58 });
  59
  60 AJAX.registerOnload('tbl_select.js', function () {
  61     /**
  62      * Prepare a div containing a link, otherwise it's incorrectly displayed
  63      * after a couple of clicks
  64      */
  65     $('<div id="togglesearchformdiv"><a id="togglesearchformlink"></a></div>')
  66      .insertAfter('#tbl_search_form')
  67      // don't show it until we have results on-screen
  68      .hide();
  69
  70     $('#togglesearchformlink')
  71         .html(PMA_messages.strShowSearchCriteria)
  72         .bind('click', function () {
  73             var $link = $(this);
  74             $('#tbl_search_form').slideToggle();
  75             if ($link.text() == PMA_messages.strHideSearchCriteria) {
  76                 $link.text(PMA_messages.strShowSearchCriteria);
  77             } else {
  78                 $link.text(PMA_messages.strHideSearchCriteria);
  79             }
  80             // avoid default click action
  81             return false;
  82         });
  83
  84     /**
  85      * Ajax event handler for Table search
  86      */
  87     $(document).on('submit', "#tbl_search_form.ajax", function (event) {
  88         var unaryFunctions = [
  89             'IS NULL',
  90             'IS NOT NULL',
  91             "= ''",
  92             "!= ''"
  93         ];
  94
  95         var geomUnaryFunctions = [
  96             'IsEmpty',
  97             'IsSimple',
  98             'IsRing',
  99             'IsClosed',
 100         ];
 101
 102         // jQuery object to reuse
 103         var $search_form = $(this);
 104         event.preventDefault();
 105
 106         // empty previous search results while we are waiting for new results
 107         $("#sqlqueryresultsouter").empty();
 108         var $msgbox = PMA_ajaxShowMessage(PMA_messages.strSearching, false);
 109
 110         PMA_prepareForAjaxRequest($search_form);
 111
 112         var values = {};
 113         $search_form.find(':input').each(function () {
 114             var $input = $(this);
 115             if ($input.attr('type') == 'checkbox' || $input.attr('type') == 'radio') {
 116                 if ($input.is(':checked')) {
 117                     values[this.name] = $input.val();
 118                 }
 119             } else {
 120                 values[this.name] = $input.val();
 121             }
 122         });
 123         var columnCount = $('select[name="columnsToDisplay[]"] option').length;
 124         // Submit values only for the columns that have unary column operator or a search criteria
 125         for (var a = 0; a < columnCount; a++) {
 126             if ($.inArray(values['criteriaColumnOperators[' + a + ']'], unaryFunctions) >= 0) {
 127                 continue;
 128             }
 129
 130             if (values['geom_func[' + a + ']'] &&
 131                 $.isArray(values['geom_func[' + a + ']'], geomUnaryFunctions) >= 0) {
 132                 continue;
 133             }
 134
 135             if (values['criteriaValues[' + a + ']'] === '' || values['criteriaValues[' + a + ']'] === null) {
 136                 delete values['criteriaValues[' + a + ']'];
 137                 delete values['criteriaColumnOperators[' + a + ']'];
 138                 delete values['criteriaColumnNames[' + a + ']'];
 139                 delete values['criteriaColumnTypes[' + a + ']'];
 140                 delete values['criteriaColumnCollations[' + a + ']'];
 141             }
 142         }
 143         // If all columns are selected, use a single parameter to indicate that
 144         if (values['columnsToDisplay[]'] !== null) {
 145             if (values['columnsToDisplay[]'].length == columnCount) {
 146                 delete values['columnsToDisplay[]'];
 147                 values.displayAllColumns = true;
 148             }
 149         } else {
 150             values.displayAllColumns = true;
 151         }
 152
 153         $.post($search_form.attr('action'), values, function (data) {
 154             PMA_ajaxRemoveMessage($msgbox);
 155             if (typeof data !== 'undefined' && data.success === true) {
 156                 if (typeof data.sql_query !== 'undefined') { // zero rows
 157                     $("#sqlqueryresultsouter").html(data.sql_query);
 158                 } else { // results found
 159                     $("#sqlqueryresultsouter").html(data.message);
 160                     $(".sqlqueryresults").trigger('makegrid').trigger('stickycolumns');
 161                 }
 162                 $('#tbl_search_form')
 163                 // workaround for bug #3168569 - Issue on toggling the "Hide search criteria" in chrome.
 164                  .slideToggle()
 165                  .hide();
 166                 $('#togglesearchformlink')
 167                  // always start with the Show message
 168                  .text(PMA_messages.strShowSearchCriteria);
 169                 $('#togglesearchformdiv')
 170                  // now it's time to show the div containing the link
 171                  .show();
 172                  // needed for the display options slider in the results
 173                 PMA_init_slider();
 174             } else {
 175                 $("#sqlqueryresultsouter").html(data.error);
 176             }
 177             PMA_highlightSQL($('#sqlqueryresultsouter'));
 178         }); // end $.post()
 179     });
 180
 181     // Following section is related to the 'function based search' for geometry data types.
 182     // Initialy hide all the open_gis_editor spans
 183     $('span.open_search_gis_editor').hide();
 184
 185     $('select.geom_func').bind('change', function () {
 186         var $geomFuncSelector = $(this);
 187
 188         var binaryFunctions = [
 189             'Contains',
 190             'Crosses',
 191             'Disjoint',
 192             'Equals',
 193             'Intersects',
 194             'Overlaps',
 195             'Touches',
 196             'Within',
 197             'MBRContains',
 198             'MBRDisjoint',
 199             'MBREquals',
 200             'MBRIntersects',
 201             'MBROverlaps',
 202             'MBRTouches',
 203             'MBRWithin',
 204             'ST_Contains',
 205             'ST_Crosses',
 206             'ST_Disjoint',
 207             'ST_Equals',
 208             'ST_Intersects',
 209             'ST_Overlaps',
 210             'ST_Touches',
 211             'ST_Within'
 212         ];
 213
 214         var tempArray = [
 215             'Envelope',
 216             'EndPoint',
 217             'StartPoint',
 218             'ExteriorRing',
 219             'Centroid',
 220             'PointOnSurface'
 221         ];
 222         var outputGeomFunctions = binaryFunctions.concat(tempArray);
 223
 224         // If the chosen function takes two geometry objects as parameters
 225         var $operator = $geomFuncSelector.parents('tr').find('td:nth-child(5)').find('select');
 226         if ($.inArray($geomFuncSelector.val(), binaryFunctions) >= 0) {
 227             $operator.prop('readonly', true);
 228         } else {
 229             $operator.prop('readonly', false);
 230         }
 231
 232         // if the chosen function's output is a geometry, enable GIS editor
 233         var $editorSpan = $geomFuncSelector.parents('tr').find('span.open_search_gis_editor');
 234         if ($.inArray($geomFuncSelector.val(), outputGeomFunctions) >= 0) {
 235             $editorSpan.show();
 236         } else {
 237             $editorSpan.hide();
 238         }
 239
 240     });
 241
 242     $(document).on('click', 'span.open_search_gis_editor', function (event) {
 243         event.preventDefault();
 244
 245         var $span = $(this);
 246         // Current value
 247         var value = $span.parent('td').children("input[type='text']").val();
 248         // Field name
 249         var field = 'Parameter';
 250         // Column type
 251         var geom_func = $span.parents('tr').find('.geom_func').val();
 252         var type;
 253         if (geom_func == 'Envelope') {
 254             type = 'polygon';
 255         } else if (geom_func == 'ExteriorRing') {
 256             type = 'linestring';
 257         } else {
 258             type = 'point';
 259         }
 260         // Names of input field and null checkbox
 261         var input_name = $span.parent('td').children("input[type='text']").attr('name');
 262         //Token
 263         var token = $("input[name='token']").val();
 264
 265         openGISEditor();
 266         if (!gisEditorLoaded) {
 267             loadJSAndGISEditor(value, field, type, input_name, token);
 268         } else {
 269             loadGISEditor(value, field, type, input_name, token);
 270         }
 271     });
 272
 273     /**
 274      * Ajax event handler for Range-Search.
 275      */
 276     $('body').on('click', 'select[name*="criteriaColumnOperators"]', function () {
 277         $source_select = $(this);
 278         // Get the column name.
 279         var column_name = $(this)
 280             .closest('tr')
 281             .find('th:first')
 282             .text();
 283
 284         // Get the data-type of column excluding size.
 285         var data_type = $(this)
 286             .closest('tr')
 287             .find('td[data-type]')
 288             .attr('data-type');
 289         data_type = PMA_checkIfDataTypeNumericOrDate(data_type);
 290
 291         // Get the operator.
 292         var operator = $(this).val();
 293
 294         if ((operator == 'BETWEEN' || operator == 'NOT BETWEEN')
 295             && data_type
 296         ) {
 297             var $msgbox = PMA_ajaxShowMessage();
 298             $.ajax({
 299                 url: 'tbl_select.php',
 300                 type: 'POST',
 301                 data: {
 302                     token: $('input[name="token"]').val(),
 303                     ajax_request: 1,
 304                     db: $('input[name="db"]').val(),
 305                     table: $('input[name="table"]').val(),
 306                     column: column_name,
 307                     range_search: 1
 308                 },
 309                 success: function (response) {
 310                     PMA_ajaxRemoveMessage($msgbox);
 311                     if (response.success) {
 312                         // Get the column min value.
 313                         var min = response.column_data.min
 314                             ? '(' + PMA_messages.strColumnMin +
 315                                 ' ' + response.column_data.min + ')'
 316                             : '';
 317                         // Get the column max value.
 318                         var max = response.column_data.max
 319                             ? '(' + PMA_messages.strColumnMax +
 320                                 ' ' + response.column_data.max + ')'
 321                             : '';
 322                         var button_options = {};
 323                         button_options[PMA_messages.strGo] = function () {
 324                             var min_value = $('#min_value').val();
 325                             var max_value = $('#max_value').val();
 326                             var final_value = '';
 327                             if (min_value.length && max_value.length) {
 328                                 final_value = min_value + ', ' +
 329                                     max_value;
 330                             }
 331                             var $target_field = $source_select.closest('tr')
 332                                 .find('[name*="criteriaValues"]');
 333
 334                             // If target field is a select list.
 335                             if ($target_field.is('select')) {
 336                                 $target_field.val(final_value);
 337                                 var $options = $target_field.find('option');
 338                                 var $closest_min = null;
 339                                 var $closest_max = null;
 340                                 // Find closest min and max value.
 341                                 $options.each(function () {
 342                                     if (
 343                                         $closest_min === null
 344                                         || Math.abs($(this).val() - min_value) < Math.abs($closest_min.val() - min_value)
 345                                     ) {
 346                                         $closest_min = $(this);
 347                                     }
 348
 349                                     if (
 350                                         $closest_max === null
 351                                         || Math.abs($(this).val() - max_value) < Math.abs($closest_max.val() - max_value)
 352                                     ) {
 353                                         $closest_max = $(this);
 354                                     }
 355                                 });
 356
 357                                 $closest_min.attr('selected', 'selected');
 358                                 $closest_max.attr('selected', 'selected');
 359                             } else {
 360                                 $target_field.val(final_value);
 361                             }
 362                             $(this).dialog("close");
 363                         };
 364                         button_options[PMA_messages.strCancel] = function () {
 365                             $(this).dialog("close");
 366                         };
 367
 368                         // Display dialog box.
 369                         $('<div/>').append(
 370                             '<fieldset>' +
 371                             '<legend>' + operator + '</legend>' +
 372                             '<lablel for="min_value">' + PMA_messages.strMinValue +
 373                             '</label>' +
 374                             '<input type="text" id="min_value" />' + '<br>' +
 375                             '<span class="small_font">' + min + '</span>' + '<br>' +
 376                             '<lablel for="max_value">' + PMA_messages.strMaxValue +
 377                             '</label>' +
 378                             '<input type="text" id="max_value" />' + '<br>' +
 379                             '<span class="small_font">' + max + '</span>' +
 380                             '</fieldset>'
 381                         ).dialog({
 382                             minWidth: 500,
 383                             maxHeight: 400,
 384                             modal: true,
 385                             buttons: button_options,
 386                             title: PMA_messages.strRangeSearch,
 387                             open: function () {
 388                                 // Add datepicker wherever required.
 389                                 PMA_addDatepicker($('#min_value'), data_type);
 390                                 PMA_addDatepicker($('#max_value'), data_type);
 391                             },
 392                             close: function () {
 393                                 $(this).remove();
 394                             }
 395                         });
 396                     } else {
 397                         PMA_ajaxShowMessage(response.error);
 398                     }
 399                 },
 400                 error: function (response) {
 401                     PMA_ajaxShowMessage(PMA_messages.strErrorProcessingRequest);
 402                 }
 403             });
 404         }
 405     });
 406
 407 });