บทความ
กำลังแสดงโพสต์จาก 2011
การกำหนดสีพื้นหลังให้กับ Web Site
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
การกำหนดสีให้ website ทำได้โดยใส่ style ที่ tag body เช่น <body style= "background-color:red" > ... </body ซึ่งในตัวอย่างเราจะกำหนดเป็นสีแดง (สามารถใช้ name หรือ code ของสีก็ได้) แต่ถ้าจะให้ดูดีตามยุคสมัยเราก็จะแยกออกเป็น เป็น file.css เช่น site.css โดยเนื้อให้ใน file นี้ก็เหมือนกับข้างบนคือกำหนด style ให้ tag body ดังตัวอย่างต่อไปนี้ body { background-color:red ; } จบ แต่ ไม่จบ ไอ้ browser Google Chrome จะแสดงสีขาวต่อท้ายมาส่วนข้างล่างในกรณีที่ เนื้อหาไม่เต็ม 1 หน้าจอ เพราะว่าใร html เราจะเรียง tag ตามนี้ คือ <html> <head> .... </head> <body> .... </body> </html> ซึ่งถ้ามองดี ๆ จะเห็นว่า body จะเป็น child element ของ html (หรือ body มี parent เป็น html) และถ้า content ใน body มันไม่เต็มหน้าที่เหลือก็คือ html ซึงมันยังไม่ได้กำหนดสี background นั้นเอง ท่าน Chrome ของเรา Doctor เลยทีเดียวเสือกเป็นแบบนี้ เจ้าอื่นไม่เป็น ทางแก้ก็คือกำหนดสีให้ html ไปด้วยเลย โดยเขียน css แบบนี้ html , body { ba...
ปัญหา jQuery บน ie7 : ตอน attribute
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
จาก html code ต่อไปนี้ คือต้องการใช้ jQuery ตรวจสอบว่า textbox อันนี้มี attribute disabled หรือไม่เพื่อเอาไปเป็นเงื่อนไขในการทำงานอื่นต่อไป < html xmlns = "http://www.w3.org/1999/xhtml" >
< head >
< title > </ title >
< script src = "js/jquery-1.4.3.min.js" type = "text/javascript" > </ script >
</ head >
< body >
< input type = "text" id = "txtd" disabled />
< input type = "text" id = "txt" />
</ body >
</ html >
ปัญหาคือ ie7 มันไม่ work if (jQuery( '#txt' )[0].attributes[ 'disabled' ] == undefined)
// แบบนี้ ถ้า ie7 จะ ret...
FancyBox not work in UpdatePanel
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
ปัญหาที่พบ เวลาเรานำ FancyBox เข้ามาใช้ใน Web Page ของเรา เราจะต้องทำการเรียกคำสั่ง $("a").fancybox(); ที่ $(document).ready(function() { .. } เพื่อ initialize FancyBox ซึ่ง Web เราก็จะสวยงามตามประสา แต่นรกมาเยือนเมื่อเราเขียน web app บน asp.net โดยใช้ "ASP.NET AJAX Control Toolkit" และใช้ Component "UpdatePanel" มาครอบไว้ที่ GridView มันจะทำให้ web page ของเราสามารถ send request แบบ asynchronous ได้ (พูดง่าย ๆ คือ page จะไม่แว๊บ เวลา server control ทำงาน) เช่น กดปุ่ม delete บน GridView แล้วเขียน Code ให้ Refresh GridView ผลที่ได้คือ page จะไม่แว๊บเลย แต่ถ้าใน GridView มี link ไปยังรูปภาพที่เป็น FancyBox มันจะไม่ทำงาน (คือ FancyBox ไม่ขึ้น จะเป็นการ Link โดยเปิดรูปภาพเฉย ๆ) สาเหตุ ทุกครั้งที่มีการเรียก asynchronous ผ่าน AJAX Control Toolkit มันจะ refresh ใหม่ทุกครั้งเพียงแต่เราไม่เห็น และการ Refresh Page แบบพิเศษนี้แหละที่ทำให้ jQuery ไม่สามารถจับ event $(document).ready(...) ได้ การแก้ปัญหา เราก็แค่สั่ง initialize FancyBox ใหม่อีกครั้ง เมื่อมีการ...
Singleton Pattern
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
Singleton pattern เป็น design pattern ที่ใช้จำกัดจำนวน object ที่ถูกสร้างในขณะที่โปรแกรมทำงาน มีประโยชน์ในสถานการณ์ที่ทั้งระบบต้องมี object เพียงตัวเดียวเพื่อจะได้ไม่เกิดการทำงานซ้ำซ้อนกันเช่น class สำหรับ setting ค่าต่าง ๆ การนำไปใช้งาน Singleton patter ถูกสร้างโดยเขียน class ให้ซ่อน constructor ทั้งหมดไว้จาก class อื่นๆ คือให้ constructor เป็น private จากนั้นสร้าง method มีหน้าที่สร้าง object ของ class นี้ ถ้ายังไม่ถูกสร้างและเก็บ object ตัวที่ถูกสร้างใหม่นี้ไว้ จากนั้นส่งคืน object เพียงตัวเดียวนั้นให้ทุกครั้งที่มีการร้องขอ object ของ class ข้อควรระวัง สำหรับการใช้ singleton pattern ในโปรแกรมที่ทำงานแบบ multi-threading คือหลายส่วนของโปรแกรมอาจจะพยายามเรียก method ให้สร้างอ็อบเจกต์เป็นครั้งแรกในเวลาเดียวกัน อาจทำให้มีการสร้าง object ขึ้นมาเกินหนึ่งตัวได้ ในกรณีนี้ควรป้องกันโดยอนุญาตให้เพียง 1 thread เรียก method ได้ในขณะใดขณะหนึ่ง (mutually exclusive) ตัวอย่าง code เพื่อใช้งาน singleton sealed class Singleton {
privat...
Convert float to int
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
การแปลงค่าจาก float เป็น int ถ้าเราใช้ function int.Parse() จะใช้ overhead สูงเพราะ parameter ที่รับเข้าไปจะต้องเป็น string ตัวอย่างเช่น int.Parse(floatValue.ToString()); มันคือการเอา float -> string -> int ซึงเราไม่ต้องการ เราต้องการ float -> int มีอีกทางเลือกคือใช้ Convert.ToInt32() แต่การเรียกใช้ method นี้จะเป็นการ เรียกใช้ method ของ CLR ของ .net ซึ่งผู้ที่เขียน C# จะดูว่ามันไม่ค่อย native C# ซะเท่าไร่ เลยขอใช้วิธีการ boxing ธรรมดานี่แหละ โดยใช่ function ปัดทศนิยมเข้ามาช่วย ดูแล้วมันเข้าใจง่ายดี (คราวหน้าจะมาวัด Performance กัน) float floatValue = 15.2F
int intValue = ( int )Math.Round(floatValue) // ปัดขึ้น
// หรือ
int intValue = ( int )Math.Floor(floatValue) // ปัดลง
Introduction to MVC
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
ASP.NET MVC ก็คือสูงสุดคืนสู่สามัญ... ลองมองดู asp version แรก ๆ ซิ ไม่มีอะไรเลย แม้กระทั้ง control ซักตัว basic สุด ๆ อยากแสดงอะไรก็ <% =.. %> แต่พอ .net ออก ASP.NET ก็เริ่มมี DataGrid หลัง ๆ มา .NET 2.0 ออกมา ก็มี ASP.NET 2.0 ก็มี Control เพิ่มขึ้นมากมาย FormView, GridView, LoginForm ect.. เพื่อเป็นการอำนวยความสะดวกให้กับ developer ทั้งหลาย แต่มันไม่ตอบ โจทย์หลาย ๆ อย่าง เพราะถ้าทำอย่างนี้ต่อไป ก็จะมี Control เพิ่มขึ้นมาเรื่อย ๆ ใน .net 4 5 6 ซึ่งจริง ๆ แล้วเราก็ไม่ได้ใช้มันซักเท่าไหร่ เพราะบางอันเราก็ใช้ไม่เป็น หรือไม่มีความจำเป็นต้องใช้ ตั้งแต่ .NET 3 จึงหยิบเอา MVC มาเป็นตัวชูโรง อ้างข้อความจากบล๊อกของ Scott Hanselman In a recent MVC design meeting someone said something like "we'll need a Repeater control" and a powerful and very technical boss-type said: "We've got a repeater control, it's called a foreach loop." แปลได้ความว่า ในการประชุมการออกแบบ (ASP.NET) MVC ไม่นานมานี้ มีใครบางคนเสนอว่า "เราควรมี Repeater contro...
Change Cursor in JavaScript
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
เราสามารถเปลี่ยน Cursor ในแต่ละส่วนของ html element ได้โดย เปลี่ยน property ของ document.body.style.cursor < form onsubmit = "document.body.style.cursor='wait'" > ... </ form >
โดย cursor ทั้งหมดที่มีให้ใช้ก็คือ.. auto
crosshair
default
pointer (hand in IE 5.x)
help
move
text
wait
e-resize, w-resize, n-resize, s-resize, ne-resize, nw-resize, se-resize, sw-resize
โดย value ทั้งหมดสามารถที่จะ assign ให้กับ onmouseover / onmouseout event ได้ เช่น.. < img ... = "" onmouseover = "this.style.cursor='crosshair';" src = ".." />
Time to Since Function เหมือนกับ Facebook ด้วย C#
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
เอาไว้แสดงค่าจาก CreatedDate หรือ UpdatedDate เพื่อบอกว่า Update ผ่านมาแล้วเป็นเวลาเท่าไร่ เหมือนกับ Facebook using System;
using System.Collections.Generic;
using System.Text;
namespace KOOOOB
{
public static class TimeToSince
{
public static string ToTimeSinceString(DateTime value)
{
const int SECOND = 1;
const int MINUTE = 60 * SECOND;
...
Get QueryString from JavaScript
- รับลิงก์
- X
- อีเมล
- แอปอื่นๆ
สร้าง Function ต่อไปนี้... function GetUrlVars () {
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf( '?' ) + 1).split( '&' );
for ( var i = 0; i < hashes.length; i++) {
hash = hashes[i].split( '=' );
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}
เวลาเรียกใช้ก็ส่ง Query String Name ที่อยากได้เข้าไป (ในที่นี้คือ "P") GetUrlVars()[ "P" ]
การนำมาใช้งานจริงต้องมีการ validate นิดหน่อย.. if ( GetUrlVar...