วันศุกร์ที่ 11 มิถุนายน พ.ศ. 2564

Gs-14 วิธีการแทรก นับจำนวนผู้เข้าชมเว็บไซด์ บนGoogle Sites

 เว็บไซด์ที่ให้บริการสร้างตัวนับจำนวนผู้เข้าชมเว็บฟรีนั้น มีหลากหลายเว็บที่ให้บริการฟรี จะขอยกตัวอย่างจากเว็บ

http://guestscounter.com/  เพราะเว็บไซด์จะแสดง HTML  ให้ผู้ใช้ทำการคัดลอกโค้ด  แล้วนำไป ติดตั้งบน Google Sites ทำตามขั้นตอนดังนี้ 


  1. ไปที่ เว็บไซด์ http://guestscounter.com/ 


2.  เลือกรูปแบบ ตัวนับจำนวนผู้เข้าชมเว็บ ตามใจชอบ เช่น

3. ป้อนค่า ในช่อง Start count form คือท่านต้องการเริ่มนับจำนวนผู้เข้าชมเว็บ


4.  กดปุ่ม GET CODE ท่านจะได้ Code Html แล้วทำการคัดลอก(Ctrl C)โค้ด HTML เพื่อที่ระนำไปติดตั้งไว้ที่ Google Sites



5.   ไปที่เว็บ Google Sites ที่ท่านต้องการนำ Code Html ไปติดตั้ง  แล้วเลือกเลือกเมนู "เพิ่มเติม" แล้วเลือกที่ "แก้ไขการออกแบบไซด์" 


6.  ไปที่ด้านล่างสุดของเว็บ แล้วแลือกตำแหน่ง  แก้ไขส่วนท้ายของไซต์ 


9.  จะปรากฏหน้าต่างกำหนดค่าช่องข้อความขึ้น เลือกเมนู  " <HTML> " แก้ไขต้นฉบับ HTML  

10. นำโค้ด HTML ที่คัดลอกมา   วางลงในตำแหน่งที่ต้องการ   จากนั้นกด "อัพเดท"


11. ปรับค่าตามความต้องการ แล้วกดปุ่ม "ตกลง"


12. ช่องจำนวนนับผู้เข้าชมเว็บจะปรากฏขึ้นและเริ่มนับทันที ดังรูป


วันศุกร์ที่ 6 มีนาคม พ.ศ. 2563

validate textbox in javascript ตรวจสอบค่าว่างใน Textbox


 การสร้าง Script มาตรวจสอบค่าว่างใน Textbox เพื่อให้ผู้ใช้งานทำการกรอกข้อมูลตามที่เราต้องการ

Code
สคริปที่ทำการเช็ค
<script>
function chkfrom()
{
if(document.regis.Name.value=="")
{
alert('Please insert data!');
document.regis.Name.focus();
return false;
}
if(document.regis.lastname.value=="")
{
alert('Please insert data!');
document.regis.lastname.focus();
return false;
}
}
document.regis.submit();
</script>

ส่วนสร้างฟอร์ม
<form name='regis' method='POST' action='insertdata.php' onsubmit='return chkfrom();'>
<table width='500' align='center' border='1'>
<tr>
<td>Name :</td>
<td><input type='text' name='Name'></td>
</tr>
<tr>
<td>Lastname :</td>
<td><input type='text' name='lastname'></td>
</tr>
<tr>
<td></td>
<td><input type='submit' name='submit' value='Submit'></td>
</tr>
</table>
</form>

การสร้างฟอร์มรับค่า เก็บใน DATABASE #1


