 |
|
|
 |
 |
|

1. download jQuery
2. ใส่ tag include script ที่ master page หรือ page ที่ต้องการ
<script src="../Script/jquery-1.4.2.min.js" type="text/javascript"></script>
ในที่นี่ใช้ minimum edition ค่ะ
นี่เป็น function ที่ insert jQuery และ Javascript โดยใช้ Extension Method ค่ะ
Code (C#)
using System;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI.WebControls;
using System.Reflection;
using System.ComponentModel;
namespace System.Web.UI.Extensions
{
public static class PageExtension
{
private const char constTabChar = '\t';
private const string constScriptInjectorComment = "\t /* Script injection from server side v. 1.0 improved by Proud Rajabhut Phranakorn University */\n";
private const string constJQueryMainFuncOpenTag = "\t$(function(){\n";
private const string constJQueryMainFuncCloseTag = "\t});\n";
/// <summary>
/// Embeded jQuery library additional command in any page.
/// </summary>
/// <param name="argCorePage"></param>
/// <param name="argScript"></param>
public static void EmbededJQueryScript(this System.Web.UI.Page argCorePage, string argScript)
{
if (argCorePage == null) return;
System.Web.UI.HtmlControls.HtmlGenericControl myHTMLComp
= new System.Web.UI.HtmlControls.HtmlGenericControl("script");
myHTMLComp.Attributes.Add("language", "javascript");
myHTMLComp.Attributes.Add("type", "text/javascript");
myHTMLComp.InnerHtml = "\n"
+ constScriptInjectorComment
+ constJQueryMainFuncOpenTag
+ argScript.ToString()
+ constJQueryMainFuncCloseTag + "\n";
argCorePage.Controls.Add(myHTMLComp);
}
/// <summary>
/// Embeded javascript in any page.
/// </summary>
/// <param name="argCorePage"></param>
/// <param name="argScript"></param>
public static void EmbededJavaScript(this System.Web.UI.Page argCorePage, string argScript)
{
if (argCorePage == null) return;
System.Web.UI.HtmlControls.HtmlGenericControl myHTMLComp
= new System.Web.UI.HtmlControls.HtmlGenericControl("script");
myHTMLComp.Attributes.Add("language", "javascript");
myHTMLComp.Attributes.Add("type", "text/javascript");
myHTMLComp.InnerHtml = "\n"
+ constScriptInjectorComment
+ argScript.ToString()
+ "\n";
argCorePage.Controls.Add(myHTMLComp);
}
/// <summary>
/// Embeded simple jQuery function for test only.
/// </summary>
/// <param name="argCorePage"></param>
public static void EmbededAndTestJQueryScript(this System.Web.UI.Page argCorePage)
{
System.Text.StringBuilder scriptBuilder = new System.Text.StringBuilder();
scriptBuilder.AppendLine(" alert('jQuery(' + $().jquery + ') activated '); ");
EmbededJQueryScript(argCorePage, scriptBuilder.ToString());
}
}
}
}
Usage
อย่าลืม using namespace System.Web.UI.Extensions เข้ามาด้วยค่ะ
Code (C#)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.Extensions;
public partial class Pages_Home : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
System.Text.StringBuilder scriptBuilder = new System.Text.StringBuilder();
scriptBuilder.AppendLine(" alert('jQuery(' + $().jquery + ') activated '); ");
this.EmbededJQueryScript( scriptBuilder.ToString());
//OR
//this.EmbededAndTestJQueryScript();
}
}
}
ส่วนการทำ intellisense ของ visual studio ให้ support jQuery ก้อลองไป search ดูค่ะ
เพราะคิดว่าไม่จำเป็น
|
 |
 |
 |
 |
Date :
2010-06-15 11:53:00 |
By :
blurEyes |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
แล้วที่บอกว่า script jquery ไปตีกับ ajax toolkit น่ะ จริงปะ
จะได้เลือกเอาอย่างใครอย่างนึง ส่วนถ้าใช้ jquery จริงๆ เดี๋ยวคงต้อง create server control
มาก่อน เพราะไม่อยากไปยุ่งกับพวก js บ่อยๆ แค่ add ก็ขี้เกียจแล้วเดี๋ยวนี้
|
 |
 |
 |
 |
Date :
2010-06-15 12:41:42 |
By :
tungman |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
เจงค่ะ AJAX LIBRARY พอแอดไปบางที CONTROL RENDER มาเพี้ยนๆ
AJAX CALL BACK บางทีไม่ทำงานสะงั้นค่ะ
ติดใจ jQuery เพราะ สั้นกว่า CROSS BROWSER แล้วก้อ EFFECTIVE ค่ะ
ที่สำคัญ control กะ plug-in เป็น open source ทั้งนั้น
แล้วก็มากกว่า AJAX LIBRARY หลายสิบเท่าค่ะ
|
 |
 |
 |
 |
Date :
2010-06-15 12:46:45 |
By :
blurEyes |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ขอบคุณมากๆครับผม
|
 |
 |
 |
 |
