Year: 2015

การใช้ CSS3 @font-face Rule เพื่อนำฟอนต์ประจำมหาวิทยาลัยมาแสดงบนเว็บไซต์

ใน CSS3 (Version 3) สามารถนำฟอนต์ที่ไม่ใช่ฟอนต์มาตรฐานบนเว็บไซต์ (CSS Web Safe Font Combinations) มาใช้บนเว็บไซต์ได้ด้วยการใช้ @font-face Rule โดยเริ่มต้นจากการดาวน์โหลดไฟล์ฟอนต์ประจำมหาวิทยาลัย fonts.zip ซึ่งแต่ละ Web Browser จะสนับสนุนชนิดของไฟล์ฟอนต์ที่แตกต่างกัน ดังนี้ จากนั้นใส่ CSS3 @font-face Rule เพื่อเรียกใช้ไฟล์ฟอนต์ ที่ประกอบด้วยฟอนต์ตัวอักษรปกติ (db_chidlom_xregular) และฟอนต์ตัวอักษรแบบหนา (db_chidlom_xbold) ให้พิจารณาที่อยู่ของไฟล์ฟอนต์ให้ถูกต้อง ตรงกับที่อยู่ไฟล์ฟอนต์จริงบนเว็บไซต์

@font-face {
font-family: 'db_chidlom_xregular';
src: url('fonts/DB Chidlom X v3.2-webfont.eot');
src: url('fonts/DB Chidlom X v3.2-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/DB Chidlom X v3.2-webfont.woff2') format('woff2'),
url('fonts/DB Chidlom X v3.2-webfont.woff') format('woff'),
url('fonts/DB Chidlom X v3.2-webfont.ttf') format('truetype'),
url('fonts/DB Chidlom X v3.2-webfont.svg#db_chidlom_xregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'db_chidlom_xbold';
src: url('fonts/DB Chidlom X Bd v3.2-webfont.eot');
src: url('fonts/DB Chidlom X Bd v3.2-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/DB Chidlom X Bd v3.2-webfont.woff2') format('woff2'),
url('fonts/DB Chidlom X Bd v3.2-webfont.woff') format('woff'),
url('fonts/DB Chidlom X Bd v3.2-webfont.ttf') format('truetype'),
url('fonts/DB Chidlom X Bd v3.2-webfont.svg#db_chidlom_xbold') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {

font-family: 'db_chidlom_xregular';

src: url('fonts/DB Chidlom X v3.2-webfont.eot');

src: url('fonts/DB Chidlom X v3.2-webfont.eot?#iefix') format('embedded-opentype'),

url('fonts/DB Chidlom X v3.2-webfont.woff2') format('woff2'),

url('fonts/DB Chidlom X v3.2-webfont.woff') format('woff'),

url('fonts/DB Chidlom X v3.2-webfont.ttf') format('truetype'),

url('fonts/DB Chidlom X v3.2-webfont.svg#db_chidlom_xregular') format('svg');

font-weight: normal;

font-style: normal;

}

@font-face {

font-family: 'db_chidlom_xbold';

src: url('fonts/DB Chidlom X Bd v3.2-webfont.eot');

src: url('fonts/DB Chidlom X Bd v3.2-webfont.eot?#iefix') format('embedded-opentype'),

url('fonts/DB Chidlom X Bd v3.2-webfont.woff2') format('woff2'),

url('fonts/DB Chidlom X Bd v3.2-webfont.woff') format('woff'),

url('fonts/DB Chidlom X Bd v3.2-webfont.ttf') format('truetype'),

url('fonts/DB Chidlom X Bd v3.2-webfont.svg#db_chidlom_xbold') format('svg');

font-weight: normal;

font-style: normal;

}

สำหรับการเรียกใช้ฟอนต์ประจำมหาวิทยาลัยสามารถเรียกใช้ได้โดยตรงเช่น <h3 style=”font-family:’db_chidlom_xbold’, sans-serif, Arial”>หัวข้อฟอนต์มหาวิทยาลัย</h3> หรือการกำหนดผ่าน Id หรือ Class ผ่าน CSS เช่น

.entry-title {
font-family: 'db_chidlom_xregular', sans-serif, Arial;
}

.entry-title {

font-family: 'db_chidlom_xregular', sans-serif, Arial;

}

ตัวอย่างผลลัพธ์จากการใช้ฟอนต์ประจำมหาวิทยาลัย

Photoshop : การลบพื้นหลังออกจากภาพให้เป็นธรรมชาติ

การตัดต่อรูปภาพคนนั้น มักจะเกิดปัญหาเสมอโดยเฉพาะการตัดต่อบริเวณเส้นผม หากตัดต่อด้วยวิธีธรรมดาจะได้รูปภาพ ที่ดูไม่เป็นธรรมชาติ ในบทความนี้จะมาแนะนำวิธีการตัดต่อภาพโดยยังคงเก็บรายละเอียดเล็กน้อย เช่น เส้นผม ไว้ได้ 1. ขั้นแรก เปิดรูปภาพที่ต้องการตัดต่อขึ้นมา จากนั้นทำการ copy layer ของรูปภาพขึ้นมา 1 layer และลบ background layer เดิมทิ้งไป (เนื่องจากในตอนแรก layer ของรูปนั้นจะเป็น background layer ซึ่งจะไม่สามารถตัดต่อได้ จึงต้องทำการ copy layer ก่อน) 2. จากนั้นใช้อุปกรณ์ Quick Selection tool ในการเลือกบริเวณ background ที่ต้องการลบทิ้ง โดยเว้นบริเวณปอยผมเอาไว้ หากใช้ Quick Selection tool แล้วกินเข้าไปในส่วนที่ไม่ต้องการลบ ให้กด Alt ค้างไว้ จะเป็นการลบบริเวณที่ selected […]

วิธีลบข้อมูลซ้ำอย่างรวดเร็วภายใน Excel

Microsoft Excel มีเครื่องมือหนึ่ง ที่ชื่อว่า “Remove Duplicates” ที่จะช่วยให้เราสามารถลบข้อมูลที่ซ้ำกันภายในเซลล์ออก จนเหลือเพียงข้อมูลเดียวเท่านั้น ส่วนวิธีการใช้งานใช้งานเครื่องมือนั้นไม่ยุ่งยากเลย เพียงแค่เราเลือกช่วงข้อมูลที่มีการซ้ำกัน และคลิกที่เครื่องมือลบข้อมูลซ้ำ รายละเอียดดังนี้ ยกตัวอย่างดังภาพด้านล่าง จะเห็นได้ว่ามีข้อมูลที่ซ้ำกัน(สีเขียว)อยู่ภายในตาราง ไม่ว่าข้อมูลเหล่านั้นจะเป็นตัวอักษร หรือตัวเลข เครื่องมือ “Remove Duplicates” ก็สามารถลบค่าที่ซ้ำกันออกได้ เพียงเท่านี้ข้อมูลต่างๆ ที่มีค่าซ้ำกันก็จะถูกลบออกอย่างรวดเร็วด้วยเครื่องมือที่ทาง Microsoft Excel มีให้เราได้ใช้งานกันได้อย่างง่ายๆ ด้วยเครื่องมือที่มีชื่อว่า “Remove Duplicates”

CSS : Margin and Padding

ในการออกแบบเว็บไซต์ให้มีความสวยงาม หลักการหนึ่งที่นำมาใช้บ่อยๆ นั่นก็คือ Space (ที่ว่าง) สำหรับเว็บไซต์แล้ว ที่ว่างก็นับว่ามีความสำคัญไม่น้อย การจัดองค์ประกอบให้มีที่ว่างจะทำให้ข้อมูลดูไม่แน่นจนเกินไป และสามารถเพิ่มความน่าอ่านได้เช่นกัน ในการใช้ CSS ส่วนหนึ่งที่ใช้กำหนดระยะห่างของส่วนประกอบต่างๆเพื่อสร้างที่ว่างดังกล่าว ก็ได้แก่การกำหนด Margin และ Padding ข้อแตกต่างระหว่าง Magin และ Padding Margin คือ การกำหนดระยะห่างระหว่างขอบของวัตถุ”ด้านนอก”กับวัตถุอื่นๆ เช่น การเว้นระยะขอบของพื้นที่ content กับตาราง Padding คือ การกำหนดระยะห่างระหว่างขอบของวัตถุ”ด้านใน”กับวัตถุที่อยู่ภายใต้กรอบ เช่น การเว้นระยะขอบของพื้นที่ระหว่างกรอบตาราง กับตัวอักษรข้างใน แต่ว่า การกำหนดระยะห่างทั้งสองรูปแบบจะเขียนในฟอร์มที่เหมือนกัน ดังนี้ รูปแบบการเขียนกำหนด Margin margin-top คือ เว้นระยะขอบบน margin-bottom คือ เว้นระยะขอบล่าง margin-right คือ เว้นระยะขอบขวา margin-left คือ เว้นระยะขอบซ้าย กรณีต้องการเขียนให้สั้นลง จะเขียนในรูปแบบ ส่วนสำคัญจะอยู่ที่ค่าด้านหลัง จะใส่ได้ตั้งแต่ 1 ไปจนถึง 4 […]

การแทรก script <%...%> นอก Form ของ ASP.NET เองเจอ Error

Error ที่เกิดขึ้น

ปัญหาเกิดจากการใช้ Script <%...%> ในหน้า ASPX แต่ไม่อยู่ภายใต้

<form>...</form> หรือภายใต้ Element runat="server" ดังนั้นวิธีการแก้ไขคือใช้ ครอบ Script <%...%> ไว้ ดังภาพด้านล่าง

ปัญหาเกิดจากการใช้ Script <%...%> ในหน้า ASPX แต่ไม่อยู่ภายใต้

<form>...</form> หรือภายใต้ Element runat="server" ดังนั้นวิธีการแก้ไขคือใช้ ครอบ Script <%...%> ไว้ ดังภาพด้านล่าง

ปรับปรุงระบบทรานสคริปกิจกรรม เพิ่มระบบการสมัครเข้าร่วมกิจกรรม

ปรับปรุงระบบทรานสคริปกิจกรรม เพิ่มระบบการสมัครเข้าร่วมกิจกรรม โดยมีรายละเอียดดังนี้ เพิ่มการสมัครสมาชิก ในเมนูเปิดใช้งานกิจกรรมระบุจำนวนที่เปิดรับและเลือกให้สามารถสมัครสมาชิกได้ หน้าแรกของเว็บแสดงกิจกรรมที่เปิดรับ เมื่ออยู่ในช่วงเวลาที่กำหนด นักศึกษาสามารถสมัครสมาชิกด้วยตนเองโดยระบุ E-mail และเบอร์โทรเพื่อให้ผู้จัดกิจกรรมสามารถติดต่อกลับได้ หน้าแสดงการเข้าร่วมแยกข้อมูลจำนวนผู้สมัคร เปิดรับ และจำนวนที่ผ่านการเข้าร่วมกิจกรรม เมื่อนักศึกษา สมัครผ่านหน้าเว็บไซต์ ผู้ดูแล (กองพัฒฯ) บันทึกผู้เข้าร่วม ระบบจะสามารถบันทึกการเข้าร่วมให้นักศึกษาที่สมัครเข้าร่วมได้ทันที Step 1 เริ่มจากหน่วยงานดำเนินการเปิดใช้งานกิจกรรม Step 2 นักศึกษาเห็นกิจกรรมที่เปิดรับผ่านหน้าเว็บกิจกรรม Step 3 นักศึกษาสามารถกดเพื่อเข้าร่วมกิจกรรม Step 4 กดปุ่มสมัครเข้าร่วม Step 5 นักศึกษากรอกข้อมูลเพื่อให้ผู้จัดกิจกรรมสามารถติดต่อกลับได้ Step 6 หน่วยงานผู้จัดกิจกรรมสามารถตรวจสอบจำนวนผู้สมัครได้ใน เมนูลงทะเบียนเข้าร่วมกิจกรรม Step 7 ดูข้อมูลผู้เข้าร่วมทั้งหมด Step 8 ดูข้อมูลการสมัครเข้าร่วมกิจกรรม

ระบบบันทึกทุน มทร. พระนคร (RMUTP Scholarship)

ระบบบันทึกทุน มทร. พระนคร (RMUTP Scholarship) เป็นระบบบริหารจัดการรายการทุนต่างๆ ที่เกิดขึ้น ไม่ว่าจะเป็นทุนจากหน่วยงานภายนอก หน่วยงานภายใน ทุนพระราชทาน ทุนจากผู้ประสงค์ดี ฯลฯ ซึ่งระบบจะดำเนินการจัดเก็บข้อมูลทุนทั้งหมดที่เกิดขึ้น และเก็บรายการผู้รับทุนอันได้แก่ นักศึกษาภายในมหาวิทยาลัย และทุนการศึกษาของบุคลากรแต่ละหน่วยงาน เพื่อให้สะดวกต่อการกำกับติดตาม และรายงานทุนต่างๆ ทั้งจำนวนทุน จำนวนเงิน เพื่อให้ผู้บริหารได้รับทราบและสามารถนำข้อมูลไปใช้ให้เกิดประโยชน์ได้ในอนาคต สามารถเข้าใช้งานได้ที่ http://203.158.144.140/Scholarship/ ระบบบันทึกทุน มทร. พระนคร (RMUTP Scholarship) มี Feature ที่สำคัญดังนี้ สามารถแยกผู้ใช้เป็น 3 ระดับได้แก่ 1) ผู้ดูแลระบบ (admin) สามารถเข้าถึงข้อมูลได้ทั้งหมด และกำหนดสิทธิของผู้ใช้ระบบได้ 2) ผู้ใช้งานจากหน่วยงาน (user) สามารถบันทึกทุนและแก้ไขทุนของหน่วยงานตนเอง 3) ผู้บริหาร (ceo) สามารถเข้าถึงข้อมูลรายงานทุนทั้งหมดที่เกิดขึ้น มีหน้า Dash Board เพื่อรายงานข้อมูลทั้งหมดที่ต้องการให้ผู้ใช้ได้รับทราบ สามารถเพิ่มรายการทุนโดยแยกตามปีการศึกษา แยกประเภททุน แหล่งที่มา และงบประมาณที่ใช้ […]

DevExpress : ASPxComboBox แสดงผล Selected Item ผิด

ปัญหาเกิดจาก การปรับค่าเวลา Bind data จาก SqlDatasource แล้วไม่ปรับ DataType ให้ตรงกับข้อมูลที่จะให้ Select การแสดงผลที่ผิดตามด้านล่าง สังเกตุว่าจะต้องแสดงผลเป็น TextField โค้ดที่ใช้

<label>2) ที่มาของทุน</label>
<dx:ASPxComboBox ID="cbScholarFromID" CssClass="form-control" runat="server" DataSourceID="SqlDataSource1" ValueField="ScholarFromID" TextFormatString="{0}" EnableCallbackMode="True" IncrementalFilteringMode="StartsWith"
CallbackPageSize="30">
         <Columns>
<dx:ListBoxColumn Caption="ที่มาของทุน" FieldName="ScholarFromName" Width="50%" />
<dx:ListBoxColumn Caption="ประเภท" FieldName="ScholarFromType" Width="50%" />
</Columns> 
<ValidationSettings Display="Dynamic" SetFocusOnError="True">
<RequiredField IsRequired="True" />
</ValidationSettings>
</dx:ASPxComboBox>
<asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString='<%$ ConnectionStrings:defaultDB %>' SelectCommand="SELECT ScholarFromID, ScholarFromName, ScholarFromType FROM ScholarForm ORDER BY OrderNo"></asp:SqlDataSource>

<label>2) ที่มาของทุน</label>