ในบทนี้เราจะเรียนรู้วิธีการสร้างฟอร์มและอินพุตที่ใช้รับข้อมูลต่างๆ รวมถึงวิธีการส่งข้อมูลเพื่อนำข้อมูลที่กรอกเข้าไปประมวลผลหรือจัดเก็บข้อมูลลงในไฟล์หรือฐานข้อมูลต่อไป ซึ่งถือเป็นสิ่งสำคัญอย่างยิ่งสำหรับการสร้างเว็บแอพพลิเคชั่น หรือสร้างระบบต่างๆ
ก่อนจะสร้างอินพุตที่ใช้รับข้อมูลต่างๆที่เรากรอกในฟอร์ม เราจะต้องกำหนดขอบเขตให้กับฟอร์มเสียก่อนซึ่งหากนึกไม่ออก การกำหนดขอบเขตนั้นก็เหมือนกับการสร้างรั้วของหมู่บ้านนั่นเอง โดยแทรกแท็ก <form>……</form>เข้าไปในเว็บเพจซึ่งมีรูปแบบการใช้งานและคุณสมบัติที่จำเป็นสำหรับแท็ก <form>ดังนี้
<form name=’ชื่อฟอร์ม’ method=’วิธีส่งข้อมูล’ action=’ชื่อไฟล์สคริปต์ที่ประมวลผล’>……………</form>

Code สร้างฟอร์ม
<form name='regis' method='POST' action='insertdata.php' onsubmit='return chkfrom();'>
<table width='500' align='center' border='1'>
<tr>
<td>Name :</td>
<td><input type='text' name='Name'></td>
</tr>
<tr>
<td>Lastname :</td>
<td><input type='text' name='lastname'></td>
</tr>
<tr>
<td></td>
<td><input type='submit' name='submit' value='Submit'></td>
</tr>
</table>
</form>

การดึงข้อมูลจาก Database ออกมาแสดง


 ในบทนี้จะมาเสนอวิธีทำการดึงข้อมูลจากฐานข้อมูลออกมาแสดงที่หน้าเว็ปไซต์หลังจากที่ได้ทำการเพิ่มข้อมูลเข้าไปแล้วโดยจะนำเสนอการใช้ while Loop ในการใช้งานโดยการทำงานหลักๆนั้นจะทำการสร้างตัวแปรมารับค่าอเรย์จากนั้นสั่งให้ทำการนำค่าที่ได้ในอเรย์ออกมาแสดงที่หน้าเว็ปไซต์

ตัวอย่างการใช้ while($ตัวแปรรับค่า = mysql_fetch_array($result))
{
$ตัวแปรรับค่า['ชื่อคอลั่มที่ต้องการแสดงค่า'];
}

Code ตัวอย่าง
<table width='500' align='center' border='1'>
<tr>
<td align='center'>No.</td>
<td align='center'>Name</td>
<td align='center'>LastName</td>
</tr>
<?php
include('config/config.php');
$strsql = "SELECT * FROM user ORDER BY id DESC"; //คำสั่งให้เลือกข้อมูลจาก TABLE ชื่อ user เรียงลำดับจากมากไปน้อย
$result = mysql_query($strsql);
while($rs = mysql_fetch_array($result))  //สร้างตัวแปร $rs มารับค่าจากการ fetch array
{
?>
<tr>
<td><?php echo $rs['id'];?></td> //สั่งให้แสดงค่าตัวแปรที่เก็บค่า id ออกมาแสดง
<td><?php echo $rs['name'];?></td> //สั่งให้แสดงค่าตัวแปรที่เก็บค่า name ออกมาแสดง
<td><?php echo $rs['lastname'];?></td> //สั่งให้แสดงค่าตัวแปรที่เก็บค่า lastname ออกมาแสดง
</tr>
<?php } ?> //ปิด } while Loop
</table>

การดึงข้อมูลจาก Database ออกมาแก้ไข Edit Data

 การดึงข้อมูลจาก Database ออกมาแก้ไข Edit Data


