.NET Framework 4.0

วันก่อนเจอคุณมี่ (MVP, GreatFriends Leader) ที่งานอบรมที่ไมโครซอฟท์ เลยมีโอกาสถามเรื่อง .NET Framework 4.0 ครับ เพราะผมไม่ค่อยได้ติดตาม .NET Framework 4.0 และ VS 2010 เลย (ทั้งที่มีแต่คนบอกว่า VS2010 สุดยอดให้ลองโหลดมาเล่น)

คำถามแรกคือ .NET Framework 4.0 ยังใช้ Core เดียวกันกับ .NET 2.0, 3.0 และ 3.5 หรือไม่
คำตอบคือ ทาง MS พัฒนาขึ้นมาใหม่เป็น Core ตัวใหม่เลย แต่ไม่ต้องห่วงครับ (ยังไม่ได้ถาม และยังไม่ได้ห่วงเลย คุณมี่รีบตอบให้เสร็จ - สงสัยกลัว VS2010 จะขายได้น้อย 555) เพราะ VS2010 สนับสนุนเรื่อง Target Framework เหมือนเดิม ดังนั้นเราสามารถเลือกพัฒนา .NET เวอร์ชัน 2.0,3.0, 3.5 หรือ 4.0 ก็ได้

อะ ก็ฟังดูดี แต่ว่าพอผมเอา VS2008 ไปเปิด Solution ที่พัฒนาด้วย VS2005 มันจะบังคับให้ Convert ยันเตเลย มันเปิดแล้วเลือก Target Framework เป็น 2.0 อัตโนมัติไม่ได้เหรอ แล้ว VS2010 จะทำได้มั๊ยเนี่ย ไม่อยาก Convert น่ะ (ตอนนั้นยังไม่ได้ห่วง ก็เลยลืมถามคำถามนี้ เซ็งเลยตรู แต่ตอนนี้ยังเป็น Beta ดังนั้นก็ต้องรอดูเวอร์ชันจริงอีกที)

คำถามที่สองก็คือ แล้ว .NET Framework 4.0 มันใหญ่มั๊ย เพราะว่า .NET Framework 2.0 Redis. มันแค่ 22.4 MB เอง พอใช้ Click Once แล้วต้อง Deploy ตัว .NET Framework ไปด้วย มันไม่ใหญ่เลยทำได้สะดวกครับ แต่ว่าพอมาใช้ .NET Framework 3.5 SP1 มันตั้ง 231 MB แนะวุ้ย ใหญ่มากกกกกกกกกกกกกกก

คำตอบคือไม่ใหญ่ครับ เพราะพัฒนาขึ้นใหม่ (จบ สั้นๆได้ใจความ)

ผมเลยลองไปดูในหน้าดาวน์โหลดของ MSDN ถ้าเลือกเป็น .NET Framework 4.0 X86 มันแค่ 37.7 MB เอง ถือว่าขนาดโอเคครับ ถ้าเป็น x64 ก็ 54.6 MB

ในหน้า MSDN มี Visual Studio Express 2010 Beta ให้โหลดมาลองด้วยครับ ถ้าใครกลัวโหลด VS2010 ตัว Profession หรือ Team Suit มาใช้แล้วติดใจต้องเสียเงินซื้อ ลองใช้ Express เวอร์ชันก็ได้นะครับ พอใช้รับงาน freelance หากินได้ ยกเว้นเรืองออกรายงานที่ต้องใช้ rdlc หรือไม่ก็ PrintDocument ที่ต้องถึกหน่อยครับ

อีกเรื่องที่สำคัญ คนที่มีลิขสิทธิ์ VS2008 แล้วอยากจะ upgrade ไปใช้ VS2010 ลองติดต่อคุณมี่ดูครับ เพราะเหมือนว่าจะมีโปรโมชันสำหรับคนต้องการ Upgrade ในราคาพิเศษนะ แต่ผมฟังไม่ถนัดเพราะว่าที่ทำงานผมมี Enterprise Agreement อยู่แล้ว มัน upgrade ฟรี (เพราะเสียเงินค่า EA ไปแล้ว)เลยไม่ได้สนใจมาก ที่สำคัญอีกอย่างคือผมกำลังกินขนมกับกาแฟอยู่น่ะครับ ถ้ายังไงคนที่สนใจ VS2010 ลองติดต่อคุณมี่ดูครับ ผมไม่ได้ขออนุญาตเลยไม่กล้าลงอีเมลล์ไว้ ลอง search หาดู หรือไม่ก็แวะไปคุยกับคุณมี่ที่ GreatFriends ครับ

Javascript - สร้าง TextBox เพื่อ filter รายการใน DropDownList

