{"action":"created","issue":{"url":"https://api.github.com/repos/Mottie/tablesorter/issues/920","labels_url":"https://api.github.com/repos/Mottie/tablesorter/issues/920/labels{/name}","comments_url":"https://api.github.com/repos/Mottie/tablesorter/issues/920/comments","events_url":"https://api.github.com/repos/Mottie/tablesorter/issues/920/events","html_url":"https://github.com/Mottie/tablesorter/issues/920","id":81938028,"number":920,"title":"Why aren't the column order (asc/desc) images  displayed?","user":{"login":"SPlatten","id":11973906,"avatar_url":"https://avatars.githubusercontent.com/u/11973906?v=3","gravatar_id":"","url":"https://api.github.com/users/SPlatten","html_url":"https://github.com/SPlatten","followers_url":"https://api.github.com/users/SPlatten/followers","following_url":"https://api.github.com/users/SPlatten/following{/other_user}","gists_url":"https://api.github.com/users/SPlatten/gists{/gist_id}","starred_url":"https://api.github.com/users/SPlatten/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/SPlatten/subscriptions","organizations_url":"https://api.github.com/users/SPlatten/orgs","repos_url":"https://api.github.com/users/SPlatten/repos","events_url":"https://api.github.com/users/SPlatten/events{/privacy}","received_events_url":"https://api.github.com/users/SPlatten/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/Mottie/tablesorter/labels/How%20To...","name":"How To...","color":"fbca04"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":14,"created_at":"2015-05-28T13:57:36Z","updated_at":"2015-05-31T16:02:47Z","closed_at":null,"body":"I have been working on a table report and updated the jquery scripts to versions:\r\njquery-ui, v1.11.3\r\njquery-2.0.2 \r\njquery.tablesorter, v1.2.6\r\njquery.tablesorter.widgets, v2.22.1\r\njquery.tablesorter.pager, v2.22.0\r\n\r\nMy set-up/initialisation script looks like this:\r\n```javascript\r\n  try{\r\n      $('.tablesorter').tablesorter({\r\n    //*** APPEARANCE ***\r\n    //Add a theme - try 'blackice', 'blue', 'dark', 'default'\r\n    //  'dropbox', 'green', 'grey' or 'ice'\r\n    //to use 'bootstrap' or 'jui', you'll need to add the \"uitheme\"\r\n    //widget and also set it to the same name\r\n    //this option only adds a table class name \"tablesorter-{theme}\"\r\n        theme: 'blue'\r\n    //fix the column widths\r\n       ,widthFixed: false\r\n    //Show an indeterminate timer icon in the header when the table\r\n    //is sorted or filtered\r\n       ,showProcessing: false\r\n    //header layout template (HTML ok); {content} = innerHTML,\r\n    //{icon} = <i/> (class from cssIcon)\r\n       ,headerTemplate: '{content}'\r\n    //return the modified template string\r\n       ,onRenderTemplate: null // function(index, template){ return template; },\r\n    //called after each header cell is rendered, use index to target the column\r\n    //customize header HTML\r\n       ,onRenderHeader: function (index) {\r\n    //the span wrapper is added by default\r\n          $(this).find('div.tablesorter-header-inner').addClass('roundedCorners');\r\n        }\r\n    // *** FUNCTIONALITY ***\r\n    //prevent text selection in header\r\n       ,cancelSelection: true\r\n    // other options: \"ddmmyyyy\" & \"yyyymmdd\"\r\n       ,dateFormat: \"mmddyyyy\"\r\n    //The key used to select more than one column for multi-column\r\n    //sorting.\r\n       ,sortMultiSortKey: \"shiftKey\"\r\n    //key used to remove sorting on a column\r\n       ,sortResetKey: 'ctrlKey'\r\n    // false for German \"1.234.567,89\" or French \"1 234 567,89\"\r\n       ,usNumberFormat: true\r\n    //If true, parsing of all table cell data will be delayed\r\n    //until the user initializes a sort\r\n       ,delayInit: false\r\n    //if true, server-side sorting should be performed because\r\n    //client-side sorting will be disabled, but the ui and events\r\n    //will still be used.\r\n       ,serverSideSorting: false\r\n    //*** SORT OPTIONS ***\r\n    //These are detected by default,\r\n    //but you can change or disable them\r\n    //these can also be set using data-attributes or class names\r\n       ,headers: {\r\n    //set \"sorter : false\" (no quotes) to disable the column\r\n          0: {sorter:\"text\"}\r\n         ,1: {sorter:\"digit\"}\r\n         ,2: {sorter: \"text\"}\r\n         ,3: {sorter: \"url\"}\r\n        }\r\n    //ignore case while sorting\r\n       ,ignoreCase: true\r\n    //forces the user to have this/these column(s) sorted first\r\n       ,sortForce: null\r\n    //initial sort order of the columns, example sortList: [[0,0],[1,0]],\r\n    // [[columnIndex, sortDirection], ... ]\r\n       ,sortList: [[0, 0], [1, 0], [2, 0]]\r\n    //default sort that is added to the end of the users sort\r\n    //selection.\r\n       ,sortAppend: null\r\n    //starting sort direction \"asc\" or \"desc\"\r\n       ,sortInitialOrder: \"asc\"\r\n    //Replace equivalent character (accented characters) to allow\r\n    //for alphanumeric sorting\r\n       ,sortLocaleCompare: false\r\n    // third click on the header will reset column to default - unsorted\r\n       ,sortReset: false\r\n    //restart sort to \"sortInitialOrder\" when clicking on previously\r\n    //unsorted columns\r\n       ,sortRestart: false\r\n    //sort empty cell to bottom, top, none, zero\r\n       ,emptyTo: \"bottom\"\r\n    //sort strings in numerical column as max, min, top, bottom, zero\r\n       ,stringTo: \"max\"\r\n    //extract text from the table - this is how is\r\n    //it done by default\r\n       ,textExtraction: {0:function (node) {\r\n                            return $(node).text();\r\n                           }\r\n                        ,1:function (node) {\r\n                            return $(node).text();\r\n                           }\r\n                        }\r\n    //use custom text sorter\r\n    //function(a,b){ return a.sort(b); } // basic sort\r\n       ,textSorter: null\r\n    //*** WIDGETS ***\r\n    //apply widgets on tablesorter initialization\r\n       ,initWidgets: true\r\n    //include zebra and any other widgets, options:\r\n    //'columns', 'filter', 'stickyHeaders' & 'resizable'\r\n    //'uitheme' is another widget, but requires loading\r\n    //a different skin and a jQuery UI theme.\r\n       ,widgets: ['zebra', 'columns', 'resizable', 'stickyHeaders'] \r\n       ,widgetOptions: {\r\n    //zebra widget: adding zebra striping, using content and\r\n    //default styles - the ui css removes the background\r\n    //from default even and odd class names included for this\r\n    //demo to allow switching themes\r\n    //[ \"even\", \"odd\" ]\r\n          zebra: [\"ui-widget-content even\"\r\n                 ,\"ui-state-default odd\"]\r\n    //uitheme widget: * Updated! in tablesorter v2.4 **\r\n    //Instead of the array of icon class names, this option now\r\n    //contains the name of the theme. Currently jQuery UI (\"jui\")\r\n    //and Bootstrap (\"bootstrap\") themes are supported. To modify\r\n    //the class names used, extend from the themes variable\r\n    //look for the \"$.extend($.tablesorter.themes.jui\" code below\r\n         ,uitheme: 'jui'\r\n    //columns widget: change the default column class names\r\n    //primary is the 1st column sorted, secondary is the 2nd, etc\r\n         ,columns: [\"primary\", \"secondary\", \"tertiary\"]\r\n    //columns widget: If true, the class names from the columns\r\n    //option will also be added to the table tfoot.\r\n         ,columns_tfoot: true\r\n    //columns widget: If true, the class names from the columns\r\n    //option will also be added to the table thead.\r\n         ,columns_thead: true\r\n    //filter widget: If there are child rows in the table (rows with\r\n    //class name from \"cssChildRow\" option) and this option is true\r\n    //and a match is found anywhere in the child row, then it will make\r\n    //that row visible; default is false\r\n         ,filter_childRows: false\r\n    //filter widget: If true, a filter will be added to the top of\r\n    //each table column.\r\n         ,filter_columnFilters: true\r\n    //filter widget: css class applied to the table row containing the\r\n    //filters & the inputs within that row\r\n         ,filter_cssFilter: \"tablesorter-filter\"\r\n    //filter widget: Customize the filter widget by adding a select\r\n    //dropdown with content, custom options or custom filter functions\r\n    //see http://goo.gl/HQQLW for more details\r\n         ,filter_functions: null\r\n    //filter widget: Set this option to true to hide the filter row\r\n    //initially. The rows is revealed by hovering over the filter\r\n    //row or giving any filter input/select focus.\r\n         ,filter_hideFilters: false\r\n    //filter widget: Set this option to false to keep the searches\r\n    //case sensitive\r\n         ,filter_ignoreCase: true\r\n    //filter widget: jQuery selector string of an element used to\r\n    //reset the filters.\r\n         ,filter_reset: null\r\n    //Delay in milliseconds before the filter widget starts searching;\r\n    //This option prevents searching for every character while typing\r\n    //and should make searching large tables faster.\r\n         ,filter_searchDelay: 300\r\n    //Set this option to true if filtering is performed on the server-side.\r\n         ,filter_serversideFiltering: false\r\n    //filter widget: Set this option to true to use the filter to find\r\n    //text from the start of the column. So typing in \"a\" will find\r\n    //\"albert\" but not \"frank\", both have a's; default is false\r\n         ,filter_startsWith: false\r\n    //filter widget: If true, ALL filter searches will only use parsed\r\n    //data. To only use parsed data in specific columns, set this option\r\n    //to false and add class name \"filter-parsed\" to the header\r\n         ,filter_useParsedData: false\r\n    //Resizable widget: If this option is set to false, resized column\r\n    //widths will not be saved. Previous saved values will be restored\r\n    //on page reload\r\n         ,resizable: true\r\n         ,resizable_widths : ['15%', '20%', '20%', '20%', '5%']\r\n    //saveSort widget: If this option is set to false, new sorts will\r\n    //not be saved. Any previous saved sort will be restored on page\r\n    //reload.\r\n         ,saveSort: true\r\n    //stickyHeaders widget: css class name applied to the sticky header\r\n         ,stickyHeaders: \"tablesorter-stickyHeader\"\r\n        }\r\n    //*** CALLBACKS ***\r\n    //function called after tablesorter has completed initialization\r\n        , initialized: function (table) {}\r\n    //*** CSS CLASS NAMES ***\r\n         ,tableClass:       \"tablesorter\"\r\n         ,cssAsc:           \"tablesorter-headerSortUp\"\r\n         ,cssDesc:          \"tablesorter-headerSortDown\"\r\n         ,cssHeader:        \"tablesorter-header\"\r\n         ,cssHeaderRow:     \"tablesorter-headerRow\"\r\n         ,cssIcon:          \"tablesorter-icon\"\r\n         ,cssChildRow:      \"tablesorter-childRow\"\r\n         ,cssInfoBlock:     \"tablesorter-infoOnly\"\r\n         ,cssProcessing:    \"tablesorter-processing\"\r\n    //*** SELECTORS ***\r\n    //jQuery selectors used to find the header cells.\r\n         ,selectorHeaders:  \"> thead th, > thead td\"\r\n    //jQuery selector of content within selectorHeaders\r\n    //that is clickable to trigger a sort.\r\n         ,selectorSort:     \"th, td\"\r\n    //rows with this class name will be removed automatically\r\n    //before updating the table cache - used by \"update\",\r\n    //\"addRows\" and \"appendCache\"\r\n         ,selectorRemove:   \"tr.remove-me\"\r\n    //*** DEBUGING ***\r\n    //send messages to console\r\n         ,debug: false\r\n        }).tablesorterPager({\r\n    //target the pager markup - see the HTML block below\r\n          container: $(\".pager\")\r\n    //use this url format \"http:/mydatabase.com?page={page}&size={size}\" \r\n         ,ajaxUrl: null\r\n    //process ajax so that the data object is returned along with the\r\n    //total number of rows; example:\r\n    // {\r\n    //   \"data\" : [{ \"ID\": 1, \"Name\": \"Foo\", \"Last\": \"Bar\" }],\r\n    //   \"total_rows\" : 100 \r\n    // } \r\n         ,ajaxProcessing: function(ajax) {\r\n            if (ajax && ajax.hasOwnProperty('data')) {\r\n                // return [ \"data\", \"total_rows\" ]; \r\n                return [ajax.data, ajax.total_rows];\r\n            }\r\n        }\r\n    //output string - default is '{page}/{totalPages}';\r\n    //possible variables:\r\n    //{page}, {totalPages}, {startRow}, {endRow} and {totalRows}\r\n        ,output: '{startRow} to {endRow} ({totalRows})'\r\n    //apply disabled classname to the pager arrows when the rows at\r\n    //either extreme is visible - default is true\r\n        ,updateArrows: true\r\n    //starting page of the pager (zero based index)\r\n        ,page: 0\r\n    //Number of visible rows - default is 10\r\n        ,size: 10\r\n    //if true, the table will remain the same height no matter how many\r\n    //records are displayed. The space is made up by an empty \r\n    //table row set to a height to compensate; default is false \r\n        ,fixedHeight: true\r\n    //remove rows from the table to speed up the sort of large tables.\r\n    //setting this to false, only hides the non-visible rows; needed\r\n    //if you plan to add/remove rows with the pager enabled.\r\n        ,removeRows: false\r\n    //css class names of pager arrows\r\n    //next page arrow\r\n        ,cssNext: '.next'\r\n    //previous page arrow\r\n        ,cssPrev: '.prev'\r\n    //go to first page arrow\r\n        ,cssFirst: '.first'\r\n    //go to last page arrow\r\n        ,cssLast: '.last'\r\n    //select dropdown to allow choosing a page\r\n        ,cssGoto: '.gotoPage'\r\n    //location of where the \"output\" is displayed\r\n        ,cssPageDisplay: '.pagedisplay'\r\n    //dropdown that sets the \"size\" option\r\n        ,cssPageSize: '.pagesize'\r\n    //class added to arrows when at the extremes \r\n    //(i.e. prev/first arrows are \"disabled\" when on the first page)\r\n    //Note there is no period \".\" in front of this class name\r\n        ,cssDisabled: 'disabled'\r\n      });\r\n    //Extend the themes to change any of the default class names ** NEW **\r\n    $.extend($.tablesorter.themes.jui\r\n    // change default jQuery uitheme icons - find the full list of icons\r\n    // here: http://jqueryui.com/themeroller/ (hover over them for their name)\r\n      ,{table: 'ui-widget ui-widget-content ui-corner-all'        // table classes\r\n       ,header: 'ui-widget-header ui-corner-all ui-state-default' // header classes\r\n       ,icons: 'ui-icon'               // icon class added to the <i> in the header\r\n       ,sortNone: 'ui-icon-carat-2-n-s'\r\n       ,sortAsc: 'ui-icon-carat-1-n'\r\n       ,sortDesc: 'ui-icon-carat-1-s'\r\n       ,active: 'ui-state-active'       // applied when column is sorted\r\n       ,hover: 'ui-state-hover'         // hover class\r\n       ,filterRow: ''\r\n       ,even: 'ui-widget-content'       // even row zebra striping\r\n       ,odd: 'ui-state-default'         // odd row zebra striping\r\n      });\r\n  } catch(ex) {\r\n    err.msg({file  :strCmnFile\r\n            ,method:\"initTableSorter\"\r\n            ,ex    :ex});    \r\n  }              \r\n```\r\nProblem is I don't see the images for changing the sort order, the img tags are not present in the document.  \r\n\r\nWhat haven't I done?"},"comment":{"url":"https://api.github.com/repos/Mottie/tablesorter/issues/comments/107213002","html_url":"https://github.com/Mottie/tablesorter/issues/920#issuecomment-107213002","issue_url":"https://api.github.com/repos/Mottie/tablesorter/issues/920","id":107213002,"user":{"login":"Mottie","id":136959,"avatar_url":"https://avatars.githubusercontent.com/u/136959?v=3","gravatar_id":"","url":"https://api.github.com/users/Mottie","html_url":"https://github.com/Mottie","followers_url":"https://api.github.com/users/Mottie/followers","following_url":"https://api.github.com/users/Mottie/following{/other_user}","gists_url":"https://api.github.com/users/Mottie/gists{/gist_id}","starred_url":"https://api.github.com/users/Mottie/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Mottie/subscriptions","organizations_url":"https://api.github.com/users/Mottie/orgs","repos_url":"https://api.github.com/users/Mottie/repos","events_url":"https://api.github.com/users/Mottie/events{/privacy}","received_events_url":"https://api.github.com/users/Mottie/received_events","type":"User","site_admin":false},"created_at":"2015-05-31T16:02:47Z","updated_at":"2015-05-31T16:02:47Z","body":"jquery.tablesorter.js + jquery.tablesorter.widgets.js = jquery.tablesorter.combined.js\r\n\r\nThe combined file will also include any selected parsers if you use a [customized grunt build](https://github.com/Mottie/tablesorter/wiki/Customize#custom-build)."}}