หลังจากที่เราได้ทำการ insert data เข้าไปเก็บในฐานข้อมูลแล้วนั้นเราก็จะทำการสร้างปุ่มสำหรับการแก้ไขข้อมูลนั้นซึ่งถือว่าเป็นฟังชั่นพื้นฐานสำหรับการเขียนโปรแกรมเลยก็ว่าได้ จะกล่าวถึงหลักการโดยคร่าวๆได้ว่าหลังจากที่เราคลิกที่ปุ่มแก้ไขแล้วระบบจะทำการดึงข้อมูลนั้นๆออกมาแสดงที่หน้า UI เพื่อให้เราทำการแก้ไขข้อมูลได้ ก่อนที่จะทำการจัดเก็บเข้าไปใหม่ลงในฐานข้อมูล หรือเรียกง่ายๆว่าการ Update Data นั่นเองซึ่งหากมีข้อมูลที่เก็บในฐานข้อมูลเป็นจำนวนมากๆ ระบบจะรู้ได้อย่างไรล่ะ? ว่าเราต้องการแก้ไขข้อมูลไหน ฉนั้นเราจึงต้องส่งค่า ID ของข้อมูลนั้นๆกลับมาที่หน้าเพจสำหรับการ Updata Data ด้วยโดยจะส่งค่ามาโดยใช้ Method GET จากนั้นหน้าที่ทำการดึงข้อมูลออกมาแสดงก็ประกาศรับค่า Method GET ที่ส่งมาแล้วทำการ Select Data จากฐานข้อมูลออกมาเพื่อทำการแก้ไข

Code
SELECT * FROM TABLENAME SET somecolumn1=somevalue1,somecolumn2=somevalue2 WHERE somecolumn='somevalue';

ตัวหนังสือสีแดงหมายถึงค่าที่เราต้องเปลี่ยนตามข้อมูลในฐานข้อมูลเรา เช่น TABLENAME หมายถึง ชื่อTABLEที่เก็บข้อมูล

สำหรับการส่งค่า ID ของข้อมูลที่เราต้องการแก้ไขนั้นจะส่งมาแบบ GET เพื่อให้ระบบรู้ว่าเราต้องการแก้ไขข้อมูลทีบรรทัดที่เท่าไหร่โดยการส่งค่า ID มานั้นจะมีรูปแบบการส่งแบบตัวอย่างด้านล่างนี้
<a href='ชื่อไฟล์ที่จะให้แสดงการแก้ไข?data_id=<?php echo $result['id'];?>'>EDIT</a>
หน้าที่จะรับค่าก็ต้องประกาศรับค่าตัวแปร data_id ด้วยจึงจะสามารถนำค่านั้นไปใช้งานต่อได้ ตัวอย่างด้านล่าง
ไฟล์ update.php
$data_idnew = $_GET[data_id]; // การประกาศรับค่า GET จากหน้าแรก

การดึงข้อมูลจาก Database ออกมา Update

การดึงข้อมูลจาก Database ออกมา Updateนั้นจะมีไฟล์หลักๆอยู่ 3 ไฟล์ด้วยกันคือ ไฟล์แสดงรายการทั้งหมด ไฟล์แสดงข้อมูลที่ต้องการแก้ไข และสุดท้ายคือไฟล์ที่ทำการแก้ไขการเปลี่ยนแปลงนั่นเอง

Code
ไฟล์ config.php
<?php
$conn = mysql_connect( "localhost", "ชื่อผู้ใช้", "รหัสผ่าน" );
$dbname = "ชื่อฐานข้อมูล";
mysql_query("SET NAMES UTF8");
if ( ! $conn )
die( "Error :MySQL " );
mysql_select_db( "ชื่อฐานข้อมูล", $conn )
or die ( "can't connect to database" );
?>
ตัวหนังสือสีแดงหมายถึง  ต้องเปลี่ยนให้ตรงกับฐานข้อมูลที่เราใช้

1.register.php
<br/><br/><br/><br/><form name='regis' method='POST' action='insertdata.php'>
<table width='500' align='center' border='1'>
<tr>
<td>Name :</td>
<td><input type='text' name='Name'></td>
</tr>
<tr>
<td>Lastname :</td>
<td><input type='text' name='lastname'></td>
</tr>
<tr>
<td></td>
<td><input type='submit' name='submit' value='Submit'></td>
</tr>
</table>
</form>
<table width='500' align='center' border='1'>
<tr>
<td align='center'>No.</td>
<td align='center'>Name</td>
<td align='center'>LastName</td>
<td align='center'>Edit</td>
</tr>
<?php
include('config/config.php');
$strsql = "SELECT * FROM user ORDER BY id DESC";
$result = mysql_query($strsql);
while($rs = mysql_fetch_array($result))
{
?>
<tr>
<td><?php echo $rs['id'];?></td>
<td><?php echo $rs['name'];?></td>
<td><?php echo $rs['lastname'];?></td>
<td align='center'><a href='update1.php?data_id=<?php echo $rs['id'];?>'><input type='button' name='edit' value='Edit'></a></td>
</tr>
<?php } ?>
</table>

