Чтобы вас обнадежить, я был очень новичком в .NET и javascript около девяти месяцев назад (и, возможно, до сих пор), но я все еще мог использовать ресурсы на datatables.net , чтобы сделать очень хороший, функциональный набор данных с использованием ASP.net и SQL-сервера. Пара предложений:
Первый : страница примеров , ссылка на API и форумы на datatables.net собираются быть вашими лучшими ресурсами. Я потратил дни, кодируя какой-то действительно сложный способ заставить таблицу сделать что-то относительно простое, только на справочной странице выяснилось, что уже есть простой и изощренный способ сделать это.
Второй : Если вы используете MVC и действительно необходимо выполнить обработку на стороне сервера (если не см. Ниже), существует отличный учебник по проекту кода о том, как установите это с помощью datatables.net.
Третье: Обработка на стороне сервера дает вам большой контроль над тем, как таблица отображает ваши данные, но требует от вас ручного кодирования функций сортировки и разбивки на страницы. Альтернативный метод, который я использую, это опция инициализации sAjaxSource
для таблицы без bServerSide
, установленной в true, поскольку это позволяет мне динамически загружать данные из внешнего (AJAX) источника, в то же время позволяя подключаемому модулю делать данные все тяжелые работы. Вот мои настройки (прошу прощения, если это слишком упрощенно):
В моем HTML есть пустая таблица, в которой указаны только заголовки каждого столбца. Убедитесь, что у вас есть теги thead
и tbody
.
В вашем .NET-проекте создайте новый «универсальный обработчик» (расширение должно быть .ashx). Этот обработчик будет обрабатывать запрос от вашей главной страницы для ваших данных (вы увидите ниже). Здесь я делаю следующее:
а. Я подключаюсь к своей базе данных SQL
б. Получить вид таблицы, которую я ищу
с. Разбор каждой строки в объект (для этого я создал новый класс)
д. Сериализуйте массив моих «строковых объектов» в объект JSON (так как это будет самый простой способ для работы с данными с вашими данными
е. Напишите ответ обратно на страницу
Я был бы рад поделиться своим кодом, который я использую для этого, но я уже чувствую, что этот пост становится слишком длинным, поэтому просто дайте мне знать, если вы этого хотите.
Затем я настраиваю свои данные в javascipt страницы, в функции $(document).ready
. Я использую файл .ashx в качестве источника AJAX, а затем указываю имя, которое я использую в качестве ключа для каждого столбца в моем объекте JSON - используя параметр mDataProp
:
oTable = $("#production_table").dataTable({
"sAjaxSource": 'Data.ashx',
// ^ Change this ashx filename based on
// the file you created above in #2
"aoColumns": [
{ "mDataProp": "column1" },
{ "mDataProp": "column2" },
{ "mDataProp": "column3" } ]
});
Удачи!