2013-09-27 7 views
2

Я пытаюсь применить тему к jqGrid. Я искал информацию, но я не могу найти сайт, где он объясняет шаг за шагом. Так может кто-нибудь сказать мне, как это сделать? Мой проект разрабатывается в asp.net mvc4, jquery и jqGrid.Применение темы к jqGrid

Первая попытка:

Я скачал Redmond тему, и я поставил его под \ Content папки в моем mvc4 asp.net проекта. Редмонд папка содержит одну папку для изображений и в корне, три CSS файлы, как показано ниже:

\Content 
    \redmond 
     \images 
     jquery-ui.css 
     jquery-ui.min.css 
     jquery.ui.theme.css 

так, чтобы использовать тему в моей главной странице, в голове тега я:

<head> 

    ... 

     <link href="@Url.Content("~/Content/redmond/jquery-ui.css")" rel="stylesheet" type="text/css" media="all" /> 

     <link href="@Url.Content("~/Content/redmond/jquery-ui.min.css")" rel="stylesheet" type="text/css" media="all" /> 

     <link href="@Url.Content("~/Content/redmond/jquery.ui.theme.css")" rel="stylesheet" type="text/css" media="all" /> 

    ... 
</head> 

и в теле главной страницы, а я сделать:

(...) 

     @Scripts.Render("~/bundles/jquery") 


     @Content.Script("jquery-1.10.2.min.js", Url) 
     @Content.Script("jquery-ui-1.10.3.min.js", Url) 
     @Content.Script("jquery.unobtrusive-ajax.min.js", Url) 
     @Content.Script("jquery.dd.js", Url) 
     @Content.Script("grid.locale-en.js", Url)   
     @Content.Script("jquery.jqGrid.min.js", Url) 

     @RenderSection("scripts", required: false) 
    </body> 

(...) 

Обратите внимание, что я имею в виду @Content, что файл cshtml в моей папке \ App_Code и его содержание:

@using System.Web.Mvc; 
@helper Script(string scriptName, UrlHelper url) 
{ 
    <script src="@url.Content(string.Format("~/Scripts/{0}", scriptName))" type="text/javascript"></script> 
} 

теперь тема применяется к моему jqGrid, но после того, как тема применяется, вся моя страница, которая содержит ее, и даже главная страница становится заблокированной (отключена, серая) и внизу страницы ниже (показано, окно с предупреждением изречение: пожалуйста, выберите строку):

http://snag.gy/AgUvM.jpg

что это Происходило? Есть идеи?

Решение:

Я использую выпадающий скриптовый файл Jquery-dd.js, но я забыл добавить стиль CSS для него в голове тега в моей главной странице (также я забыл включить CSS файл для jqGrid):

<link href="@Url.Content("~/Content/dd.css")" rel="stylesheet" type="text/css" /> 
<link href="@Url.Content("~/Content/ui.jqGrid.css")" rel="stylesheet" type="text/css" media="all"/> 

ответ

2

Это полезная ссылка для создания вашей темы jquery. jQuery UI. Что вам нужно сделать, это выбрать нужную тему и загрузить файлы со ссылкой внизу страницы. Используйте его в своем приложении asp.net-mvc. Надеюсь, это поможет.

+0

Хорошо, загрузите сжатый файл (ссылки на темы внизу), а затем поместите нужную папку темы в папку «Мой контент» правильно? Я видел, что есть только папка с изображениями с множеством gif, png и некоторыми css-файлами в корне. Я предполагаю, что jquery-ui-xxx.js используется для их правильной загрузки (в папке с моим скриптом)? – user1624552

+1

Да, вы правы.Надеюсь, ты выбрал свою тему. Что вам нужно сделать, так это вызвать css-файл внутри вашей темы и добавить последние jquery и jquery-ui js-файлы. Ты получишь это. –

+0

Я сделал это, тема применяется сейчас, но при применении всей страницы даже главная страница блокируется (отключена), и в нижней части страницы появляется окно: «пожалуйста, выберите строку». Смотрите мое обновленное сообщение, пожалуйста. – user1624552

2

Если вы выбрали тему (я принимаю тему пользовательского интерфейса jQuery), вы можете сохранить ее в доступной папке (/ Content/Themes/etc).

После этого это должно быть так же просто, как добавить тему к вашему виду или макету.

Ex:

<link href="@Url.Content("~/Content/themes/redmond/jquery-ui-1.10.3.custom.css")" rel="stylesheet" type="text/css" /> 

(в этом примере я выбрал тему 'Redmond', и имел собственную версию JQuery UI 1.10.3)

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

+0

Я сделал это, тема применяется сейчас, но когда применяется вся страница, даже главная страница блокируется (отключена), и в нижней части страницы появляется сообщение: «пожалуйста, выберите строку ". Смотрите мое обновленное сообщение, пожалуйста. – user1624552

Смежные вопросы