Fixed: Not selecting a datalabel used to issue a notice(undefined offset)
[phpmyadmin/ammaryasirr.git] / js / sql.js
blob99fd93c703bc614ef1210dcff9c63b2b3a25e450
1 /* vim: set expandtab sw=4 ts=4 sts=4: */
2 /**
3  * @fileoverview    functions used wherever an sql query form is used
4  *
5  * @requires    jQuery
6  * @requires    js/functions.js
7  *
8  */
10 var $data_a;
12 /**
13  * decode a string URL_encoded
14  *
15  * @param string str
16  * @return string the URL-decoded string
17  */
18 function PMA_urldecode(str)
20     return decodeURIComponent(str.replace(/\+/g, '%20'));
23 function PMA_urlencode(str)
25     return encodeURIComponent(str).replace(/\%20/g, '+');
28 /**
29  * Get the field name for the current field.  Required to construct the query
30  * for grid editing
31  *
32  * @param   $this_field  jQuery object that points to the current field's tr
33  */
34 function getFieldName($this_field)
37     var this_field_index = $this_field.index();
38     // ltr or rtl direction does not impact how the DOM was generated
39     // check if the action column in the left exist
40     var left_action_exist = !$('#table_results').find('th:first').hasClass('draggable');
41     // number of column span for checkbox and Actions
42     var left_action_skip = left_action_exist ? $('#table_results').find('th:first').attr('colspan') - 1 : 0;
43     var field_name = $('#table_results').find('thead').find('th:eq('+ (this_field_index - left_action_skip) + ') a').text();
44     // happens when just one row (headings contain no a)
45     if ("" == field_name) {
46         field_name = $('#table_results').find('thead').find('th:eq('+ (this_field_index - left_action_skip) + ')').text();
47     }
49     field_name = $.trim(field_name);
51     return field_name;
55 /**#@+
56  * @namespace   jQuery
57  */
59 /**
60  * @description <p>Ajax scripts for sql and browse pages</p>
61  *
62  * Actions ajaxified here:
63  * <ul>
64  * <li>Retrieve results of an SQL query</li>
65  * <li>Paginate the results table</li>
66  * <li>Sort the results table</li>
67  * <li>Change table according to display options</li>
68  * <li>Grid editing of data</li>
69  * </ul>
70  *
71  * @name        document.ready
72  * @memberOf    jQuery
73  */
74 $(document).ready(function() {
76     /**
77      * Set a parameter for all Ajax queries made on this page.  Don't let the
78      * web server serve cached pages
79      */
80     $.ajaxSetup({
81         cache: 'false'
82     });
84     /* Hides the bookmarkoptions checkboxes when the bookmark label is empty */
85     $('input#bkm_label').keyup(function() {
86         $('input#id_bkm_all_users, input#id_bkm_replace')
87             .parent()
88             .toggle($(this).attr('value').length > 0);
89     }).trigger('keyup');
91     /**
92      * Attach the {@link makegrid} function to a custom event, which will be
93      * triggered manually everytime the table of results is reloaded
94      * @memberOf    jQuery
95      */
96     $("#sqlqueryresults").live('makegrid', function() {
97         PMA_makegrid($('#table_results')[0]);
98     })
100     /**
101      * Append the "Show/Hide query box" message to the query input form
102      *
103      * @memberOf jQuery
104      * @name    appendToggleSpan
105      */
106     // do not add this link more than once
107     if (! $('#sqlqueryform').find('a').is('#togglequerybox')) {
108         $('<a id="togglequerybox"></a>')
109         .html(PMA_messages['strHideQueryBox'])
110         .appendTo("#sqlqueryform")
111         // initially hidden because at this point, nothing else
112         // appears under the link
113         .hide();
115         // Attach the toggling of the query box visibility to a click
116         $("#togglequerybox").bind('click', function() {
117             var $link = $(this)
118             $link.siblings().slideToggle("fast");
119             if ($link.text() == PMA_messages['strHideQueryBox']) {
120                 $link.text(PMA_messages['strShowQueryBox']);
121                 // cheap trick to add a spacer between the menu tabs
122                 // and "Show query box"; feel free to improve!
123                 $('#togglequerybox_spacer').remove();
124                 $link.before('<br id="togglequerybox_spacer" />');
125             } else {
126                 $link.text(PMA_messages['strHideQueryBox']);
127             }
128             // avoid default click action
129             return false;
130         })
131     }
133     /**
134      * Ajax Event handler for 'SQL Query Submit'
135      *
136      * @see         PMA_ajaxShowMessage()
137      * @see         $cfg['AjaxEnable']
138      * @memberOf    jQuery
139      * @name        sqlqueryform_submit
140      */
141     $("#sqlqueryform.ajax").live('submit', function(event) {
142         event.preventDefault();
144         var $form = $(this);
145         if (! checkSqlQuery($form[0])) {
146             return false;
147         }
149         // remove any div containing a previous error message
150         $('.error').remove();
152         var $msgbox = PMA_ajaxShowMessage();
153         var $sqlqueryresults = $('#sqlqueryresults');
155         PMA_prepareForAjaxRequest($form);
157         $.post($form.attr('action'), $form.serialize() , function(data) {
158             if (data.success == true) {
159                 // fade out previous messages, if any
160                 $('.success').fadeOut();
161                 $('.sqlquery_message').fadeOut();
162                 // show a message that stays on screen
163                 if (typeof data.sql_query != 'undefined') {
164                     $('<div class="sqlquery_message"></div>')
165                      .html(data.sql_query)
166                      .insertBefore('#sqlqueryform');
167                     // unnecessary div that came from data.sql_query
168                     $('.notice').remove();
169                 } else {
170                     $('#sqlqueryform').before(data.message);
171                 }
172                 $sqlqueryresults.show();
173                 // this happens if a USE command was typed
174                 if (typeof data.reload != 'undefined') {
175                     // Unbind the submit event before reloading. See bug #3295529
176                     $("#sqlqueryform.ajax").die('submit');
177                     $form.find('input[name=db]').val(data.db);
178                     // need to regenerate the whole upper part
179                     $form.find('input[name=ajax_request]').remove();
180                     $form.append('<input type="hidden" name="reload" value="true" />');
181                     $.post('db_sql.php', $form.serialize(), function(data) {
182                         $('body').html(data);
183                     }); // end inner post
184                 }
185             }
186             else if (data.success == false ) {
187                 // show an error message that stays on screen
188                 $('#sqlqueryform').before(data.error);
189                 $sqlqueryresults.hide();
190             }
191             else {
192                 // real results are returned
193                 // fade out previous messages, if any
194                 $('.success').fadeOut();
195                 $('.sqlquery_message').fadeOut();
196                 var $received_data = $(data);
197                 var $zero_row_results = $received_data.find('textarea[name="sql_query"]');
198                 // if zero rows are returned from the query execution
199                 if ($zero_row_results.length > 0) {
200                     $('#sqlquery').val($zero_row_results.val());
201                 } else {
202                     $sqlqueryresults
203                      .show()
204                      .html(data)
205                      .trigger('makegrid');
206                     $('#togglequerybox').show();
207                     if ($("#togglequerybox").siblings(":visible").length > 0) {
208                         $("#togglequerybox").trigger('click');
209                     }
210                     PMA_init_slider();
211                 }
212             }
213             PMA_ajaxRemoveMessage($msgbox);
215         }) // end $.post()
216     }) // end SQL Query submit
218     /**
219      * Ajax Event handlers for Paginating the results table
220      */
222     /**
223      * Paginate when we click any of the navigation buttons
224      * (only if the element has the ajax class, see $cfg['AjaxEnable'])
225      * @memberOf    jQuery
226      * @name        paginate_nav_button_click
227      * @uses        PMA_ajaxShowMessage()
228      * @see         $cfg['AjaxEnable']
229      */
230     $("input[name=navig].ajax").live('click', function(event) {
231         /** @lends jQuery */
232         event.preventDefault();
234         var $msgbox = PMA_ajaxShowMessage();
236         /**
237          * @var $form    Object referring to the form element that paginates the results table
238          */
239         var $form = $(this).parent("form");
241         PMA_prepareForAjaxRequest($form);
243         $.post($form.attr('action'), $form.serialize(), function(data) {
244             $("#sqlqueryresults")
245              .html(data)
246              .trigger('makegrid');
247             PMA_init_slider();
249             PMA_ajaxRemoveMessage($msgbox);
250         }) // end $.post()
251     })// end Paginate results table
253     /**
254      * Paginate results with Page Selector dropdown
255      * @memberOf    jQuery
256      * @name        paginate_dropdown_change
257      * @see         $cfg['AjaxEnable']
258      */
259     $("#pageselector").live('change', function(event) {
260         var $form = $(this).parent("form");
262         if ($(this).hasClass('ajax')) {
263             event.preventDefault();
265             var $msgbox = PMA_ajaxShowMessage();
267             $.post($form.attr('action'), $form.serialize() + '&ajax_request=true', function(data) {
268                 $("#sqlqueryresults")
269                  .html(data)
270                  .trigger('makegrid');
271                 PMA_init_slider();
272                 PMA_ajaxRemoveMessage($msgbox);
273             }) // end $.post()
274         } else {
275             $form.submit();
276         }
278     })// end Paginate results with Page Selector
280     /**
281      * Ajax Event handler for sorting the results table
282      * @memberOf    jQuery
283      * @name        table_results_sort_click
284      * @see         $cfg['AjaxEnable']
285      */
286     $("#table_results.ajax").find("a[title=Sort]").live('click', function(event) {
287         event.preventDefault();
289         var $msgbox = PMA_ajaxShowMessage();
291         $anchor = $(this);
293         $.get($anchor.attr('href'), $anchor.serialize() + '&ajax_request=true', function(data) {
294             $("#sqlqueryresults")
295              .html(data)
296              .trigger('makegrid');
297             PMA_ajaxRemoveMessage($msgbox);
298         }) // end $.get()
299     })//end Sort results table
301     /**
302      * Ajax Event handler for the display options
303      * @memberOf    jQuery
304      * @name        displayOptionsForm_submit
305      * @see         $cfg['AjaxEnable']
306      */
307     $("#displayOptionsForm.ajax").live('submit', function(event) {
308         event.preventDefault();
310         $form = $(this);
312         $.post($form.attr('action'), $form.serialize() + '&ajax_request=true' , function(data) {
313             $("#sqlqueryresults")
314              .html(data)
315              .trigger('makegrid');
316             PMA_init_slider();
317         }) // end $.post()
318     })
319     //end displayOptionsForm handler
322  * Ajax Event for table row change
323  * */
324     $("#resultsForm.ajax .mult_submit[value=edit]").live('click', function(event){
325         event.preventDefault();
327         /*Check whether atleast one row is selected for change*/
328         if ($("#table_results tbody tr, #table_results tbody tr td").hasClass("marked")) {
329             var div = $('<div id="change_row_dialog"></div>');
331             /**
332              *  @var    button_options  Object that stores the options passed to jQueryUI
333              *                          dialog
334              */
335             var button_options = {};
336             // in the following function we need to use $(this)
337             button_options[PMA_messages['strCancel']] = function() {$(this).dialog('close').remove();}
339             var button_options_error = {};
340             button_options_error[PMA_messages['strOK']] = function() {$(this).dialog('close').remove();}
341             var $form = $("#resultsForm");
342             var $msgbox = PMA_ajaxShowMessage();
344             $.get( $form.attr('action'), $form.serialize()+"&ajax_request=true&submit_mult=row_edit", function(data) {
345                 //in the case of an error, show the error message returned.
346                 if (data.success != undefined && data.success == false) {
347                     div
348                     .append(data.error)
349                     .dialog({
350                         title: PMA_messages['strChangeTbl'],
351                         height: 230,
352                         width: 900,
353                         open: PMA_verifyTypeOfAllColumns,
354                         close: function(event, ui) {
355                             $('#change_row_dialog').remove();
356                         },
357                         buttons : button_options_error
358                     })// end dialog options
359                 } else {
360                     div
361                     .append(data)
362                     .dialog({
363                         title: PMA_messages['strChangeTbl'],
364                         height: 600,
365                         width: 900,
366                         open: PMA_verifyTypeOfAllColumns,
367                         close: function(event, ui) {
368                             $('#change_row_dialog').remove();
369                         },
370                         buttons : button_options
371                     })
372                     //Remove the top menu container from the dialog
373                     .find("#topmenucontainer").hide()
374                     ; // end dialog options
375                     $(".insertRowTable").addClass("ajax");
376                     $("#buttonYes").addClass("ajax");
377                 }
378                 PMA_ajaxRemoveMessage($msgbox);
379             }) // end $.get()
380         } else {
381             PMA_ajaxShowMessage(PMA_messages['strNoRowSelected']);
382         }
383     });
386  * Click action for "Go" button in ajax dialog insertForm -> insertRowTable
387  */
388     $("#insertForm .insertRowTable.ajax input[value=Go]").live('click', function(event) {
389         event.preventDefault();
390         /**
391          *  @var    the_form    object referring to the insert form
392          */
393         var $form = $("#insertForm");
394         PMA_prepareForAjaxRequest($form);
395         //User wants to submit the form
396         $.post($form.attr('action'), $form.serialize(), function(data) {
397             if (data.success == true) {
398                 PMA_ajaxShowMessage(data.message);
399                 if ($("#pageselector").length != 0) {
400                     $("#pageselector").trigger('change');
401                 } else {
402                     $("input[name=navig].ajax").trigger('click');
403                 }
405             } else {
406                 PMA_ajaxShowMessage(data.error);
407                 $("#table_results tbody tr.marked .multi_checkbox " +
408                         ", #table_results tbody tr td.marked .multi_checkbox").prop("checked", false);
409                 $("#table_results tbody tr.marked .multi_checkbox " +
410                         ", #table_results tbody tr td.marked .multi_checkbox").removeClass("last_clicked");
411                 $("#table_results tbody tr" +
412                         ", #table_results tbody tr td").removeClass("marked");
413             }
414             if ($("#change_row_dialog").length > 0) {
415                 $("#change_row_dialog").dialog("close").remove();
416             }
417             /**Update the row count at the tableForm*/
418             $("#result_query").remove();
419             $("#sqlqueryresults").prepend(data.sql_query);
420             $("#result_query .notice").remove();
421             $("#result_query").prepend((data.message));
422         }) // end $.post()
423     }) // end insert table button "Go"
425 /**$("#buttonYes.ajax").live('click'
426  * Click action for #buttonYes button in ajax dialog insertForm
427  */
428     $("#buttonYes.ajax").live('click', function(event){
429         event.preventDefault();
430         /**
431          *  @var    the_form    object referring to the insert form
432          */
433         var $form = $("#insertForm");
434         /**Get the submit type and the after insert type in the form*/
435         var selected_submit_type = $("#insertForm").find("#actions_panel .control_at_footer option:selected").attr('value');
436         var selected_after_insert = $("#insertForm").find("#actions_panel select[name=after_insert] option:selected").attr('value');
437         $("#result_query").remove();
438         PMA_prepareForAjaxRequest($form);
439         //User wants to submit the form
440         $.post($form.attr('action'), $form.serialize() , function(data) {
441             if (data.success == true) {
442                 PMA_ajaxShowMessage(data.message);
443                 if (selected_submit_type == "showinsert") {
444                     $("#sqlqueryresults").prepend(data.sql_query);
445                     $("#result_query .notice").remove();
446                     $("#result_query").prepend(data.message);
447                     $("#table_results tbody tr.marked .multi_checkbox " +
448                         ", #table_results tbody tr td.marked .multi_checkbox").prop("checked", false);
449                     $("#table_results tbody tr.marked .multi_checkbox " +
450                         ", #table_results tbody tr td.marked .multi_checkbox").removeClass("last_clicked");
451                     $("#table_results tbody tr" +
452                         ", #table_results tbody tr td").removeClass("marked");
453                 } else {
454                     if ($("#pageselector").length != 0) {
455                         $("#pageselector").trigger('change');
456                     } else {
457                         $("input[name=navig].ajax").trigger('click');
458                     }
459                     $("#result_query").remove();
460                     $("#sqlqueryresults").prepend(data.sql_query);
461                     $("#result_query .notice").remove();
462                     $("#result_query").prepend((data.message));
463                 }
464             } else {
465                 PMA_ajaxShowMessage(data.error);
466                 $("#table_results tbody tr.marked .multi_checkbox " +
467                     ", #table_results tbody tr td.marked .multi_checkbox").prop("checked", false);
468                 $("#table_results tbody tr.marked .multi_checkbox " +
469                     ", #table_results tbody tr td.marked .multi_checkbox").removeClass("last_clicked");
470                 $("#table_results tbody tr" +
471                     ", #table_results tbody tr td").removeClass("marked");
472             }
473             if ($("#change_row_dialog").length > 0) {
474                 $("#change_row_dialog").dialog("close").remove();
475             }
476         }) // end $.post()
477     });
479 }, 'top.frame_content') // end $(document).ready()
483  * Starting from some th, change the class of all td under it.
484  * If isAddClass is specified, it will be used to determine whether to add or remove the class.
485  */
486 function PMA_changeClassForColumn($this_th, newclass, isAddClass)
488     // index 0 is the th containing the big T
489     var th_index = $this_th.index();
490     var has_big_t = !$this_th.closest('tr').children(':first').hasClass('column_heading');
491     // .eq() is zero-based
492     if (has_big_t) {
493         th_index--;
494     }
495     var $tds = $this_th.closest('table').find('tbody tr').find('td.data:eq('+th_index+')');
496     if (isAddClass == undefined) {
497         $tds.toggleClass(newclass);
498     } else {
499         $tds.toggleClass(newclass, isAddClass);
500     }
503 $(document).ready(function() {
505     $('.browse_foreign').live('click', function(e) {
506         e.preventDefault();
507         window.open(this.href, 'foreigners', 'width=640,height=240,scrollbars=yes,resizable=yes');
508         $anchor = $(this);
509         $anchor.addClass('browse_foreign_clicked');
510         return false;
511     });
513     /**
514      * vertical column highlighting in horizontal mode when hovering over the column header
515      */
516     $('.column_heading.pointer').live('hover', function(e) {
517         PMA_changeClassForColumn($(this), 'hover', e.type == 'mouseenter');
518         });
520     /**
521      * vertical column marking in horizontal mode when clicking the column header
522      */
523     $('.column_heading.marker').live('click', function() {
524         PMA_changeClassForColumn($(this), 'marked');
525         });
527     /**
528      * create resizable table
529      */
530     $("#sqlqueryresults").trigger('makegrid');
534  * Profiling Chart
535  */
536 function makeProfilingChart()
538     if ($('#profilingchart').length == 0) {
539         return;
540     }
542     var data = new Array();
543     $.each(jQuery.parseJSON($('#profilingchart').html()),function(key,value) {
544         data.push([key,parseFloat(value)]);
545     });
547     // Prevent the user from seeing the JSON code
548     $('div#profilingchart').html('').show();
550     PMA_createProfilingChart(data);
554 /**#@- */