<dx:ASPxComboBox ID="cbScholarFromID" CssClass="form-control" runat="server" DataSourceID="SqlDataSource1" ValueField="ScholarFromID" TextFormatString="{0}" EnableCallbackMode="True" IncrementalFilteringMode="StartsWith"

CallbackPageSize="30">

<dx:ListBoxColumn Caption="ที่มาของทุน" FieldName="ScholarFromName" Width="50%" />

<dx:ListBoxColumn Caption="ประเภท" FieldName="ScholarFromType" Width="50%" />

</Columns>

</ValidationSettings>

</dx:ASPxComboBox>

<asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString='<%$ ConnectionStrings:defaultDB %>' SelectCommand="SELECT ScholarFromID, ScholarFromName, ScholarFromType FROM ScholarForm ORDER BY OrderNo"></asp:SqlDataSource>

วิธีแก้ไขให้ปรับค่า DataType ของ ASPxComboBox ดังภาพด้านล่าง ผลลัพท์

การสร้าง Web Form Method Post ของ ASP.NET คล้ายๆกับ Form method POST ของ PHP

การสร้าง Web Form Method Post ของ ASP.NET คล้ายๆกับ Form method POST ของ PHP หน้า Form Post

    <form method="post">

        <%for (int i = 0; i < 10; i++)
            {%>
               <input name="txtStudentCode" type="text" value="" />

          <%  } %>
       
       <asp:Button ID="btnSend" runat="server" Text="Send" PostbackUrl="StudentListAddDo.aspx" />
    </form>

