ASP.NET MVC 2 и диспетчер jQuery tablesort v2

Question

Надеюсь, кто-то может помочь, я играл с ASP.NET MVC 2 для учебного проекта. Недавно я хотел представить несколько более продвинутых эффектов, один из которых является сортируемыми таблицами. Учитывая, что у меня есть ряд других элементов управления jquery, использование jquery-контроля показалось хорошей идеей!

Я выбрал tablesorter v2 и добавил его на свой сайт.

1. Обеспечено, что мои столы я хотел, чтобы у модели были секции thead/tbody.
2. Добавил .js-файл в свой Scripts.
3. Это добавление в верхней части моего частичного обзора <script src="<%= Url.Content("~/Scripts/jquery-ui-1.8.4.custom.min.js") %>" type="text/javascript"></script>
4. (Для информации) также пробовали эту запись в представлении «Site.Master».
5. Добавлено id="leagueTable" к моему столу.
6. Добавлено <script type="text/javascript"> $(document).ready(function() { $("#leagueTable").tablesorter(); }); </script> с частичного просмотра.

На этом этапе я запустил сайт и все работало должным образом - например, Я могу сортировать контент, но ничего визуально не изменилось. Теперь добавьте CSS ....

1. Скачав "blue.zip" и скопировав все данный файл в /Content.
2. В верхней части сайта добавлено следующее. Мастера, <link href="<%= Url.Content("~/Content/style.css") %>" type="text/css" rel="stylesheet" /> (NB. Style.css - это имя поставляемого CSS - первоначально я переименовал его, но после проблем я уменьшил свои изменения, чтобы сохранить их в том виде, в каком они были поставлены).

На данном этапе, я перезапустил (обеспечение для Ctrl-F5, чтобы истечь любое кэширование) и надеялся увидеть фантазии стиль, как показано в примерах ... вместо этого, пока еще функционален, ничего не выглядит иначе.

Я бежал в хроме (с помощью инструментов Inspect element) и подтвердил, что загружается CSS - jquery применяется, так как я имею функциональность сортировки, но он ничего не утверждает в CSS, используется (используя Аудит - «style.css: 100% (по оценкам) не используется текущей страницей.»).

Что я делаю неправильно? Почему я не получаю стили? [20 лет на C++, в режиме реального времени, но новое для веб-разработки]

Answer 1

Ну, решение после много охоты и следования по направлению @Matt оказалось очень простым - но я дважды проверил tablesorter documentation и обнаружил, что там не упоминается!

Когда вы добавляете темы «Голубой» или «Зеленый», поставляемые на сайте, оба требуют, чтобы таблица получила имя класса tablesorter. Я ошибочно предположил, что jQuery (который работал) изменил бы структуру таблицы, добавив ее собственные классы стиля, соответствующие тем, которые определены в теме!

Подведем итоги:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#leagueTable1").tablesorter(); 
     $("#leagueTable2").tablesorter(); 
    }); 
</script> 

<table id="leagueTable1"> 
    <thead> 
    ... // THIS TABLE WILL NOT BE STYLED 
</table> 
<table id="leagueTable2" class="tablesorter"> 
    <thead> 
    ... // THIS TABLE _WILL_ BE STYLED 
</table> 

Answer 2

Мой личный предпочтительный метод, чтобы проверить, правильно ли связывается статический ресурс (например, файл CSS), сделать «Просмотр источника "в FireFox. В этом представлении гиперссылки на ссылки на CSS, поэтому вы можете щелкнуть по нему и увидеть, непосредственно, что есть или не загружается.

Однако, так как вы упоминаете Chrome, я хотел бы сделать это:

• Нажмите на кнопку "Контроль текущей страницы" (справа вверху) и выберите "Developer" -> "Инструменты разработчика"

• Далее, перейдите к исходной ссылке CSS в своем теге заголовка и нажмите ссылку для файла CSS или нажмите кнопку «Ресурсы» в верхней части страницы, в которой будет отображаться весь ресурс на странице, и перемещаться к файлу CSS

• Он может скажите, что вам нужно включить «отслеживание ресурсов» на этом этапе - если да, разрешите это.Вы можете

• Как только вы перейдете к файлу CSS на странице «Ресурсы», нажмите на него. Он загрузит ресурс. Если он загружает ожидаемый CSS, то да, он правильно загружается.

Теперь, давайте предположим, что является загрузки правильно, но вы по-прежнему возникают проблемы. Я бы попробовал добавить свой собственный стиль CSS в таблицу стилей и посмотреть, обновляет ли она страницу, как вы ожидали. Может быть что-то простое, например,

table td{ font-weight: bold; } 

Если этот стиль влияет, вы знаете, что таблица стилей применяется.

Если вы все еще возникают проблемы, вы могли бы направить нас на страницу (если это общедоступными), или же подготовить пример того, что не работает на сайте, как http://jsbin.com/

сообщение обратно с обновлением , и я постараюсь вам помочь в этом. Я сам использовал tablesorter, поэтому знаком с плагином.