2. update1.php
<?php
include('config/config.php');
$data_idnew = $_GET['data_id'];

$strsql = "SELECT * FROM user WHERE id='$data_idnew'";
$result = mysql_query($strsql);
while($rs = mysql_fetch_array($result))
{
?>
<form name='update' method='POST' action='update2.php?data_id=<?php echo $rs['id'];?>'>
<table width='500' align='center' border='1'>
<tr>
<td>Name :</td>
<td><input type='text' name='Name' value='<?php echo $rs['name'];?>'></td>
</tr>
<tr>
<td>Lastname :</td>
<td><input type='text' name='lastname' value='<?php echo $rs['lastname'];?>'></td>
</tr>
<tr>
<td></td>
<td><a href='update2.php?data_id=<?php echo $rs['id'];?>'><input type='submit' name='submit' value='Submit'></a></td>
</tr>
</table>
</form>
<?php } ?>

3. update2.php
<?php
include('config/config.php');
$data_idnew = $_GET['data_id'];
$Namenew = $_POST['Name'];
$lastnamenew = $_POST['lastname'];
$strsql = "UPDATE user SET name='$Namenew',lastname='$lastnamenew' WHERE id='$data_idnew'";
$result = mysql_query($strsql);
if($strsql){
exit("<script> window.location='register.php';</script>");
}
?>

HTML อินพุท placeholder


 แอตทริบิวต์  placeholder คือคำอธิบายจุดประสงค์ของ Textbox ที่เราสร้างขึ้นมาว่าต้องการให้ผู้ใช้งานกรอกอะไรลงไป ส่วนมากเราจะคุ้นตากับการแยกหัวข้อไว้คอลั่มหนึ่ง และสร้าง Textbox ไว้อีกคอลั่มหนึ่ง
ดังตัวอย่างด้านล่างนี้
ชื่อ :
นามสกุล :

ซึ่งเราสามารถใช้งาน แอตทริบิวต์ HTML ที่ชื่อ placeholder แทนได้และดูสวยงามน่าใช้กว่าค่อนข้างมาก
Syntax
<input type='text' name='textname' placeholder='you text'>

ตัวอย่างการนำ placeholder มาประยุกต์ใช้งาน

Code
<table>
     <tr>
          <td><input name="fname" placeholder="ระบุชื่อของคุณที่นี่" type="text" /></td>
     </tr>
     <tr>
          <td><input name="lname" placeholder="ระบุนามสกุลของคุณที่นี่" type="text" /></td>
     </tr>
</table>

การดึงข้อมูลจากฐานข้อมูล มาแสดงใน Select box


 สำหรับวิธีการดึงข้อมูลจากฐานข้อมูลออกมาแสดงที่ Select box นั้นเราจะใช้ While Loop ในการสั่งให้ดึงข้อมูลวนซ้ำจนครบ และนำมาแสดงที่หน้าเว็ปไซต์

Syntax
     while($result = mysql_fetch_array)
     {
          //สิ่งที่ต้องการห้แสดง
     }

ตัวอย่างการใช้งาน
Code
register.php

<form name='regis' method='POST' action='preview.php' onsubmit='return chkfrom();'>
<table width='500' align='center' border='1'>
<tr>
<td>Name :</td>
<td><input type='text' name='Name'></td>
</tr>
<tr>
<td>Lastname :</td>
<td><input type='text' name='lastname'></td>
</tr>
<tr>
<td>Faculty :</td>
<td>
<?php
include('config/config.php');
$strsql = "SELECT * FROM faculty ORDER BY id ASC";
$result = mysql_query($strsql);
?>
<select name='faculty'>
<option value='0'>กรุณาเลือกคณะฯ</opton>
<?php
while($rs = mysql_fetch_array($result))
{
?>
<option value='<?php echo $rs['faculty_name'];?>'><?php echo $rs['faculty_name'];?></opton>
<?php } ?>
</select>
</td>
</tr>
<tr>
<td></td>
<td><input type='submit' name='submit' value='Submit'></td>
</tr>
</table>

