Viewing Category

Actions:E-mail | Permalink | Comments (0)

20

Một bài viết hay về cách chèn file css, javacript, jQuery trên Dotnetnuke

nmduc073 posted on August 20, 2010 07:12::64 view(s)

Hôm nay, mình phát hiện được 1 article tiếng Anh về cách chèn các file css, javascript, jQuery trên DNN rất hữu ích. Các bạn nên đọc để tham khảo.

Phần code chính của nó:

/// <summary>

/// Includes the jQuery libraries onto the page

/// </summary>

/// <param name="page" />Page object from calling page/control</param>

/// <param name="includejQueryUI" />if true, includes the jQuery UI libraries</param>

/// <param name="uncompressed" />if true, includes the uncompressed libraries</param>

/// <param name="includeNoConflict" />if true, includes the uncompressed libraries</param>

internal static void InjectjQueryLibary(System.Web.UI.Page page, bool includejQueryUI,

bool uncompressed, bool includeNoConflict)

{

int major, minor, build, revision;

Actions:E-mail | Permalink | Comments (0)

http://www.willstrohl.com/Blog/tabid/66/EntryId/493/jQuery-Intellisense-in-DotNetNuke-Module-Development.aspx

23

Cách tạo Intellisense cho JQuery khi phát triển module Dotnetnuke

nmduc073 posted on September 23, 2009 13:24

::1117 view(s)

Khi chúng ta code 1 page aspx trong 1 ứng dụng asp.net trên VS.NET, một trong những điều mà các developer thích là khi gõ 1 biến javascript, ta có thể thấy các property của nó bằng cách gõ dấu chấm “.”. Nó được gọi là Intellisense. Nó giúp cho việc code trở nên dễ dàng hơn.

Gần đây, jQuery ngày càng trở nên phổ biến hơn. Và có nhu cầu hỗ trợ tính năng ấy khi code jQuery trên DNN module. Để làm được điều đó, ta cần làm các bước như sau:

-Bảo đảm rằng file jQuery.intellisense.js nằm trong folder \Resources\Shared\scripts\jquery.

Trong các version 4x cũ thì không có sẵn file này.

-Trên trang ascx mà ta muốn hỗ trợ Intellisense, ta nhúng đoạn code sau

src="~/Resources/Shared/scripts/jquery/jquery.intellisense.js">script>

Vậy là xong.

Link tham khảo:

Actions:E-mail | Permalink | Comments (0)

23

Sử dụng jQuery trên DNN 4x sẽ gây vấn đề với menu

nmduc073 posted on April 23, 2009 06:51::529 view(s)

Hôm qua, mình dùng jQuery trên 1 module. Đến lúc test, mình để ý là menu của site bị biến mất. Và trên Firebug, nó báo lỗi như sau:

$ is not a function

Default.aspx()()Default.aspx (line 276)

Khi mình bỏ code jQuery ra thì mọi thứ đều ok hết. Chứng tỏ đây là lỗi do jQuery.

Thực ra, lỗi này mình đã thấy vài lần trước đây rồi. Nhưng lúc đó lại không để ý lắm. Thực sự chẳng biết giải quyết sao nữa. Vì khi sử dụng code jQuery, mình có dùng

jQuery.noConflict();

Actions:E-mail | Permalink | Comments (0)

12

Sử dụng ModalPopup control trên Dotnetnuke

nmduc073 posted on February 12, 2009 15:09::1789 view(s)

Theo mặc định, Dotnetnuke không hỗ trợ việc tạo popup. Do đó, để tạo popup, ta phải tìm các cách khác nhau, trong đó có việc sử dụng ModalPopup control của Ajax control toolkit. Trong bài viết này, mình sẽ nêu cách để tạo 1 popup đơn giản, sử dụng ModalPopup control trên DNN. Khi click vào link, nó sẽ hiện ra 1 popup để ta chọn các option. Các option đó sẽ có tác dụng lên text.

-Đầu tiên, ta cần có file dll của ajax control toolkit trong thư mục bin.

-Khai báo assembly sau:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

-Trên code ascx:

var styleToSelect;

function onOk() {

$get('Paragraph1').className = styleToSelect;

}

</script>

<div class="demoheading">ModalPopup Demonstration</div>

<asp:LinkButton ID="LinkButton1" runat="server" Text="Click here to change the paragraph style" />

<asp:Panel ID="Panel1" runat="server" Style="display: none; background-color:Silver" CssClass="modalPopup">

<asp:Panel ID="Panel3" runat="server" Style="cursor:move;background-color:Yellow;border:solid 1px Gray;color:Black">

<div>

<p>Choose the paragraph style you would like:</p>

</div>

</asp:Panel>

<div>

<p>

<input type="radio" name="Radio" id="RadioA" checked="checked"

onclick="styleToSelect = 'sampleStyleA';" />

<label for="RadioA" class="sampleStyleA"

style="padding: 3px;">Sample paragraph text</label>

</p>

<p>

Actions:E-mail | Permalink | Comments (2)

04

Sử dụng Ajax tab control trong Dotnetnuke

nmduc073 posted on February 04, 2009 06:42::995 view(s)

Trong bài viết này, mình xin trình bày cách sử dụng Ajax tab control trong DNN. Cách làm khá đơn giản.

-Đầu tiên, bạn cần đặt file ajaxcontroltoolkit.dll vào thư mục bin.

-Register file đó trên ascx.

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

-Và đây là ví dụ mình đã copy từ ví dụ trên asp.net

function PanelClick(sender, e) {

var Messages = $get('<%=Messages.ClientID%>');

Highlight(Messages);

}

function ActiveTabChanged(sender, e) {

var CurrentTab = $get('<%=CurrentTab.ClientID%>');

CurrentTab.innerHTML = sender.get_activeTab().get_headerText();

Highlight(CurrentTab);

}

var HighlightAnimations = {};

function Highlight(el) {

if (HighlightAnimations[el.uniqueID] == null) {

HighlightAnimations[el.uniqueID] = AjaxControlToolkit.Animation.createAnimation({

AnimationName : "color",

duration : 0.5,

property : "style",

propertyKey : "backgroundColor",

startValue : "#FFFF90",

endValue : "#FFFFFF"

}, el);

}

HighlightAnimations[el.uniqueID].stop();

HighlightAnimations[el.uniqueID].play();

}

Actions:E-mail | Permalink | Comments (0)

26

Javascript và Dotnetnuke (tiếp theo)

admin posted on December 26, 2008 06:09::204 view(s)

Trong bài trước, mình đã trình bày cách gán giá trị của biến javascript trước khi nhúng file javascript có sử dụng biến đó. Như đã nói, cách trên có nhược điểm là mình phải đặt biến vào 1 file javascript khác. Hôm nay, mình xin trình bày 1 cách tốt hơn 1 chút. ^_^

Mình sẽ tạo thêm code để tạo file javascript, đặt giá trị của biến vào trong đó. Nhờ thế, mình sẽ không phải tạo file javascript bằng tay nữa. Dưới đây là code cho hàm tạo file và gán giá trị vào.

private void Write2File()

{

string strImageXMLFilePath = Null.NullString;

string strImageXMLFilePathInServer = Null.NullString;

strImageXMLFilePath = ModulePath + "test6.js";

strImageXMLFilePathInServer = Server.MapPath(strImageXMLFilePath);

if (File.Exists(strImageXMLFilePathInServer))

{

File.SetAttributes(strImageXMLFilePathInServer, FileAttributes.Normal);

}

string fileContent = "var temp=\"This is an advanced test\"";

//Write XML image list file file

StreamWriter objStream = File.CreateText(strImageXMLFilePathInServer);

objStream.WriteLine(fileContent);

objStream.Close();

}

Rồi mình đặt nó trong:

private void Method9()

{

Write2File();

HtmlGenericControl oLink = new HtmlGenericControl("script");

oLink.Attributes["language"] = "javascript";

oLink.Attributes["type"] = "text/javascript";

oLink.Attributes["src"] = ModulePath + "test6.js";

Control oCSS = Page.FindControl("CSS");

if (oCSS != null)

{

oCSS.Controls.Add(oLink);

}

Sau đó, ta làm theo các bước như đã hướng dẫn trong bài viết trước. Cách này khá hơn cách trước 1 chút nhưng vẫn chưa phải là cách tốt nhất. Hy vọng mình sẽ tìm ra được cách hay hơn. ^_^

Actions:E-mail | Permalink | Comments (0)

24

Javascript và Dotnetnuke

admin posted on December 24, 2008 07:19

::250 view(s)

Dưới đây là ngữ cảnh mình muốn thực hiện:

Mình có 1 file javascript test4.js. Nội dung của file chỉ là:

alert(temp);

Mình muốn chạy nó trên Dotnetnuke. Tuy nhiên, trước khi include nó vào để chạy, mình muốn gán giá trị cho biến temp trước.

*Cách làm:

Mình đã thử dùng nhiều cách để hòng thực hiện được. Có thể kể ra việc dùng jquery, RegisterClientScriptBlock, … Đặt các hàm theo các thứ tự khác nhau. Nhưng đa phần không làm được trường hợp trên. Cuối cùng mình cũng đã làm được 1 cách sau:

protected void Page_Load(System.Object sender, System.EventArgs e)

{

try

{

Method5_1();

}

catch (Exception exc) //Module failed to load

{

Exceptions.ProcessModuleLoadException(this, exc);

}

Actions:E-mail | Permalink | Comments (1)

23

Các cách nhúng javascript để làm việc trên Dotnetnuke

admin posted on December 23, 2008 07:05

::384 view(s)

-Tạo 1 module Text/HTML module. Mở HTML và đặt javascript code vào. Click update. Nhớ không click Text.

-Đặt javascript trong file skin.

-Đặt trong header của module. Bẳng cách vào Module Settings->Advanced Settings->Header. Thả javascript code vào. Ví dụ như:

Hoặc

Khi đó, output sẽ là:

        <div id="dnn_ctr550_ContentPane" class="Normal c_contentpane DNNAlignleft">

        <!-- Start_Module_550 -->

        <span class="Normal">

               <script language="JavaScript" src="http://localhost:2493/DNNWorking3/DesktopModules/MyJSEx/test2.js" >

               </script>

        </span>

        <div id="dnn_ctr550_ModuleContent">

               <textarea id="a1" rows="10" cols="50"></textarea>

        <!-- End_Module_550 -->

</div>

Actions:E-mail | Permalink | Comments (17)

14

Cách để sử dụng jQuery trong Dotnetnuke module

admin posted on December 14, 2008 08:08

::462 view(s)

jQuery là 1 thư viện javascript hỗ trợ các thao tác làm việc trên client side như đọc document, animating, event handling, Ajax interaction… Càng ngày nó càng được sử dụng nhiều hơn trong phát triển web.

Trong bài viết này, mình sẽ nêu cách để include jQuery vào trong code.

-Đầu tiên, ta cần copy thư viện jQuery từ http://jquery.com/. Đặt nó trong module mà ta định sử dụng jQuery, ví dụ là JQuery2.

-Trong Page_Load, ta cần khai báo như sau:

if (!ClientAPI.IsClientScriptBlockRegistered(this.Page, "jquery.js"))

{

ClientAPI.RegisterClientScriptBlock(this.Page, "jquery.js", "<script src='" + ResolveUrl("jquery.js") + "'></script>");

}

if (!ClientAPI.IsClientScriptBlockRegistered(this.Page, "jquery.lightbox-0.4.pack.js"))

{

ClientAPI.RegisterClientScriptBlock(this.Page, "jquery.lightbox-0.4.pack.js", "<script src='" + ResolveUrl("jquery.lightbox-0.4.pack.js") + "'></script>");

}

Actions:E-mail | Permalink | Comments (2)