Добавление JavaScript, CSS и других в WebPart с использованием WSPBuilder
Итак, я пытаюсь сделать то, что, как я думал, было простой задачей... Но я никуда не дену...
Все, что я хочу, это получить файлы .js и .css, загруженные моим WebPart. Я использую VS2008 + WSPBuilder. Я много рассказывал об этом, но я не мог найти достойного ответа.
Что я хотел бы знать:
-
Где в структуре каталогов я должен разместить эти файлы? (например, 12/TEMPLATE/OTHER? 80/wpresources/assembly_name?)
-
Как я могу добраться до этих файлов? (используя относительный путь? Получение полного пути каким-то методом?)
-
И наконец, как я могу добавить эти файлы на страницу <head>
?
Спасибо заранее. Я потерял все свое утро в этих вопросах, и я рассматриваю изменение карьеры!;)
Ответы
Ответ 1
Хорошо, после двух сигарет и более эффективных поисковых запросов Google я нашел решение. Надеюсь, это поможет кому-то в той же проблеме, что и я!
-
Правильное место для этих дополнительных файлов находится в 12/TEMPLATE/LAYOUTS/1033/yourapp/
-
Если они находятся в этом месте, путь к этим файлам: /_layouts/1033/yourapp/yourjs.js
-
Если вы хотите добавить файл JavaScript в начало страницы, поместите этот код в метод CreateChildControls():
string scriptPath = "/_layouts/1033/yourapp/yourjs.js";
if(!this.Page.ClientScript.IsClientScriptBlockRegistered(scriptPath))
this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), scriptPath,
"<script language=\"javascript\" src=\"" + scriptPath + "\">");
-
Если вы хотите добавить файл CSS в начало страницы, поместите этот код в метод CreateChildControls():
CssLink cssLink = new CssLink();
cssLink.DefaultUrl = "/_layouts/1033/yourapp/yourcss.css";
this.Page.Header.Controls.Add(cssLink);
Хорошо, надеюсь, что вы нашли это полезным!
Ответ 2
Ресурсы должны находиться в папке wpresources.
Если администратор разворачивает вашу веб-часть в каталог BIN, тогда эта папка будет выглядеть примерно как
http://server/site/wpresources/YourWebPart/
который будет сопоставлен с чем-то вроде
C:\Inetpub\wwwroot\wss\VirtualDirectories\80\wpresources\YourWebPart
Если администратор разворачивается в GAC, он будет
http://server/_wpresources/WebPartStrongName/
отображается на
C:/Program Files/Common Files/Microsoft Shared/Web Server Extensions/wpresources/WebPartStrongName
Чтобы узнать путь, который вам нужен во время выполнения, вы должны использовать WebPart.ClassResourcePath
Так что измените свой код
string scriptPath = this.ClassResourcePath + "/yourjs.js";
if(!this.Page.ClientScript.IsClientScriptBlockRegistered(scriptPath))
this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), scriptPath,
"<script language=\"javascript\" src=\"" + scriptPath + "\">");
MSDN - создание веб-части с клиентской стороны Script
Ответ 3
Я знаю, что это старый пост, однако есть лучший способ сделать это. Этот способ намного лучше, потому что он поддерживает ваши js и CSS файлы локально в вашем проекте. Я обнаружил, что лучше избегать 12 улей, если это вообще возможно, и с добавлением файлов CSS и js, это возможно.
Во-первых, вы должны создать папку для размещения файлов js и файлов CSS на верхнем уровне вашего проекта С#. Поместите файлы js/CSS в эту папку.
Затем вы собираетесь создать класс Constants.cs, который будет вызывать ваши js или файлы CSS. вот код для класса.
using System;
using System.Collections.Generic;
using System.Text;
namespace myProjectSolution {
internal static class Constants
{
public const string JQuerymyjavascriptFileJS = "myProjectSolution.Resources.myjavascriptFile.js";
public const string CSSPath = "myProjectSolution.Resources.CSSPath.css";
}
}
Обратите внимание, что в коде он возвращается в папку "Ресурсы". Это дополнительная папка, которую я сделал на первом шаге. Назовите это, что вы хотите.
Следующая часть добавляет вашу ссылку на ваш js файл /CSS на сборку.
[assembly: WebResource(Constants.JQuerymyjavascriptFileJS, "text/javascript")]
[assembly: WebResource(Constants.CSSPath, "text/css")]
После этого вы готовы позвонить и использовать свой js/CSS в основном классе С# вашего проекта WSP.
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
this.EnsureChildControls();
Page.ClientScript.RegisterClientScriptResource(this.GetType(), Constants.JQuerymyjavascriptFileJS);
}
Файлы CSS немного отличаются
ClientScriptManager csm = Page.ClientScript();
csm.RegisterClientScriptResourse(this.GetType(), Constants.CSSPath);
HtmlLink css = new HtmlLink();
css.Href = csm.GetWebResourceUrl(this.GetType(), Constants.CSSPath);
css.Attributes.Add("type", "text/css");
css.Attributes.Add("rel", "stylesheet");
Page.Header.Controls.Add(css);
Я обнаружил, что это лучший и надежный способ вызова js и CSS файлов. Вот как я загружаю свои файлы JavaScript и CSS для всех своих веб-частей. У меня никогда не было проблемы с этим. Надеюсь, это поможет некоторым людям, у которых проблемы с этим. SharePoint никогда не делает ничего легкого.:)
Ответ 4
У меня возникли проблемы с решением lazoDev для работы (ошибки орфографии, отсутствующие ссылки, а также ошибка кодирования), и я решил поделиться своим решением.
Шаг 1: Webpart, называемый "Календарь"
Мои стили располагаются в папке "Стили": ProjectName/Styles/
Пока скрипты находятся в папке Scripts: ProjectName/Scripts/
using System.Web.UI.HtmlControls;
namespace ProjectName.Calendar
{
internal static class Styles
{
public const string main = "ProjectName.Styles.main.css";
public const string calendar = "ProjectName.Styles.calendar.css";
}
internal static class Scripts
{
public const string jqueryMin = "ProjectName.Scripts.jquery.min.js";
public const string jqueryDatepicker = "ProjectName.Scripts.jquery.datepicker.js";
}
[ToolboxItemAttribute(false)]
public class Calendar: WebPart
{
protected override void CreateChildControls()
{
// Adding Styles (also have to add to AssemblyInfo.cs, as well as changing the Build Action property of the file to embedded resource)
HtmlLink css = new HtmlLink();
css.Attributes.Add("type", "text/css");
css.Attributes.Add("rel", "stylesheet");
css.Href = Page.ClientScript.GetWebResourceUrl(this.GetType(), Styles.dailog);
Page.Header.Controls.Add(css);
HtmlLink css2 = new HtmlLink();
css2.Attributes.Add("type", "text/css");
css2.Attributes.Add("rel", "stylesheet");
css2.Href = Page.ClientScript.GetWebResourceUrl(this.GetType(), Styles.calendar);
Page.Header.Controls.Add(css2);
// Adding Scripts (also have to add to AssemblyInfo.cs, as well as changing the Build Action property of the file to embedded resource)
Page.ClientScript.RegisterClientScriptResource(this.GetType(), Scripts.jqueryMin);
Page.ClientScript.RegisterClientScriptResource(this.GetType(), Scripts.jqueryDatepicker);
}
}
}
Шаг 2: AssemblyInfo.cs
using ProjectName.Calendar;
// Styling
[assembly: WebResource(Styles.main, "text/css")]
[assembly: WebResource(Styles.calendar, "text/css")]
// Scripts
[assembly: WebResource(Scripts.jqueryMin, "text/javascript")]
[assembly: WebResource(Scripts.jqueryDatepicker, "text/javascript")]
Шаг 3: Свойства файла
Перейдите к свойствам каждого файла script и стиля и измените значение Build Action
на Embedded Resource
.