CoP Prince of Songkla University Phuket Campus's Blog

Tag: MVC

ASP.NET MVC: Autocomplete Textbox

ในระหว่างที่ผมกำลังโค้ดงานหน้าจอ CheckIn/CheckOut โดยในฟอร์มรับ รหัสผู้เข้าร่วม (Attendee Code) แล้วกดปุ่ม CheckIn/CheckOut เป็นการส่งข้อมูล แล้วผู้ปฎิบัติงานจะรู้ได้อย่างไรว่า รหัสที่ป้อนเข้าไปนั้นถูกคน หรือ ผู้ร่วมงานลืมรหัสของตนเอง จึงคิดว่าจะนำ Autocomplete มาใช้งาน โดยทำงานร่วมกับ jQuery และ Bootstrap บน Visual Studio (2015) เปิด NuGet Package Manager ติดตั้ง package ที่จำเป็นต่อไปนี้ ่jQuery jQuery.UI Bootstrap เปิดไฟล์ App_Start/BundleConfig.cs เพื่อจัดการการอ้างถึง Script ไฟล์ต่างๆ (สำหรับ Web Project ประเภทอื่น สามารถ reference แบบเดิมได้) bundles.Add(new ScriptBundle(“~/bundles/jquery”).Include( “~/Scripts/jquery-{version}.js”, “~/Scripts/jquery-ui-{version}.js”)); bundles.Add(new ScriptBundle(“~/bundles/bootstrap”).Include( “~/Scripts/bootstrap.js”, “~/Scripts/respond.js”)); bundles.Add(new StyleBundle(“~/Content/css”).Include( […]

ASP.NET MVC: การ Request ผ่าน FormMethod แบบ PUT และ Delete

หลักการทำงานของ RESTful โดยทั่วไปจะกล่าวว่า Client สามารถทำการร้องขอ (Request) ข้อมูลหรือประมวลผลต่างๆ ผ่าน HTTP verbs/method โดยมีหลักการมาตรฐานในการใช้งานดังนี้ GET สำหรับการร้องขอข้อมูล POST สำหรับสร้างหรือเพิ่มข้อมูลใหม่ PUT สำหรับแก้ไขข้อมูล และ DELETE สำหรับการลบข้อมูล แต่การใช้งาน Form ใน asp.net MVC แบบปรกติจะสามารถ Request ได้เพียง Get และ Post เท่านั้น ดังรูปตัวอย่าง นั่นคือ Function ที่เตรียมไว้ใน Controller ต้องรับคำสั่งที่เป็น Get หรือ Post และไม่เป็นไปตามหลักของ RESTful   เมื่อทำการค้นหาข้อมูลพบว่าใน ASP.NET MVC นั้น Client สามารถส่ง Request แบบ PUT หรือ DELETE […]

ASP.NET MVC: DateTimePicker

เพิ่งจะได้มีโอกาสทำหน้า Page ของ aps.net mvc และในรุ่นนี้ไม่มี server control สำหรับรับข้อมูลแบบ DateTime เหมือนก่อน หลังจากไปค้นหาข้อมูลและทดลองทำตามพอจะสรุปเป็นขั้นตอนวิธีที่สามารถทำให้ Textbox ของเรารับค่า DateTime ได้ด้วยไม่กี่ขั้นตอน เปิด Project ด้วย Visual Studio (ของผมเป็นรุ่น 2015) เปิด NuGet Package Manager และค้นหาด้วยคำว่า datetimepicker เลือก Bootstrap.v3.Datetimepicker by Eonasdan กด Install เปิดไฟล์ BundleConfig.cs ในโฟลเดอร์ App_Start และให้เพิ่มรายละเอียดของ datetimepicker และ moment เข้าไป bundles.Add(new ScriptBundle(“~/bundles/bootstrap”).Include( “~/Scripts/bootstrap.js”, “~/Scripts/bootstrap-datetimepicker.js”, “~/Scripts/datetimepicker-setup.js”, “~/Scripts/respond.js”)); bundles.Add(new ScriptBundle(“~/bundles/moment”).Include( “~/Scripts/moment.js”)); ทำการอ้างอิงไฟล์ที่จำเป็นสำหรับใช้ DateTimePicker […]

APS.NET MVC: @Html.DisplayNameFor(x => x.Name) [แตกประเด็น p2376]

บันทึกนี้ผมแตกประเด็นมาจากบันทึก ASP.NET MVC ว่าด้วยเรื่อง Model แต่เนื้อหาไม่ได้ต่อเนื่องกัน ผมหยิบเอาคำสั่งหน้าตาประหลาดๆ มากเพื่อศึกษาและบันทึกความเข้าใจไว้ นั่นคือ คำสั่งในลักษณะนี้ @Html.DisplayNameFor(x=> x.Name) โครงสร้างคำสั่งแบบนี้จะพบมากขึ้นในโค้ดฝั่ง Microsoft ซึ่งผมเองเคยผ่านการใช้งานโค้ดแบบนี้มาบ้าง เคยถามจากผู้รู้มาบ้าง แต่พอนานวันก็ลืมความหมายไป จึงถือโอกาสทบทวนและบันทึกเป็น km เก็บไว้ว่า   เมื่อเอาเมาส์ไปวางเหนือคำสั่ง DisplayNameFor เราจะได้คำอธิบายการใช้มายืดยาว หากไม่คุ้นเคยการใช้งานแบบนี้อาจทำให้งงว่ามันใช้ยังไง คำอธิบายที่แสดงมานั่นคืออะไรบ้าง (MSDN: DisplayNameFor) DisplayNameFor มีหน้าที่แสดงชื่อหรือคำอธิบายของ Model หรือ MvcHtmlString โดยจะใช้ชื่อของ Model หรือชื่อที่ประกาศใน Data Annotation [Display(Name=”label name”)] DisplayNameFor เป็น Extension Method (ฟังก์ชั่นที่ถูกสร้างเพิ่มเติม) ของ Class HtmlHelper ซึ่งในภาพคือ @Html DisplayNameFor มีลักษณะเป็น Generic Method DisplayNameFor<TModel, TValue> TModel และ TValue (หรือชื่ออื่น) ที่อยู่ภายในเครื่องหมาย < > […]

ASP.NET MVC: ว่าด้วยเรื่อง Model

< ก่อนหน้า: เรื่อง ASP.NET MVC  ในบันทึกฉบับก่อนเป็นการอธิบายถึง MVC และสร้างตัวอย่าง Project แบบ ASP.NET MVC ที่แสดงให้เห็นการทำงานในส่วน Routing, Controller และ View ยังไม่มีการนำ Model มาใช้งานร่วมด้วย บันทึกนี้จึงเก็บข้อมูลเกี่ยวกับ Model เป็นหลัก จากเอกสารในเว็บของ Microsoft เรื่อง Getting Stated with ASP.NET MVC5 หัวข้อ Adding a View หัวข้อย่อย Passing Data from the Controller to the View  อธิบายว่าการส่งข้อมูลจาก Controller ไปยัง View ทำได้ 2 วิธี คือ (1) ViewBag และ (2) ViewModel […]

ASP.NET MVC: เริ่มต้น

สำหรับนักพัฒนาซอฟต์แวร์น่าจะผ่านตาคำว่า MVC มากันสักพักใหญ่แล้ว ผมเองก็เช่นกัน แต่ยังไม่ได้เริ่มศึกษาจริงจังเสียที แถมช่วงที่ดูแลงานจ้างพัฒนา ทางผู้พัฒนาก็ใช้คอนเซ็ปนี้ผ่าน PHP Framework ที่ชื่อ Laravel และ Codeigniter ส่วนตัวผมเองใช้แต่เครื่องมือของ Microsoft (Visual Studio) ซึ่งรองรับ MVC เช่นกัน จะมีโอกาสได้นำไปใช้พัฒนาจริงหรือเปล่ายังไม่รู้ แต่ก็ขอศึกษาและบันทึกความเข้าใจไว้ก่อน ต่อไปอาจมีความรู้อะไรใหม่ๆ มาต่อยอดจาก MVC อีก จะได้ไม่ตกขบวนจนเกินไปนัก 😆 MVC คืออะไร MVC ย่อมาจากคำว่า Model-View-Controller เป็นหลักการออกแบบ (Design Pattern) แบบหนึ่งที่กำหนดมาตรฐานของการแยกส่วนของโปรแกรมออกเป็น 3 ส่วนหลัก คือ Model, View และ Controller M-Model คือ ส่วนของข้อมูล มีหน้าที่จัดหาข้อมูล ตรวจสอบความถูกต้องของข้อมูล สถานะการเปลี่ยนแปลงของข้อมูล รวมถึง การบันทึกข้อมูลด้วย V-View คือ ส่วนที่แสดงผลและโต้ตอบกับผู้ใช้ (User Interface) […]