ในส่วนของ source code ของ PowerBuilder ประกอบด้วยไฟล์นามสกุลต่าง ๆ
| ความหมาย | file extension |
| Application source files | .sra |
| Custom user object source files | .sru |
| Data pipeline source files | .srp |
| DataWindow source files | .srd |
| Dynamic link library files | .pdb |
| Function source files | .srf |
| Library files | .pbl |
| Menu source files | .srm |
| Project files | .srj |
| Query source files | .srq |
| Structure source files | .srs |
| Target files | .pbt |
| Window source files | .srw |
| Workspace files | .pbw |
โจทย์คือการ import ข้อมูลจาก excel เข้าไปเก็บใน database ซึ่งมันก็ไม่ซับซ้อนอะไรถ้าคำนำหน้านาม ชื่อ ชื่อกลาง นามสกุลมันไม่อยู่ในช่องเดียวกัน แต่ในตารางต้องการให้แยกไว้คนละฟิลย์เพื่อความสดวกในการดึงข้อมูล
ดูง่ายๆ แค่ตัดสตริงค์ตามช่องว่างก็น่าจะได้ แต่อย่างชื่อผม นาย พิชญ์ พันธุ์สนิท และชื่อ นาง ธิติมา แอน ประทุมทิพย์ ต่างกันคือ ตัดออกมาได้อาร์เรย์สมาชิก 3 ตัว และ 4 ตัว ก็เขียนเงื่อนไขได้ง่ายๆ ถ้ามี 4 ตัวก็แสดงว่ามี ชื่อกลาง
title = นาย
firstname = พิชญ์
middlename =
lastname = พันธุ์สนิท
และ
title = นาง
firstname = ธิติมา
middlename = แอน
lastname = ประทุมทิพย์
เขียน if (count($temp) == 4) ก็ได้แล้ว
แต่อย่าง ว่าที่ ร.ต.(หญิง) เต็มศิริ วีรสุข ถ้าใช้วิธี[code language=”php”]
list($title, $firstname, $middlename, lastname) = explode(‘ ‘, ‘ว่าที่ ร.ต.(หญิง) เต็มศิริ วีรสุข’);[/code]แล้วออกมาเป็น
title = ว่าที่
firstname = ร.ต.
middlename = (หญิง)
lastname = เต็มศิริ
คงไม่งาม และบางราชชื่อไม่มีคำนำหน้านาม (hr ผู้น่ารัก)
โชคดีที่มีคำนำหน้านามไม่เยอะเพราะฉะนั้นใช้วิธีใส่ในอาร์เรย์แล้วเอาไป search หาเอาก็ได้[code language=”php”]
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>แบ่งชื่อ นามสกุล คำนำหน้านาม</title>
</head>
<body>
<?php
$names = [
‘ซาร่า มาลา กุล เลน ณ อยุธยา’,
‘นพ.เหรียญทอง แน่นหนา’,
‘นักเทคนิคการแพทย์ภาคภูมิ เดชหัสดิน’,
‘นางธิติมา แอน ประทุมทิพย์’,
‘นายพิชญ์ พันธุ์สนิท’,
‘ว่าที่ ร.ต.(หญิง) เต็มศิริ วีรสุข’,
];
$titles = [
‘นพ.’,
‘นักเทคนิคการแพทย์’,
‘นาง’,
‘นาย’,
‘ว่าที่ ร.ต.(หญิง)’,
];
$results = [];
foreach ($names as $no => $name) {
$temp = str_replace($titles, ‘<> ‘, $name);
$temp = mb_ereg_replace(‘/\s+/’, ‘\s’, $temp);
$temp = array_values(array_filter(explode(‘ ‘, $temp)));
if ($temp[0] == ‘<>’) {
$results[$no][‘title’] = substr($name, 0, strpos($name, $temp[1]));
} else {
$results[$no][‘title’] = ”;
array_unshift($temp, ”);
}
$results[$no][‘firstname’] = $temp[1];
if (count($temp) == 4) {
$results[$no][‘middlename’] = $temp[2];
$results[$no][‘lastname’] = $temp[3];
} else {
unset($temp[0], $temp[1]);
$results[$no][‘middlename’] = ”;
$results[$no][‘lastname’] = implode(‘ ‘, $temp);
}
}
echo ‘<pre>’, print_r($results, true), ‘</pre>’;
?>
</body>
</html>
[/code]ผลลัพธ์ คือ[code language=”text”]
Array
(
[0] => Array
(
[title] =>
[firstname] => ซาร่า
[middlename] =>
[lastname] => มาลา กุล เลน ณ อยุธยา
)
[1] => Array
(
[title] => นพ.
[firstname] => เหรียญทอง
[middlename] =>
[lastname] => แน่นหนา
)
[2] => Array
(
[title] => นักเทคนิคการแพทย์
[firstname] => ภาคภูมิ
[middlename] =>
[lastname] => เดชหัสดิน
)
[3] => Array
(
[title] => นาง
[firstname] => ธิติมา
[middlename] => แอน
[lastname] => ประทุมทิพย์
)
[4] => Array
(
[title] => นาย
[firstname] => พิชญ์
[middlename] =>
[lastname] => พันธุ์สนิท
)
[5] => Array
(
[title] => ว่าที่ ร.ต.(หญิง)
[firstname] => เต็มศิริ
[middlename] =>
[lastname] => วีรสุข
)
)
[/code]อธิบาย[code language=”php”]
$temp = str_replace($titles, ‘<> ‘, $name);[/code]เปลี่ยนคำนำหน้านามเป็นตัวอื่นก่อน[code language=”php”]
$temp = mb_ereg_replace(‘/\s+/’, ‘\s’, $temp);[/code]เอาสเปซที่มีมากกว่า 1 ตำแหน่งแทนที่ด้วยช่องว่าแค่ 1 ตำแหน่งก็พอ[code language=”php”]
$temp = array_values(array_filter(explode(‘ ‘, $temp)));[/code]แบ่งข้อมูลออกเป็นส่วนๆ โดย array_values(array_filter()) จะทำให้อินเด็กซ์ของอาร์เรย์เป็นไปตามลำดับ[code language=”php”]
array_unshift($temp, ”);[/code]ถ้าไม่มีคำนำหน้านามก็ใส่ให้มัน ลำดับอาร์เรย์จะได้ไม่เคลื่อนไป[code language=”php”]$results[$no][‘lastname’] = implode(‘ ‘, $temp);[/code]เพราะว่าบางคน นามสกุล จะมีช่องว่างจำนวนมาก เช่น มาลา กุล เลน ณ อยุธยา และถ้าแบ่งข้อมูลผิด ผลลัพธ์ที่ได้ก็ไม่น่าเกลียดเท่าไหร่
ถ้าเวลาเรา upload รูปขึ้น server คงจะดีถ้าเราเห็นว่าเราเลือกภาพถูกรึเปล่า หรือขนาดมันใหญ่เกินไปมั๋ย เราทำได้โดยการแสดงภาพ Preview ขนาด ความกว้าง ความสูง และทำการตรวจสอบก่อนจะได้ไม่เสียเวลา
ตัวอย่าง jQuery Upload Image Preview Demo
[code language=”html”]
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Upload Image Preview</title>
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
<label>เฉพาะรูปภาพ
<input type="file" name="pic" accept="image/*">
</label>
</form>
<img id="picPreview">
<dl>
<dt>image dimensions width</dt>
<dd id="picDimensionsWidth"></dd>
<dt>image dimensions height</dt>
<dd id="picDimensionsHeight"></dd>
<dt>lastModified</dt>
<dd id="picLastModified"></dd>
<dt>lastModifiedDate</dt>
<dd id="picLastModifiedDate"></dd>
<dt>name</dt>
<dd id="picName"></dd>
<dt>original file upload path</dt>
<dd id="picPath"></dd>
<dt>size</dt>
<dd id="picSize"></dd>
<dt>type</dt>
<dd id="picType"></dd>
</dl>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
$(‘[name="pic"]’).change(function(){
/* original file upload path */
$(‘#picPath’).text($(this).val());
var file = this.files[0];
/* get picture details */
$(‘#picLastModified’).text(file.lastModified);
$(‘#picLastModifiedDate’).text(file.lastModifiedDate);
$(‘#picName’).text(file.name);
$(‘#picSize’).text(file.size);
$(‘#picType’).text(file.type);
/* set image preview */
if( ! file.type.match(/image.*/))
{
return true;
}
var reader = new FileReader();
reader.onload = function (event)
{
$(‘#picPreview’).attr(‘src’, event.target.result);
/* get image dimensions */
var image = new Image();
image.src = reader.result;
image.onload = function()
{
$(‘#picDimensionsWidth’).text(image.width);
$(‘#picDimensionsHeight’).text(image.height);
};
}
reader.readAsDataURL(file);
});
</script>
</body>
</html>
[/code]
คุณสมบัติที่น่าสนใจอย่างหนึ่งของ HTML 5 คือเราสามารถกำหนดให้อินพุทยอมรับชนิดไฟล์ตามที่เราต้องการได้ ช่องใส่ภาพประจำตัว ก็น่าจะใส่ได้แค่นามสกุล jpeg อย่างน้อยก็ png หรือ gif แต่ก็มียูเซอร์ copy รูปใส่ word upload เข้ามา สมกับ used เซ่อๆ จริงๆ
เราสามารถกำหนดได้โดยใช้ accept Attribute ตามตัวอย่าง
[code language=”html”]
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Form Input Accept</title>
<style>
label
{
display: block;
}
</style>
</head>
<body>
<form action="" enctype="multipart/form-data">
<label>เฉพาะไฟล์เสียง
<input type="file" name="files[]" accept="audio/*">
</label>
<label>เฉพาะรูปภาพ
<input type="file" name="files[]" accept="image/*">
</label>
<label>เฉพาะวีดีโอ
<input type="file" name="files[]" accept="video/*">
</label>
<label>pdf
<input type="file" name="files[]" accept="application/pdf">
</label>
<label>.gif หรือ .png
<input type="file" name="files[]" accept="image/gif, image/png">
</label>
<label>.jpg
<input type="file" name="files[]" accept="image/pjpeg, image/jpeg">
</label>
<input type="submit">
</form>
</body>
</html>
[/code]
จะสังเกตุว่าเวลาเรา browse file มันจะแสดงเฉพาะนามสกุลที่เรากำหนด แต่ยังเปลี่ยนตัวเลือกไปเป็น All Files (*.*) ได้อยู่ดี มันแค่ช่วยให้เลือกไฟล์ได้ง่ายขึ้น ยังรับประกันไม่ได้อยู่ดีว่าจะได้นามสกุลไฟล์ที่ถูกต้อง หรือไฟล์ที่ส่งมานามสกุลถูกตาม Extension แต่ก็ไม่ได้รับรองว่าไฟล์มันเป็นจริงตามนามสกุลที่ส่งมา จุดที่อันตรายก็เลยต้องมาตรวจชนิดไฟล์ในผั่ง server อยู่เหมือนเดิม
ค่าที่ใส่ใน accept คือ MIME Types ดูเพิ่มเติมได้ที่ The Complete List of MIME Types