{"tag":"sorting","articles":{"projects\/avris-sorter":{"key":"projects\/avris-sorter","type":"article","published":true,"meta":{"createdAt":"2019-10-13T14:09:02+02:00","publishedAt":"2019-10-13T14:06:00+02:00","group":null,"links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/sorter.avris.it\/","displayUrl":"Demo"},{"icon":"brands gitlab","colour":"secondary","url":"https:\/\/gitlab.com\/Avris\/Sorter","displayUrl":null},{"icon":"globe-europe","colour":"secondary","url":"https:\/\/www.npmjs.com\/package\/avris-sorter","displayUrl":null}],"category":"projects","subcategory":null,"slug":"avris-sorter"},"content":{"en":{"slug":"avris-sorter","title":"Avris Sorter","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-sorter_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHkElEQVRIiX2XyY8kRxXGf2+JyKyqrl5m6cEe8HgBgzEwwjLCkoU8WDK2hQwCxC4hOMABxIE\/gTs3DgjEGU6ICxgJBMK2ZEtsYjHGWNh4xstgxp7ppbq7qjIjHoesGSNAhDIyU8pYvvi+ePG+lBtuvD2iVIQgaoWomDu1FIJARXA1TJXkznK5oNYKERCBACKCMBQRQUSA4GqJiFWt155ERQRUBHPHRGiaER4hRASlFiRAgFIKwjCwqg5ARaFWkir9agJEVu241l4EQFCV1yeXq+9C1IKoEfF6P0NIamgt+NUOghJUIkBDEB0mIwRVB4S+VAxBEUIUU12xMSwEGb6trtXNcDeWyw4RiBgWKKLoqq+p4mYkVTxEoZYVwQMjRCAhqBpuiolgorgpEpVaK7WWYQD3YfW1omrXpFIRolaCYGNzk53LV4AKIYhD1IKqQICZksxIfhWQACpQV2wJiOhKBkNRzIxsiXHTQPQcHh3RuNMkJ3ui1kopPX0pIAz7pVYArju1zWJ\/BtSBtAhU8wqUYjpInE1x0UREh4SBVPTaJhXUbKDWEiqKiqHiTJoJW6MNrsx20VCiBI0n1DNEIUTo+25gSODMDTfwj+cvIBJIgKkgBJAQiZVkSjLFNWX6YBUxdjVWQHVgRw1TI7uTLaEYIokmJ246ucbB4YxF13HqDdssjw6Z7e1jImRXalTu\/sA9PPvU06znhiCGyAJUB1FUQQSSKdkND01IWsmFUANMFFVDRXFzXI3sGRchmZMkkbTh2LENPvr5j3Nsa5Nf\/uAnvHD+BaxZI\/kQTdONNe6+9x7+\/MjjbLYjoBARAxgVVMBMMB1Ycxec3CC9U2us9AVQRA01R8Rwc1QTbraqiXMPvo9Pf+WTPPObv\/Cjb36fROHW664namX\/YIZn47Nf\/xq\/+eHDvHF9nWXpqNETUQbpdBVdadhDOSmm4NJOqF1Bah3OoQDEEHHUEskcVSOZ06bM2J0vfPlj3P+Rc8yu7PPwt39E1hFb45Zb3nw9B7uvsns4596vfoakQj3\/Im+7bpvZ0SHzfkmpPaV2oJXkhpngriQXUjJcxuvIsodSCRj2CIpIQsUQT2R12pQYp8SnP3cf93\/kHAB\/fOxJEg3TtSlr44b9y0ecufNdfOChu\/G24YlvfJftExtodOzuBX2fKDEACqmoBik77kJKimfBZTSF3EMBCYVQBAVx0ISpk8zJKXH27E186BPvv5YS9l6ZcfzUSU6f2ebM7W\/iTXfczOTEOhHBCz99lMkoU+oabdOTmwpSqdHR90uidqiBamBu5MbxJDjTDegLETKAiSG6DMc1oTiyOgA\/96UHr53MAA988T7+s0QELz36W5aXXuXkjcdZ7Ga6gx3WtUOsIhbU2lH7BUKPmmCupJzxpsF1OiUVhjyD4qEkjCxODiOrkVHuOHsDp08f+y8A\/15qKTz7s1+z\/8yztBOl3Rhz8rY30u9O2LsoqCwROpBMlIRIHSIsOZYz1ozw6eaUUoAVQ4bg4bRitCgtRlOFu9775v8LZnZpl6d+\/DjL1y4xagCF7uiQw9c6XJaMNxpqV4azx0AlISu51B3LLdqM8DccG9H3QS1QQ9FQFCOFkDDaUJoi3Hrzif8J5GjvkL8+9iQv\/e5psnSM2jqkjgrRQV0YNEoeKZEUk1jJlFBTLGU0N0hqII\/wd2w3HM47lovCsq+UUim1IiFIVKwIJsKJrfE1EAezI84\/8xLP\/+E5Xvrz32miY+yFSAWnkrUSGmAByyFXSgqSB26CmaApIbmFZJAz5Aa8xR\/aepmDeWU269g7qMz6YH8Bh0uYd7DshdLDd771PY4Ojth5dY+Dy3vkUkgUEpVWKyPrmaRgva0sxxWmQQqhtcFmSOlQDywbVoOuM4wp3cLQNrF7ZUxHi5y7\/USst4n5fLBKbpkQp+KEJApO1UxfIURBHRFlMh4zalqW8znZjFEynMokwzTDyUlw3VZh+4QxmQgXLu4wOzqi5I7N60\/zyM9\/xfMXF6y3le3tKYsueOKpA2Rt81hoyogalhLetIganhs8ZSw1qBq5aTFPJM+4Jd575x2kCEZNw2LecfrUNrJcYLXw2vmXyf2czRaOrylbE0jak6xnc9Jz69kxOxdnXLq4x3QELj0n77qPwz\/9Ar\/tw5+iWVunr9BOpnhqUHXEnOQJEUMY8o6EIKVCKSzWxmxtrNGocPDqDldKJlmi1p7dvMX6SFm4cJCUnIw2VapV5k2ls02OvRV2Zs+RRkLjPf2VQ9befj9eMGaHR2CJ5f4+IgeADl4oBgM+eCFWYCpSK\/+8MOcvtZDNkBJIBFYLicEbj1NmmpypOxtNYpwE18I4w2ze8Z53rvPiFaVe7lkfwXTnZd7ywLvxK+f\/xrLrUM\/UUvFmBK\/\/QyCAp4SqIhFEDTQGAFor0vfXDH7tFrgYO69coM0tLsLG2jrH1zfxqBwe7rG1PuX3Tzv\/OD\/ild05z782Z5SDRpd8sH8ROXHLbVFLoV8uqd2CNJkiIZTlHE3NkA5qj+cWYPDcgNZAESSueujBi2sEQsVEcBVcQKlkM1SDvu8QCttTZ6M1Lh8NNrdxuOsM\/AtA9jdb2ZxdiwAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris-sorter_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ELightweight sorting of tables.\u003C\/p\u003E\n\u003Cp\u003EJust add \u003Ccode\u003E[data-sort]\u003C\/code\u003E attributes to the \u003Ccode\u003Eth\u003C\/code\u003E elements in columns you\u2019d like to sort a table by, include ~1kB of JS \u0026amp; CSS, and initialise with \u003Ccode\u003Esorter()\u003C\/code\u003E \u2013 and that\u2019s it!\u003C\/p\u003E\n\u003Cp\u003EFor installation instructions and more customisation options, you can check out the \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Sorter\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E readme file\u003C\/a\u003E.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-sorter_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHkElEQVRIiX2XyY8kRxXGf2+JyKyqrl5m6cEe8HgBgzEwwjLCkoU8WDK2hQwCxC4hOMABxIE\/gTs3DgjEGU6ICxgJBMK2ZEtsYjHGWNh4xstgxp7ppbq7qjIjHoesGSNAhDIyU8pYvvi+ePG+lBtuvD2iVIQgaoWomDu1FIJARXA1TJXkznK5oNYKERCBACKCMBQRQUSA4GqJiFWt155ERQRUBHPHRGiaER4hRASlFiRAgFIKwjCwqg5ARaFWkir9agJEVu241l4EQFCV1yeXq+9C1IKoEfF6P0NIamgt+NUOghJUIkBDEB0mIwRVB4S+VAxBEUIUU12xMSwEGb6trtXNcDeWyw4RiBgWKKLoqq+p4mYkVTxEoZYVwQMjRCAhqBpuiolgorgpEpVaK7WWYQD3YfW1omrXpFIRolaCYGNzk53LV4AKIYhD1IKqQICZksxIfhWQACpQV2wJiOhKBkNRzIxsiXHTQPQcHh3RuNMkJ3ui1kopPX0pIAz7pVYArju1zWJ\/BtSBtAhU8wqUYjpInE1x0UREh4SBVPTaJhXUbKDWEiqKiqHiTJoJW6MNrsx20VCiBI0n1DNEIUTo+25gSODMDTfwj+cvIBJIgKkgBJAQiZVkSjLFNWX6YBUxdjVWQHVgRw1TI7uTLaEYIokmJ246ucbB4YxF13HqDdssjw6Z7e1jImRXalTu\/sA9PPvU06znhiCGyAJUB1FUQQSSKdkND01IWsmFUANMFFVDRXFzXI3sGRchmZMkkbTh2LENPvr5j3Nsa5Nf\/uAnvHD+BaxZI\/kQTdONNe6+9x7+\/MjjbLYjoBARAxgVVMBMMB1Ycxec3CC9U2us9AVQRA01R8Rwc1QTbraqiXMPvo9Pf+WTPPObv\/Cjb36fROHW664namX\/YIZn47Nf\/xq\/+eHDvHF9nWXpqNETUQbpdBVdadhDOSmm4NJOqF1Bah3OoQDEEHHUEskcVSOZ06bM2J0vfPlj3P+Rc8yu7PPwt39E1hFb45Zb3nw9B7uvsns4596vfoakQj3\/Im+7bpvZ0SHzfkmpPaV2oJXkhpngriQXUjJcxuvIsodSCRj2CIpIQsUQT2R12pQYp8SnP3cf93\/kHAB\/fOxJEg3TtSlr44b9y0ecufNdfOChu\/G24YlvfJftExtodOzuBX2fKDEACqmoBik77kJKimfBZTSF3EMBCYVQBAVx0ISpk8zJKXH27E186BPvv5YS9l6ZcfzUSU6f2ebM7W\/iTXfczOTEOhHBCz99lMkoU+oabdOTmwpSqdHR90uidqiBamBu5MbxJDjTDegLETKAiSG6DMc1oTiyOgA\/96UHr53MAA988T7+s0QELz36W5aXXuXkjcdZ7Ga6gx3WtUOsIhbU2lH7BUKPmmCupJzxpsF1OiUVhjyD4qEkjCxODiOrkVHuOHsDp08f+y8A\/15qKTz7s1+z\/8yztBOl3Rhz8rY30u9O2LsoqCwROpBMlIRIHSIsOZYz1ozw6eaUUoAVQ4bg4bRitCgtRlOFu9775v8LZnZpl6d+\/DjL1y4xagCF7uiQw9c6XJaMNxpqV4azx0AlISu51B3LLdqM8DccG9H3QS1QQ9FQFCOFkDDaUJoi3Hrzif8J5GjvkL8+9iQv\/e5psnSM2jqkjgrRQV0YNEoeKZEUk1jJlFBTLGU0N0hqII\/wd2w3HM47lovCsq+UUim1IiFIVKwIJsKJrfE1EAezI84\/8xLP\/+E5Xvrz32miY+yFSAWnkrUSGmAByyFXSgqSB26CmaApIbmFZJAz5Aa8xR\/aepmDeWU269g7qMz6YH8Bh0uYd7DshdLDd771PY4Ojth5dY+Dy3vkUkgUEpVWKyPrmaRgva0sxxWmQQqhtcFmSOlQDywbVoOuM4wp3cLQNrF7ZUxHi5y7\/USst4n5fLBKbpkQp+KEJApO1UxfIURBHRFlMh4zalqW8znZjFEynMokwzTDyUlw3VZh+4QxmQgXLu4wOzqi5I7N60\/zyM9\/xfMXF6y3le3tKYsueOKpA2Rt81hoyogalhLetIganhs8ZSw1qBq5aTFPJM+4Jd575x2kCEZNw2LecfrUNrJcYLXw2vmXyf2czRaOrylbE0jak6xnc9Jz69kxOxdnXLq4x3QELj0n77qPwz\/9Ar\/tw5+iWVunr9BOpnhqUHXEnOQJEUMY8o6EIKVCKSzWxmxtrNGocPDqDldKJlmi1p7dvMX6SFm4cJCUnIw2VapV5k2ls02OvRV2Zs+RRkLjPf2VQ9befj9eMGaHR2CJ5f4+IgeADl4oBgM+eCFWYCpSK\/+8MOcvtZDNkBJIBFYLicEbj1NmmpypOxtNYpwE18I4w2ze8Z53rvPiFaVe7lkfwXTnZd7ywLvxK+f\/xrLrUM\/UUvFmBK\/\/QyCAp4SqIhFEDTQGAFor0vfXDH7tFrgYO69coM0tLsLG2jrH1zfxqBwe7rG1PuX3Tzv\/OD\/ild05z782Z5SDRpd8sH8ROXHLbVFLoV8uqd2CNJkiIZTlHE3NkA5qj+cWYPDcgNZAESSueujBi2sEQsVEcBVcQKlkM1SDvu8QCttTZ6M1Lh8NNrdxuOsM\/AtA9jdb2ZxdiwAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris-sorter_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ELightweight sorting of tables.\u003C\/p\u003E\n\u003Cp\u003EJust add \u003Ccode\u003E[data-sort]\u003C\/code\u003E attributes to the \u003Ccode\u003Eth\u003C\/code\u003E elements in columns you\u2019d like to sort a table by, include ~1kB of JS \u0026amp; CSS, and initialise with \u003Ccode\u003Esorter()\u003C\/code\u003E \u2013 and that\u2019s it!\u003C\/p\u003E\n\u003Cp\u003EFor installation instructions and more customisation options, you can check out the \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Sorter\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E readme file\u003C\/a\u003E.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["html","javascript","js","library","lightweight","sort","sorting","table"],"hasMore":false,"image":"https:\/\/avris.it\/image\/avris-sorter_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris-sorter_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-sorter_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ELightweight sorting of tables.\u003C\/p\u003E\n\u003Cp\u003EJust add \u003Ccode\u003E[data-sort]\u003C\/code\u003E attributes to the \u003Ccode\u003Eth\u003C\/code\u003E elements in columns you\u2019d like to sort a table by, include ~1kB of JS \u0026amp; CSS, and initialise with \u003Ccode\u003Esorter()\u003C\/code\u003E \u2013 and that\u2019s it!\u003C\/p\u003E\n\u003Cp\u003EFor installation instructions and more customisation options, you can check out the \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Sorter\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E readme file\u003C\/a\u003E.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris-sorter_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-sorter_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ELightweight sorting of tables.\u003C\/p\u003E\n\u003Cp\u003EJust add \u003Ccode\u003E[data-sort]\u003C\/code\u003E attributes to the \u003Ccode\u003Eth\u003C\/code\u003E elements in columns you\u2019d like to sort a table by, include ~1kB of JS \u0026amp; CSS, and initialise with \u003Ccode\u003Esorter()\u003C\/code\u003E \u2013 and that\u2019s it!\u003C\/p\u003E\n\u003Cp\u003EFor installation instructions and more customisation options, you can check out the \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Sorter\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E readme file\u003C\/a\u003E.\u003C\/p\u003E","words":50,"readTime":null,"lang":"en"}}}}}