Date :
2010-06-15 14:01:50 |
By :
popzila27 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ขอถามต่ออีกนิดนะครับ จากcode
public static void EmbededAndTestJQueryScript(this System.Web.UI.Page argCorePage)
76. {
77. System.Text.StringBuilder scriptBuilder = new System.Text.StringBuilder();
78. scriptBuilder.AppendLine(" alert('jQuery(' + $().jquery + ') activated '); ");
79. EmbededJQueryScript(argCorePage, scriptBuilder.ToString());
80. }
ตรงนี้ (" alert('jQuery(' + $().jquery + ') activated '); "); คือตัวสคลิปที่จะให้รันใช่ไหมครับรึว่าตายตัวแบบนี้เลย
|
 |
 |
 |
 |
Date :
2010-06-15 14:10:23 |
By :
popzila27 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ถ้าในนั้นก็ตายตัวครับ แต่น้องเขาเขียนไว้ test
|
 |
 |
 |
 |
Date :
2010-06-15 16:58:51 |
By :
tungman |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ที่ว่าตายตัวนี่คือสคลิปที่ใช้รันใช่ไหมครับ
|
 |
 |
 |
 |
Date :
2010-06-15 17:07:40 |
By :
popzila27 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
เป็น method ที่ใช้ test ว่า jQuery ทำงานหรือเปล่าค่ะ
ยังไม่ได้ทำ overload สำหรับ master page เพิ่ม
ตอนนี้เขียนไปใช้งานไปก็ค่อยๆ เพิ่มความสามารถขึ้นเรื่อยๆ
อันนี้เป็น version แรก เมื่อเดือนก่อนๆโน้นค่ะ
|
 |
 |
 |
 |
Date :
2010-06-15 17:48:34 |
By :
blurEyes |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ครับผมขอบคุณมากครับ
|
 |
 |
 |
 |
Date :
2010-06-16 09:05:59 |
By :
popzila27 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ฝอยนานลืมตอบ ถ้าจะ register .js file แบบ dynamic ก็ให้เขียนแบบนี้
Code (C#)
string JsPath = Server.MapPath("~/JSClass/myJavaScript.js");
ClientScriptManager ClientScriptManager1 = this.Page.ClientScript;
if (!ClientScriptManager1.IsClientScriptIncludeRegistered(this.GetType(), "JSClass"))
ClientScriptManager1.RegisterClientScriptInclude(this.GetType(), "JSClass", JsPath));
|
 |
 |
 |
 |
Date :
2010-06-16 09:19:28 |
By :
tungman |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
แล้วมันแตกต่างกับอีกแบบยังไงครับผม
|
 |
 |
 |
 |
Date :
2010-06-16 09:23:41 |
By :
popzila27 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
มันคนละเรื่องกันเลย
แบบแรกน้องแกปล่อย super weapon ทำ Extension Method
แต่ของผมแค่ add javascript file แบบ dynamic แค่นั้นเอง
ดูตัวอย่างก็ได้ ใน class page ธรรมดามันมี method EmbededJQueryScript() ที่ไหน
แต่เราสามารถเพิ่ม method ให้ class ต่างๆ ได้โดยไม่ต้อง inherith เลย
|
 |
 |
 |
 |
Date :
2010-06-16 09:41:48 |
By :
tungman |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ไม่ใช่ super weapon หรอกค่ะ code เรียบง่ายแค่ไม่กี่บรรทัด
เพียงแต่การใช้ Generic กับ Extension Methods
ทำให้เข้าใจ OOP ได้ดีมากขึ้น และวิธีเขียน code ก็เปลี่ยนไปเยอะค่ะ
code จะค่อนข้างเล็กสั้น ใช้งานได้หลากหลาย ไม่ต้องมากระชับ code อะไรอีกค่ะ
ตอนนี้อะไรที่เป็น library ก้อเอามานั่ง revise เป็น Extension Methods
ไปเรื่อยๆค่ะ
อีกอย่างถ้าใช้ LINQ จะพบว่า method ทั้งหมดของ LINQ
เขียนใน pattern ของ Extension Methods นั่นเอง
|
 |
 |
 |
 |
Date :
2010-06-16 12:51:36 |
By :
blurEyes |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
LINQ ==> ลิง แต่ จขกท เข้าใจเรื่อง jquery หรือยังครับ
มันคือ javascript library ซึ่งทำให้เราใช้งาน javascript ได้สะดวกขึ้น
โดย javascript นี้จะทำงานที่ฝั่ง client ทำให้ html ธรมมดาสามารถตอบสนอง
การทำงานให้ user ได้ดีขึ้น โดยก่อนใช้เราต้อง add jquery.js ลงไปก่อน
เราถึงสามารถใช้งาน jquery ได้ครับ
ดังนั้นเราสามารถใช้ jquery ได้โดยวิธีการ hardcode ลงไปหรือเรียกใช้แบบ dynamic ก็ได้ครับ
ส่วนจะ dynamic แบบไหนนั้นก็แล้วแต่ชอบครับ จะใช้ method extension ก็ได้
ส่วนผมใช้สร้างเป็น server control แล้ว build เป็น dll มาใช้ครับ จะใช้ไม่ต้องมา add js ทุกครั้ง
|
 |
 |
 |
 |
Date :
2010-06-16 13:19:44 |
By :
tungman |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ขอบคุณทุกๆคนที่มาช่วยไขข้อข้องใจครับ จะลองนำไปปรับใช้ดูครับผม
|
 |
 |
 |
 |
Date :
2010-06-16 16:08:13 |
By :
popzila27 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|