Данные с табличной структурой, как известно, можно хранить в обычных текстовых файлах. При этом для разделения строк и данных внутри одной строки (полей) используются символы-разделители. Файлы с такого рода структурой еще называют CSV-файлами (Comma Separated Values — значения, разделенные запятой). В качестве разделителей полей часто используют запятую, а для разделения строк — управляющий символ перехода на новую строку. Однако можно использовать и другие символы, отличающиеся от тех, из которых состоят данные. На рисунке показан пример CSV-файла, в котором в качестве разделителя полей используется вертикальная черта "|", а разделителя строк — непечатаемый управляющий символ перехода на новую строку.
Обычно обработку CSV-файлов выполняют на сервере. Вместе с тем, это же можно сделать и на стороне клиента. В Internet Explorer имеется фирменное расширение от Microsoft (ActiveX) Tabular Data Control, позволяющее загрузить CSV-файл и с помощью его методов выполнить различные операции над полученными табличными данными, такие как сортировка, поиск, фильтрация и др. Иначе говоря, в Internet Explorer имеется встроенное средство для работы с CSV-файлами на стороне клиента, которое не используют другие браузеры. Здесь рассматриваются клиентские средства работы с CSV-файлами, которые годятся для всех браузеров, поддерживающих JavaScript. А именно, применение объекта XMLHttpRequest и несколько функций обработки табличных данных.
В примере содержимое загруженного в объект XMLHttpRequest текстового файла преобразуется в двумерный массив с помощью специально для этого написанной функции CSVtoA(). Далее двумерный массив сортируется по значениям второго столбца с помощью функции asort(). Кроме указанных функций, я написал еще и afilter() для фильтрации (поиска) строк (см. далее).
Далее приводятся коды упоминавшихся выше функций.
var req=false; if(window.XMLHttpRequest) { // поддерживается ли XMLHttpRequest ? req=new XMLHttpRequest(); // для для IE7+ и др. } else { try { req=new ActiveXObject('Msxml2.XMLHTTP'); // для IE версий, меньших 7 } catch (e) { req=new ActiveXObject('Microsoft.XMLHTTP'); // для старых IE } } if (!req) {// если объект XMLHttpRequest поддерживается alert("Объект XMLHttpRequest не поддерживается данным браузером"); } else { // если поддерживается /* назначаем обработчик событию готовности объекта: */ req.onreadystatechange = receive; /* открываем объект для взаимодействия: передача методом get; запрашиваемый файл — mytext.txt; режим — асинхронный */ req.open("get", 'mytext.txt?'+Math.random(),true); // открываем соединение req.send(null); // посылаем запрос серверу } function receive() { // получение данных от сервера if (req.readyState == 4){// если запрос завершен if (req.status == 200) { // если запрос завершен без ошибок /* Ответ сервера (содержимое файла mytext.txt) содержится в свойстве req.responseText. Здесь может находиться код обработки значения req.responseText. */ } else {alert("Ошибка "+ req.status+":\n" + req.statustext)} } }