<%for (int i = 0; i < 10; i++)

{%>

<% } %>

<asp:Button ID="btnSend" runat="server" Text="Send" PostbackUrl="StudentListAddDo.aspx" />

</form>

หน้ารับค่า Post StudentListAddDo.aspx

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class StudentListAddDo : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        // String s=Request.QueryString.
        //Response.Write(Request.Form["txtStudentCode"]);
        string[] sSTUDENTCODE = Request.Form["txtStudentCode"].ToString().Split(',');
        for (int i = 0; i < sSTUDENTCODE.Length; i++)
        {
            Response.Write("<br/>" + sSTUDENTCODE[i]);
        }

    }
}

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class StudentListAddDo : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

// String s=Request.QueryString.

//Response.Write(Request.Form["txtStudentCode"]);

string[] sSTUDENTCODE = Request.Form["txtStudentCode"].ToString().Split(',');

for (int i = 0; i < sSTUDENTCODE.Length; i++)

{

Response.Write("<br/>" + sSTUDENTCODE[i]);

}

Insert ข้อมูลและส่งค่า Primary key กลับมา

Insert ข้อมูลและส่งค่า Primarykey ที่พึ่ง Insert ล่าสุดกลับมาเพื่อนำไปใช้ต่อ โดยใช้ SELECT CAST(scope_identity() AS int ช่วย ตัวอย่างโค้ด

 #region Add Scholarship
            Database db = DatabaseFactory.CreateDatabase();
            string sql = @"INSERT INTO [Scholarship] (
       [ScholarName]
      ,[ScholarFromID]
      )VALUES(
       @ScholarName
      ,@ScholarFromID
       );SELECT CAST(scope_identity() AS int)";
            DbCommand dbCommand = db.GetSqlStringCommand(sql);
            db.AddInParameter(dbCommand, "ScholarName", DbType.String, ms.ScholarName);
            db.AddInParameter(dbCommand, "ScholarFromID", DbType.Int32, ms.ScholarFromID);
            
            Int32 KEY_ID=(Int32)db.ExecuteScalar(dbCommand);
            #endregion

#region Add Scholarship

Database db = DatabaseFactory.CreateDatabase();

string sql = @"INSERT INTO [Scholarship] (

[ScholarName]

,[ScholarFromID]

)VALUES(

@ScholarName

,@ScholarFromID

);SELECT CAST(scope_identity() AS int)";

DbCommand dbCommand = db.GetSqlStringCommand(sql);

db.AddInParameter(dbCommand, "ScholarName", DbType.String, ms.ScholarName);

db.AddInParameter(dbCommand, "ScholarFromID", DbType.Int32, ms.ScholarFromID);

Int32 KEY_ID=(Int32)db.ExecuteScalar(dbCommand);

#endregion