preview.php

<meta http-equiv="Content-type" content="text/html; charset=utf8"/ >
<?php
echo $_POST['faculty'];
exit;
?>

ตัวอย่างไฟล์ Database  >>Download<<

การเขียนไฟล์เชื่อมต่อฐานข้อมูล config.php


 สำหรับการเขียนระบบที่ทำการติดต่อกับฐานข้อมูลนั้น จะไม่นิยมเขียนไฟล์ Config ไว้ที่หน้าเพจนั้นๆเพราะว่าจะเป็นอันตรายอย่างมากหากมีผู้ใช้งานทำการคลิกขวาและ view code ก็จะเจอทั้งชื่อผู้ใช้งาน และ รหัสผ่านสำหรับเข้าสู่ฐานข้อมูลทันที  ส่วนมากจะสร้างไว้ในโฟร์เดอร์จากนั้นหากต้องการเรียกใช้งานก็ทำการ include เข้ามาใช้งานได้ตาม Part ที่เราเก็บไฟล์ Config ไว้
Syntax
<?php
$conn = mysql_connect( "localhost", "ชื่อผู้ใช้ฐานข้อมูล", "รหัสผ่าน" );
$dbname = "ชื่อฐานข้อมูล";
mysql_query("SET NAMES UTF8");
if ( ! $conn )
die( "Error :MySQL " );
mysql_select_db( "ชื่อฐานข้อมูล", $conn )
or die ( "can't connect to database" );
?>
ลักษณะการนำไปใช้จะเก็บไว้ในโฟล์เดอร์เช่น สร้างโฟร์เดอร์ชื่อ config ขึ้นมาเก็บและวางไฟล์ config.php ไว้ภายใน เวลาจะเรียกใช้งานไฟล์ สามารถทำได้ดังนี้
<?php
     include('ชื่อโฟร์เดอร์'/config.php);
?>

การใช้งานฟังก์ชัน empty()


 ฟังก์ชัน empty() เป็นการตรวจสอบว่ามีค่าในตัวแปรนั้นหรือไม่โดยเราสามารถนำไปประยุกต์ใช้งานกับฟอร์มต่างเพื่อตรวจสอบก่อนว่ามีการกรอกข้อมูลมาด้วยหรือไม่

Syntax
empty($ชื่อตัวแปร)

Code
<?php
$sitename = "codecssjavaphphtmlsql.blogspot.com";
if(empty($sitename )){
     echo "ERROR : Empty This Data";
}else{
     echo "SITE NAME :".$sitename ;
}
?>

