:: Kunagorn Sirikup :: C# Developer

21/10/56

Loading Progress with NProgress

วันนี้จะมาแนะนำวิธีการทำ Loading ด้วย NProgress นะครับ หลายคนอาจจะยังไม่ภาพไม่ออกว่า NProgress นี่ทำ Loading แล้วจะมีหน้าตาออกมาเป็นแบบไหน ให้ไปลองดูที่ Youtube นะครับเมื่อเราเข้ามาแล้วจะมี Loading เล็กวิ่งอยู่ด้านบนสุด






ซึ่งเราสามารถนำ NProgress นี่เข้ามาใช้งานบนเว็บไซต์ของเราได้ไม่ยาก โดยสามารถทำได้ ดังนี้ครับ
เข้าไปที่ http://ricostacruz.com/nprogress/ เพื่อดาวน์โหลด nprogress.css และ nprogress.js มาไว้ใน Solution ในตัวอย่างนี้ผมขอใช้ผ่าน CDN ดังนี้ครับ
    rel="stylesheet" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"
    type="text/javascript"></script>
    type="text/javascript"></script>

เท่านี้เราก็ติดตั้ง NProgress เสร็จเรียบร้อยแล้วครับ ต่อมาจะเริ่มใช้งานกันนะครับ โดยมี 2 คำสั่งที่จำเป็นในการใช้งาน คือ NProgress.start(); เพื่อใช้สำหรับสั่งให้ Progress Bar เริ่มทำงาน และ NProgress.done(); เพื่อใช้สำหรับสั่งให้ Progress Bar สิ้นสุดการทำงาน
เริ่มทดสอบการทำงานโดยใช้ Code นี้นะครับ
<script>
    $(document).ready(function () {
        NProgress.start();
        setTimeout(function () {
            NProgress.done();
            $('.fade').removeClass('out');
        }, 1000);
    });
</script>

หลังจากลอง Run แล้วจะมี Loading แสดงขึ้นมา เท่านี้ก็เสร็จแล้วครับกับการใช้ NProgress สำหรับทำ Loading








18/10/56

Split String ด้วย LINQ

วันนี้ขอนำเสนอทิปเล็กๆ เกี่ยวกับการแยกคำ หรือ Split ข้อมูล String ออกมาเป็น List โดยใช้ความสามารถของ LINQ นะครับ ซึ่งสามารทำได้หลายวิธีมาก วันนี้ขอยกตัวอย่างการ Split คำ โดยใช้ตัวอย่างนี้นะครับ
สมมติว่าผมมีข้อมูล String ในรูปแบบนี้ "00001_CompanyA_5000,00002_CompanyB_2000,00003_CompanyC_7000" โดยใน string นี้จะประกอบด้วย CompanyID , CompanyName , Price ซึ่งมี '_' เป็นตัวคั่น และข้อมูลแต่ละชุดมี ',' เป็นตัวคั่น โดยทั่วไปอาจจะทำได้โดยการวน Loop แล้ว Split String เก็บที่ละฟิลด์ ก็จะได้ผลลัพธ์ที่ต้องการเหมือนกัน แต่ถ้าใช้ LINQ เราสามารถทำได้โดยใช้ Code ดังนี้
string companydata = "00001_CompanyA_5000,00002_CompanyB_2000,00003_CompanyC_7000";
            var companylist = companydata.Split(',')
                                        .Select(s => s.Split('_'))
                                        .Select(a => new
                                        {
                                            CompanyID = a[0].ToString()
                                            , CompanyName = a[1].ToString()
                                            , Price = a[2].ToString()
                                        });

ที่นึี้ลองมาทดสอบผลการทำงา่นกันนะครับว่าสามารถทำงานได้จริงหรืิเปล่า

จะสังเกตว่าเมื่อใช้ฟังก์ชั่น Split ของ LINQ เราสามารถทำการแยก String ได้โดยใชัคำสั่งเพี้ยงแค่บรรทัดเดียว