Как я могу включить CSS файлы из частичного контроля MVC?

Question

Я использую ASP.NET MVC, и у меня есть частичный элемент управления, для которого требуется определенный файл CSS и JS. Есть ли способ заставить родительскую страницу отображать теги script и link в разделе 'head' страницы, а не просто отображать их встроенными в частичном контроле?

Чтобы уточнить элемент управления, из которого я хочу включить файлы, визуализируется из представления с Html.RenderPartial, и поэтому на нем не может быть элементов управления содержимым на стороне сервера. Я хочу иметь возможность включать файлы в раздел html head, чтобы избежать проблем с проверкой.

Answer 1

Если у меня есть требования к CSS / Javascript в частичном представлении, я просто проверяю, что на любой странице, которая может включать частичное представление, напрямую или в виде содержимого, полученного из AJAX, CSS / Javascript включен в свои заголовки. Если страница имеет главную страницу, я добавляю заполнитель содержимого в заголовок главной страницы и заполняю его на дочерней странице. Чтобы получить intellisense в частичном представлении, я добавляю CSS / Javascript, включенный в частичное представление, но обернутый блоком кода if (false), чтобы они не включались во время выполнения.

<% if (false) { %>
   <link href=...
   <script type=...
<% } %>

Answer 2

http://www.codeproject.com/Articles/38542/Include-Stylesheets-and-Scripts-From-A-WebControl-.aspx

Эта статья содержит информацию о переопределении HttpContext.Response.Filter, который отлично работал для меня.

Answer 3

Перед строкой рендеринга вызовите @import следующим образом:

<style type="text/css>
    @import url(cssPath.css);
</style>

Надеюсь, это поможет.

---

Только что наткнулся на эту опцию на Haacked и вспомнил ваш вопрос. Используйте заполнитель заголовка Content в частичном представлении и просто добавьте CSS в эту форму как обычно.

Answer 4

Я новичок в MVC ... У меня недавно был вызов. Я использовал MVC View Page вместо частичного представления, добавил свою собственную главную страницу (потому что у меня есть css, общий для нескольких представлений) и добавил css в master. Надеюсь, эта информация поможет.

Answer 5

Ответ Тодда работает нормально, при условии, что у вас есть только один экземпляр элемента управления, и нет другого кода, который хочет «вставить» что-либо в тег для главной страницы. К сожалению, на это редко можно положиться.

Я бы посоветовал вам включить все необходимые вам CSS-файлы на главной странице. При первом посещении произойдет небольшой перфоманс, но после этого включится кэширование браузера. Вы можете (и должны) разделить свои стили на несколько файлов .css, чтобы воспользоваться HTTP-агентами, которые могут одновременно загружать их. Что касается файлов .js, я бы предложил реализовать нечто похожее на механизм google.load(), который позволял бы вам загружать скрипты по требованию.

Answer 6

Извините, вы не можете от частичного контроля ссылаться "вверх" на что-то на родительской странице (или добавлять что-либо). Единственное сообщение «вниз» от родителя к частичному, передавая ViewData / Model.

Вы описываете функциональность главной страницы и обычной страницы, используя заполнители содержимого, но частичные элементы управления не работают таким образом.

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

Answer 7

В зависимости от того, сколько CSS / JS требуется вашему элементу управления, самый безопасный путь может заключаться в том, чтобы просто включить дополнительный стиль в основные файлы CSS. Сохраняет дополнительную поездку на сервер, и все это должно кэшироваться клиентом. Я знаю, что это убивает самодостаточность (чтобы придумать фразу) элемента управления, но это может быть вашим лучшим выбором.

Answer 8

Если вы хотите нарушить соответствие, вы можете просто создать определение стиля с частичным содержанием. Это имеет тенденцию работать в самых последних браузерах.

Answer 9

Включите заполнитель в ваш основной шаблон:

<head runat="server>
    <asp:ContentPlaceHolder ID="head" runat="server" />
</head>

и под вашим контролем

<asp:Content ID="head" runat="server">
    <script src="something.js"></script>
</asp:Content>