อธิบาย Code
$sitename = "codecssjavaphphtmlsql.blogspot.com"; // กำหนดค่าชื่อเว็ปไซต์ให้กับตัวแปร $sitename
if(empty($sitename )){ //ให้ทำการตรวจสอบว่าตัวแปร $sitename มีข้อมูลหรือไม่
echo "ERROR : Empty This Data"; // ถ้าไม่มีข้อมูลให้แสดงข้อความ   Empty This Data
echo "SITE NAME :".$sitename ; // ถ้ามีข้อมูลให้แสดงข้อความ SITE NAME และตามด้วย ค่าของตัวแปร $sitename นั่นก็คือ codecssjavaphphtmlsql.blogspot.com

การใช้งานฟังก์ชัน unlink()


 unlink() เป็นฟังก์ชั่นที่ใช้ในการลบไฟล์ข้อมูลที่อยู่ในโฟล์เดอร์ต่างๆที่เราทำการสร้างขึ้นมาเก็บไฟล์ ส่วนใหญ่ที่เจอจะเป็นลักษณะการเก็บรูปภาพลงในฐานข้อมูลโดยมีการแนบไฟล์มา เมื่อทำการคลิกที่ Delete file จะไปทำการ Delete ไฟล์ที่แนบมาด้วยตามที่เรากำหนด

Syntax
unlink($filename);

Code ตัวอย่าง
$strsql = "SELECT * FROM TABLENAME WHERE id='SOMEVALUE'";
$result = mysql_query($strsql);
while($rs = mysql_fetch_array($result))
{
$myfile = $rs['files'];
}
$myfile2 = $myfile;
$filename = "files/$myfile2";
if(!empty($myfile2)){
unlink($filename);
$strsql = "DELETE FROM circle_doc WHERE id='$doc_id'";
mysql_query($strsql);
}

อธิบาย Code
$filename = "files/$myfile2";  // files หมายถึงชื่อโฟล์เดอร์ที่ทำการเก็บไฟล์ $myfile2 หมายถึงชื่อไฟล์
if(!empty($myfile2)) //ทำการตรวจสอบว่ามีไฟล์เก็บในตัวแปลที่ต้องการลบใหม
unlink($filename);//ถ้ามีให้ทำการลบไฟล์ตามที่กำหนด
$strsql = "DELETE FROM circle_doc WHERE id='$doc_id'";//และลบข้อมูลออกจากฐานข้อมูลด้วย 

แสดงขนาดไฟล์ Upload


 ในการ Upload ไฟล์ขึ้นสู่ Server ไปแล้วนั้นหากเราต้องการนำไฟล์นั้นมาแสดงที่หน้าระบบและให้แสดงขนาดของไฟล์นั้นๆด้วยสามารถทำได้โดย

Syntax
$file_size = filesize($filename);
echo $file_size ;

โดยหน่วยที่ได้จะแสดงออกมาเป็น Byte  หากต้องการให้ระบบคำนวนด้วยสามารถเพิ่ม Code ด้านล่างลงไปเพื่อให้คำนวนก่อนนำมาแสดงที่หน้าเว็ป

if ($file_size < 1000 * 1024){
echo number_format($file_size / 1024, 2) . " KB";
}elseif ($file_size < 1000 * 1048576){
echo number_format($file_size / 1048576, 2) . " MB";
}elseif ($file_size < 1000 * 1073741824){
echo number_format($file_size / 1073741824, 2) . " GB";
}else{
echo number_format($file_size / 1099511627776, 2) . " TB";

การเขียนคำสั่ง php ให้สร้างไฟล์ php


 การเขียนคำสั่ง php ให้สร้างไฟล์ php อ่านดูแล้วงง กันใหมครับ 555+  คือเขียนคำลั่ง php ให้ทำการสร้างไฟล์ php ใหม่ขึ้นมา และในไฟล์ php ใหม่ที่สร้างมานั้นก็ให้ทำการเขียนไฟล์ php ลงไปด้วย
<?php
  $hostname = $_POST['hostname'];//รับค่าจากฟอร์ม
$username = $_POST['username'];//รับค่าจากฟอร์ม
$password = $_POST['password'];//รับค่าจากฟอร์ม
$dbname = $_POST['dbname'];//รับค่าจากฟอร์ม

$filecreat = mkdir('config');
    $strFileName = "config/config.php";
    $objFopen = fopen($strFileName, 'w');
    $strText1 = "<?php
\$conn = mysql_connect( '$hostname', '$username', '$password');
\$dbname = '$dbname';
mysql_query('SET NAMES UTF8');
if ( ! \$conn )
die('Error :MySQL');
mysql_select_db( '$dbname', \$conn )
or die ( 'cannot connect to database');
?>
";
    fwrite($objFopen, $strText1);

    if($objFopen)
    {
        echo "File $strFileName writed.";
    }
    else
    {
        echo "File $strFileName can not write";
    }
    echo "<br/>";
    fclose($objFopen);

?>
อธิบาย Code นี้คือเป็นการเขียนคำสั่งสร้างไฟล์ config.php และเขียนข้อมูลการเชื่อมต่อ database ลงไปด้วย