ผมได้รับ requirement ใหม่จาก user เจ้ากรรมอีกแล้ว นั่นคือมี DropDownList ตัวหนึ่งใน ASP.NET ที่มีรายการมากกว่า 100 รายการ (อันนี้กรองมาแล้วนะครับ) ซึ่ง option มันเยอะมาก ดังนั้น user ต้องการให้โปรแกรมสามารถ filter รายการใน DropDownList นี้ได้ครับ ทีนี้จะเขียนโปรแกรมที่ฝั่ง server ก็สามารถทำได้ แต่มันจะทำให้มีการ postback ไปหา ซึ่งไม่ค่อยดีเท่าไหร่ ดังนั้นผมเลยใช้ javascript สำหรับ filter แทนครับ

วิธีก็คือผมสร้าง Textbox ขึ้นมาหนึ่งตัว สำหรับให้ user พิมพ์ข้อความที่ต้องการกรอง และสร้าง drop-down list อีกหนึ่งตัวโดยให้ visibility=hidden คือซ่อนไม่ให้ user เห็น สำหรับเก็บ option ทั้งหมดที่ไม่ได้ทำการกรองครับ ลองมาดูโค้ดกัน

เริ่มจาก WebControl ก่อน มี DropDownList 2 ตัว และ TextBox ครับ

<asp:DropDownList ID="ddlWorkCode" runat="server" CssClass="txtRequired"  Width="540px" AutoPostBack="True" style="height:24px"></asp:DropDownList"> 
<asp:TextBox ID="txtSearchWorkCode" runat="server" Width="421px" style="color: #000099; background-color: #afeeee;""></asp:TextBox">
<asp:DropDownList ID="ddlCache" runat="server" Width="0px" style="visibility:hidden" "></asp:DropDownList">   

ในหน้า Code Behind ก็ทำการ Add Attribute ให้ txtSearchWorkCode

txtSearchWorkCode.Attributes.Add("onkeyup", "txtSearchWorkCode_OnKeyUp(this);")
txtSearchWorkCode.Attributes.Add("onblur", "txtSearchWorkCode_OnBlur();")

คราวนี้มาถึง javascript บ้าง คราวนี้เขียนสดๆไม่ได้ใช้ jQuery ครับ

        function txtSearchWorkCode_OnKeyUp(obj) {
            if (event.keyCode != 13 || event.keyCode != 9) {
                var str = obj.value.toUpperCase();
                var ddlWorkCode = $get("ddlWorkCode");
                var ddlCache = $get("ddlCache");
                var listWorkCode = ddlCache.getElementsByTagName("OPTION");

                // ถ้าไม่มี OPTION ใน cache ให้ออกจาก function
                if(listWorkCode.length==0) return false;

                //clear option ใน DropDownList
                ddlWorkCode.length = 0; 
                for (i = 0; i < listWorkCode.length; i++) {
                    if (listWorkCode[i].text.toUpperCase().indexOf(str) > -1) {
                        var o = listWorkCode[i].cloneNode(true);
                        ddlWorkCode.appendChild(o);
                    }
                }
                ddlWorkCode.selectedIndex = 0;
            }
        }

        function txtSearchWorkCode_OnBlur() {
            if ($get("txtSearchWorkCode").value == "") {
                // ถ้าไม่มีคำสั่งกรอง ให้ไปดึง OPTION ทั้งหมดจาก DropDownList2 มาใส่คืน
                                var ddlWorkCode = $get("ddlWorkCode");
                var ddlCache = $get("ddlCache");

                ddlWorkCode.lenght = 0;
                for (i = 0; i < ddlWorkCode2.options.length; i++) {
                    var o = ddlWorkCode2.options[i].cloneNode(true);
                    ddlWorkCode.appendChild(o);
                }
                ddlWorkCode.selectedIndex = 0;
            }
        }

ในส่วนคำสั่ง javascript มีสองจุดที่น่าสนใจครับ นั่นคือ
1. ผมใช้ ddlWorkCode.length=0; ในการเคลียร์ option ของ drop-down list ทิ้งครับ ถือว่าง่ายและสะดวกมาก ทีแรกผมใช้ for วนลูปเพื่อ remove element ออก ซึ่งแน่นอนว่าช้ากว่าครับ

2. ผมใช้ cloneNode method ในการ copy OPTION จาก drop-down list ตัวที่สอง (ที่เก็บข้อมูลทั้งหมดไว้) แล้วก็เอา OPTION ที่ clone ได้ไปใส่ใน drop-down list ตัวแรกด้วยคำสั่ง appendChild ทีแรกผมใช้วิธีสร้าง new Option ครับ แต่เจอคำสั่ง cloneNode ที่ www.java2s.com ใช้ได้สะดวกดีครับ และที่สำคัญพอลอง search ใน google พบว่าคำสั่ง cloneNode ทำได้เร็วกว่า New element ซะอีก

ตอนนี้ลองทดสอบโปรแกรมดู ก็ใช้งานได้ดียังไม่เจอ bug แต่เพิ่งทดสอบได้นิดเดียวคงต้องลองเล่นดูอีกสักพักครับ

ปล. สำหรับ $get() เป็น shortcut ของ ASP.NET AJAX ครับ มีค่าเท่ากับ document.getElementById()