Advertisement
Guest User

Untitled

a guest
Nov 9th, 2012
300
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /**
  2.  * jQuery Yii GridView plugin file.
  3.  *
  4.  * @author Qiang Xue <qiang.xue@gmail.com>
  5.  * @link http://www.yiiframework.com/
  6.  * @copyright Copyright &copy; 2008-2010 Yii Software LLC
  7.  * @license http://www.yiiframework.com/license/
  8.  * @version $Id$
  9.  */
  10.  
  11. (function ($) {
  12.     var selectCheckedRows, methods,
  13.         gridSettings = [];
  14.     /**
  15.      * 1. Selects rows that have checkbox checked (only checkbox that is connected with selecting a row)
  16.      * 2. Check if "check all" need to be checked/unchecked
  17.      * @return object the jQuery object
  18.      */
  19.     selectCheckedRows = function (gridId) {
  20.         var settings = gridSettings[gridId],
  21.             table = $('#' + gridId).children('.' + settings.tableClass);
  22.  
  23.         table.children('tbody').find('input.select-on-check').filter(':checked').each(function () {
  24.             $(this).closest('tr').addClass('selected');
  25.         });
  26.  
  27.         table.children('thead').find('th input').filter('[type="checkbox"]').each(function () {
  28.             var name = this.name.substring(0, this.name.length - 4) + '[]', //.. remove '_all' and add '[]''
  29.                 $checks = $("input[name='" + name + "']", table);
  30.             this.checked = $checks.length > 0 && $checks.length === $checks.filter(':checked').length;
  31.         });
  32.         return this;
  33.     };
  34.  
  35.     methods = {
  36.         /**
  37.          * yiiGridView set function.
  38.          * @param options map settings for the grid view. Available options are as follows:
  39.          * - ajaxUpdate: array, IDs of the containers whose content may be updated by ajax response
  40.          * - ajaxVar: string, the name of the GET variable indicating the ID of the element triggering the AJAX request
  41.          * - pagerClass: string, the CSS class for the pager container
  42.          * - tableClass: string, the CSS class for the table
  43.          * - selectableRows: integer, the number of rows that can be selected
  44.          * - updateSelector: string, the selector for choosing which elements can trigger ajax requests
  45.          * - beforeAjaxUpdate: function, the function to be called before ajax request is sent
  46.          * - afterAjaxUpdate: function, the function to be called after ajax response is received
  47.          * - ajaxUpdateError: function, the function to be called if an ajax error occurs
  48.          * - selectionChanged: function, the function to be called after the row selection is changed
  49.          * @return object the jQuery object
  50.          */
  51.         init: function (options) {
  52.             var settings = $.extend({
  53.                     ajaxUpdate: [],
  54.                     ajaxVar: 'ajax',
  55.                     pagerClass: 'pager',
  56.                     loadingClass: 'loading',
  57.                     filterClass: 'filters',
  58.                     tableClass: 'items',
  59.                     selectableRows: 1
  60.                     // updateSelector: '#id .pager a, '#id .grid thead th a',
  61.                     // beforeAjaxUpdate: function (id) {},
  62.                     // afterAjaxUpdate: function (id, data) {},
  63.                     // selectionChanged: function (id) {},
  64.                     // url: 'ajax request URL'
  65.                 }, options || {});
  66.  
  67.             settings.tableClass = settings.tableClass.replace(/\s+/g, '.');
  68.  
  69.             return this.each(function () {
  70.                 var eventType,
  71.                     $grid = $(this),
  72.                     id = $grid.attr('id'),
  73.                     pagerSelector = '#' + id + ' .' + settings.pagerClass.replace(/\s+/g, '.') + ' a',
  74.                     sortSelector = '#' + id + ' .' + settings.tableClass + ' thead th a.sort-link',
  75.                     inputSelector = '#' + id + ' .' + settings.filterClass + ' input, ' + '#' + id + ' .' + settings.filterClass + ' select';
  76.  
  77.                 settings.updateSelector = settings.updateSelector
  78.                                 .replace('{page}', pagerSelector)
  79.                                 .replace('{sort}', sortSelector);
  80.  
  81.                 gridSettings[id] = settings;
  82.  
  83.                 if (settings.ajaxUpdate.length > 0) {
  84.                     $(document).on('click.yiiGridView', settings.updateSelector, function () {
  85.                         // Check to see if History.js is enabled for our Browser
  86.                         if (settings.enableHistory && window.History.enabled) {
  87.                             // Ajaxify this link
  88.                             var url = $(this).attr('href'),
  89.                                 params = $.deparam.querystring(url);
  90.  
  91.                             delete params[settings.ajaxVar];
  92.                             window.History.pushState(null, document.title, $.param.querystring(url.substr(0, url.indexOf('?')), params));
  93.                         } else {
  94.                             $('#' + id).yiiGridView('update', {url: $(this).attr('href')});
  95.                         }
  96.                         return false;
  97.                     });
  98.                 }
  99.  
  100.                 $(document).on('change.yiiGridView keydown.yiiGridView', inputSelector, function (event) {
  101.                     if (event.type === 'keydown') {
  102.                         if( event.keyCode !== 13) {
  103.                             return; // only react to enter key
  104.                         } else {
  105.                             eventType = 'keydown';
  106.                         }
  107.                     } else {
  108.                         // prevent processing for both keydown and change events
  109.                         if (eventType === 'keydown') {
  110.                             eventType = '';
  111.                             return;
  112.                         }
  113.                     }
  114.                     var data = $(inputSelector).serialize();
  115.                     if (settings.pageVar !== undefined) {
  116.                         data += '&' + settings.pageVar + '=1';
  117.                     }
  118.                     if (settings.enableHistory && settings.ajaxUpdate !== false && window.History.enabled) {
  119.                         // Ajaxify this link
  120.                         var url = $('#' + id).yiiGridView('getUrl'),
  121.                             params = $.deparam.querystring($.param.querystring(url, data));
  122.  
  123.                         delete params[settings.ajaxVar];
  124.                         window.History.pushState(null, document.title, $.param.querystring(url.substr(0, url.indexOf('?')), params));
  125.                     } else {
  126.                         $('#' + id).yiiGridView('update', {data: data});
  127.                     }
  128.                 });
  129.  
  130.                 if (settings.enableHistory && settings.ajaxUpdate !== false && window.History.enabled) {
  131.                     $(window).bind('statechange', function() { // Note: We are using statechange instead of popstate
  132.                         var State = window.History.getState(); // Note: We are using History.getState() instead of event.state
  133.                         $('#' + id).yiiGridView('update', {url: State.url});
  134.                     });
  135.                 }
  136.  
  137.                 /**
  138.                  * Modified to support 'disabled' class, which will not select rows / checkmarks - Ryan Holmes
  139.                  */
  140.                 if (settings.selectableRows > 0) {
  141.                     selectCheckedRows(this.id);
  142.                     $(document).on('click.yiiGridView', '#' + id + ' .' + settings.tableClass + ' > tbody > tr', function (e) {
  143.                         var $currentGrid, $row, isRowSelected, $checks,
  144.                             $target = $(e.target);
  145.  
  146.                         if ($target.closest('td').is('.empty,.button-column') || (e.target.type === 'checkbox' && !$target.hasClass('select-on-check')) || $(this).hasClass('disabled') ) {
  147.                             return;
  148.                         }
  149.  
  150.                         $row = $(this);
  151.                         $currentGrid = $('#' + id);
  152.                         $checks = $('input.select-on-check', $currentGrid);
  153.                         isRowSelected = $row.toggleClass('selected').hasClass('selected');
  154.  
  155.                         if (settings.selectableRows === 1) {
  156.                             $row.siblings().removeClass('selected');
  157.                             $checks.prop('checked', false);
  158.                         }
  159.                         $('input.select-on-check', $row).prop('checked', isRowSelected);
  160.                         $("input.select-on-check-all", $currentGrid).prop('checked', $checks.length === $checks.filter(':checked').length);
  161.  
  162.                         if (settings.selectionChanged !== undefined) {
  163.                             settings.selectionChanged(id);
  164.                         }
  165.                     });
  166.                     if (settings.selectableRows > 1) {
  167.                         $(document).on('click.yiiGridView', '#' + id + ' .select-on-check-all', function () {
  168.                             var $currentGrid = $('#' + id),
  169.                                 $checks = $('input.select-on-check', $currentGrid).not(':disabled'),
  170.                                 $checksAll = $('input.select-on-check-all', $currentGrid).not(':disabled'),
  171.                                 $rows = $currentGrid.children('.' + settings.tableClass).children('tbody').children().not('.disabled');
  172.                             if (this.checked) {
  173.                                 $rows.addClass('selected');
  174.                                 $checks.prop('checked', true);
  175.                                 $checksAll.prop('checked', true);
  176.                             } else {
  177.                                 $rows.removeClass('selected');
  178.                                 $checks.prop('checked', false);
  179.                                 $checksAll.prop('checked', false);
  180.                             }
  181.                             if (settings.selectionChanged !== undefined) {
  182.                                 settings.selectionChanged(id);
  183.                             }
  184.                         });
  185.                     }
  186.                 } else {
  187.                     $(document).on('click.yiiGridView', '#' + id + ' .select-on-check', false);
  188.                 }
  189.             });
  190.         },
  191.  
  192.         /**
  193.          * Returns the key value for the specified row
  194.          * @param row integer the row number (zero-based index)
  195.          * @return string the key value
  196.          */
  197.         getKey: function (row) {
  198.             return this.children('.keys').children('span').eq(row).text();
  199.         },
  200.  
  201.         /**
  202.          * Returns the URL that generates the grid view content.
  203.          * @return string the URL that generates the grid view content.
  204.          */
  205.         getUrl: function () {
  206.             var sUrl = gridSettings[this.attr('id')].url;
  207.             return sUrl || this.children('.keys').attr('title');
  208.         },
  209.  
  210.         /**
  211.          * Returns the jQuery collection of the cells in the specified row.
  212.          * @param row integer the row number (zero-based index)
  213.          * @return jQuery the jQuery collection of the cells in the specified row.
  214.          */
  215.         getRow: function (row) {
  216.             var sClass = gridSettings[this.attr('id')].tableClass;
  217.             return this.children('.' + sClass).children('tbody').children('tr').eq(row).children();
  218.         },
  219.  
  220.         /**
  221.          * Returns the jQuery collection of the cells in the specified column.
  222.          * @param column integer the column number (zero-based index)
  223.          * @return jQuery the jQuery collection of the cells in the specified column.
  224.          */
  225.         getColumn: function (column) {
  226.             var sClass = gridSettings[this.attr('id')].tableClass;
  227.             return this.children('.' + sClass).children('tbody').children('tr').children('td:nth-child(' + (column + 1) + ')');
  228.         },
  229.  
  230.         /**
  231.          * Performs an AJAX-based update of the grid view contents.
  232.          * @param options map the AJAX request options (see jQuery.ajax API manual). By default,
  233.          * the URL to be requested is the one that generates the current content of the grid view.
  234.          * @return object the jQuery object
  235.          */
  236.         update: function (options) {
  237.             var customError;
  238.             if (options && options.error !== undefined) {
  239.                 customError = options.error;
  240.                 delete options.error;
  241.             }
  242.  
  243.             return this.each(function () {
  244.                 var $form,
  245.                     $grid = $(this),
  246.                     id = $grid.attr('id'),
  247.                     settings = gridSettings[id];
  248.                 $grid.addClass(settings.loadingClass);
  249.  
  250.                 options = $.extend({
  251.                     type: 'GET',
  252.                     url: $grid.yiiGridView('getUrl'),
  253.                     success: function (data) {
  254.                         var $data = $('<div>' + data + '</div>');
  255.                         $grid.removeClass(settings.loadingClass);
  256.                         $.each(settings.ajaxUpdate, function (i, el) {
  257.                             var updateId = '#' + el;
  258.                             $(updateId).replaceWith($(updateId, $data));
  259.                         });
  260.                         if (settings.afterAjaxUpdate !== undefined) {
  261.                             settings.afterAjaxUpdate(id, data);
  262.                         }
  263.                         if (settings.selectableRows > 0) {
  264.                             selectCheckedRows(id);
  265.                         }
  266.                     },
  267.                     error: function (XHR, textStatus, errorThrown) {
  268.                         var ret, err;
  269.                         $grid.removeClass(settings.loadingClass);
  270.                         if (XHR.readyState === 0 || XHR.status === 0) {
  271.                             return;
  272.                         }
  273.                         if (customError !== undefined) {
  274.                             ret = customError(XHR);
  275.                             if (ret !== undefined && !ret) {
  276.                                 return;
  277.                             }
  278.                         }
  279.                         switch (textStatus) {
  280.                         case 'timeout':
  281.                             err = 'The request timed out!';
  282.                             break;
  283.                         case 'parsererror':
  284.                             err = 'Parser error!';
  285.                             break;
  286.                         case 'error':
  287.                             if (XHR.status && !/^\s*$/.test(XHR.status)) {
  288.                                 err = 'Error ' + XHR.status;
  289.                             } else {
  290.                                 err = 'Error';
  291.                             }
  292.                             if (XHR.responseText && !/^\s*$/.test(XHR.responseText)) {
  293.                                 err = err + ': ' + XHR.responseText;
  294.                             }
  295.                             break;
  296.                         }
  297.  
  298.                         if (settings.ajaxUpdateError !== undefined) {
  299.                             settings.ajaxUpdateError(XHR, textStatus, errorThrown, err);
  300.                         } else if (err) {
  301.                             alert(err);
  302.                         }
  303.                     }
  304.                 }, options || {});
  305.                 if (options.data !== undefined && options.type === 'GET') {
  306.                     options.url = $.param.querystring(options.url, options.data);
  307.                     options.data = {};
  308.                 }
  309.  
  310.                 if (settings.ajaxUpdate !== false) {
  311.                     options.url = $.param.querystring(options.url, settings.ajaxVar + '=' + id);
  312.                     if (settings.beforeAjaxUpdate !== undefined) {
  313.                         settings.beforeAjaxUpdate(id, options);
  314.                     }
  315.                     $.ajax(options);
  316.                 } else {  // non-ajax mode
  317.                     if (options.type === 'GET') {
  318.                         window.location.href = options.url;
  319.                     } else {  // POST mode
  320.                         $form = $('<form action="' + options.url + '" method="post"></form>').appendTo('body');
  321.                         if (options.data === undefined) {
  322.                             options.data = {};
  323.                         }
  324.  
  325.                         if (options.data.returnUrl === undefined) {
  326.                             options.data.returnUrl = window.location.href;
  327.                         }
  328.  
  329.                         $.each(options.data, function (name, value) {
  330.                             $form.append($('<input type="hidden" name="t" value="" />').attr('name', name).val(value));
  331.                         });
  332.                         $form.submit();
  333.                     }
  334.                 }
  335.             });
  336.         },
  337.  
  338.         /**
  339.          * Returns the key values of the currently selected rows.
  340.          * @return array the key values of the currently selected rows.
  341.          */
  342.         getSelection: function () {
  343.             var settings = gridSettings[this.attr('id')],
  344.                 keys = this.find('.keys span'),
  345.                 selection = [];
  346.             this.find('.' + settings.tableClass).children('tbody').children().each(function (i) {
  347.                 if ($(this).hasClass('selected')) {
  348.                     selection.push(keys.eq(i).text());
  349.                 }
  350.             });
  351.             return selection;
  352.         },
  353.  
  354.         /**
  355.          * Returns the key values of the currently checked rows.
  356.          * @param column_id string the ID of the column
  357.          * @return array the key values of the currently checked rows.
  358.          */
  359.         getChecked: function (column_id) {
  360.             var settings = gridSettings[this.attr('id')],
  361.                 keys = this.find('.keys span'),
  362.                 checked = [];
  363.             if (column_id.substring(column_id.length - 2) !== '[]') {
  364.                 column_id = column_id + '[]';
  365.             }
  366.             this.find('.' + settings.tableClass).children('tbody').children('tr').children('td').children('input[name="' + column_id + '"]').each(function (i) {
  367.                 if (this.checked) {
  368.                     checked.push(keys.eq(i).text());
  369.                 }
  370.             });
  371.             return checked;
  372.         }
  373.     };
  374.  
  375.     $.fn.yiiGridView = function (method) {
  376.         if (methods[method]) {
  377.             return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
  378.         } else if (typeof method === 'object' || !method) {
  379.             return methods.init.apply(this, arguments);
  380.         } else {
  381.             $.error('Method ' + method + ' does not exist on jQuery.yiiGridView');
  382.             return false;
  383.         }
  384.     };
  385.  
  386. /******************************************************************************
  387.  *** DEPRECATED METHODS
  388.  *** used before Yii 1.1.9
  389.  ******************************************************************************/
  390.     $.fn.yiiGridView.settings = gridSettings;
  391.     /**
  392.      * Returns the key value for the specified row
  393.      * @param id string the ID of the grid view container
  394.      * @param row integer the row number (zero-based index)
  395.      * @return string the key value
  396.      */
  397.     $.fn.yiiGridView.getKey = function (id, row) {
  398.         return $('#' + id).yiiGridView('getKey', row);
  399.     };
  400.  
  401.     /**
  402.      * Returns the URL that generates the grid view content.
  403.      * @param id string the ID of the grid view container
  404.      * @return string the URL that generates the grid view content.
  405.      */
  406.     $.fn.yiiGridView.getUrl = function (id) {
  407.         return $('#' + id).yiiGridView('getUrl');
  408.     };
  409.  
  410.     /**
  411.      * Returns the jQuery collection of the cells in the specified row.
  412.      * @param id string the ID of the grid view container
  413.      * @param row integer the row number (zero-based index)
  414.      * @return jQuery the jQuery collection of the cells in the specified row.
  415.      */
  416.     $.fn.yiiGridView.getRow = function (id, row) {
  417.         return $('#' + id).yiiGridView('getRow', row);
  418.     };
  419.  
  420.     /**
  421.      * Returns the jQuery collection of the cells in the specified column.
  422.      * @param id string the ID of the grid view container
  423.      * @param column integer the column number (zero-based index)
  424.      * @return jQuery the jQuery collection of the cells in the specified column.
  425.      */
  426.     $.fn.yiiGridView.getColumn = function (id, column) {
  427.         return $('#' + id).yiiGridView('getColumn', column);
  428.     };
  429.  
  430.     /**
  431.      * Performs an AJAX-based update of the grid view contents.
  432.      * @param id string the ID of the grid view container
  433.      * @param options map the AJAX request options (see jQuery.ajax API manual). By default,
  434.      * the URL to be requested is the one that generates the current content of the grid view.
  435.      */
  436.     $.fn.yiiGridView.update = function (id, options) {
  437.         $('#' + id).yiiGridView('update', options);
  438.     };
  439.  
  440.     /**
  441.      * Returns the key values of the currently selected rows.
  442.      * @param id string the ID of the grid view container
  443.      * @return array the key values of the currently selected rows.
  444.      */
  445.     $.fn.yiiGridView.getSelection = function (id) {
  446.         return $('#' + id).yiiGridView('getSelection');
  447.     };
  448.  
  449.     /**
  450.      * Returns the key values of the currently checked rows.
  451.      * @param id string the ID of the grid view container
  452.      * @param column_id string the ID of the column
  453.      * @return array the key values of the currently checked rows.
  454.      */
  455.     $.fn.yiiGridView.getChecked = function (id, column_id) {
  456.         return $('#' + id).yiiGridView('getChecked', column_id);
  457.     };
  458. })(jQuery);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement