Добавление 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.