การตรวจสอบข้อมูลซ้ำด้วย Ajax บน Booststap

Booststap Knowledge ความรู้สำหรับการออกเว็บเพื่อให้แสดงผล ได้ดี ทุกหน้าจอ

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
M004
PHP VIP Members
PHP VIP Members
โพสต์: 1323
ลงทะเบียนเมื่อ: 01/01/1970 7:00 am

การตรวจสอบข้อมูลซ้ำด้วย Ajax บน Booststap

โพสต์ที่ยังไม่ได้อ่าน โดย M004 »

การตรวจสอบข้อมูลซ้ำด้วย Ajax บน Booststap
สำหรับการตรวจสอบข้อมูลซ้ำ นั้น จะตรวจข้อมูลจาก Database เพือป้องกันการกรอกข้อมูลซ้ำ

ตัวอย่าง
ข้อมูลใน database
2.png
2.png (6.4 KiB) Viewed 5526 times
เมื่อกรอกข้อมูลซ้ำกับ ข้อมูลในdata base จะแจ้งเตือนข้อความดังนี้
1.png
1.png (14.07 KiB) Viewed 5526 times
เริ่มต้นแทรก Script bootstrap.js / jquery.min.js ลงใน html

ไฟล์ index.html
แทรก Script ดังนี้

โค้ด: เลือกทั้งหมด

<script type="text/javascript">
$(document).ready(function(){

	$("#txtUser,#txtEmail").change(function(){

			$("#sUser").empty();
			$("#sEmail").empty();

			$.ajax({ 
				url: "ajax.php" ,
				type: "POST",
				data: 'sUser=' +$("#txtUser").val()+'&eMail='+$("#txtEmail").val()
			})
			.success(function(result) { 

					var obj = jQuery.parseJSON(result);

					if(obj != '')
					{
						  $.each(obj, function(key, inval) {

								   if($("#txtUser").val() == inval["user"])
								  {
									   $("#sUser").html(" <font color='red'>ชื่อมีอยู่แล้ว</font>");
								  }

								   if($("#txtEmail").val() == inval["email"])
								  {
									   $("#sEmail").html(" <font color='red'>อีเมล์นี้มีอยู่แล้ว</font>");
								  }

						  });
					}

			});

		});
	});
</script>
ส่วนของ Form

โค้ด: เลือกทั้งหมด

<table class="table">

  <tr>
    <td>User</td>
    <td><input type="text" id="txtUser" name="txtUser">
	<span id="sUser"></span>
	</td>
  </tr>
  <tr>
    <td>Email <font color="red">*</font></td>
    <td><input type="text" id="txtEmail" name="txtEmail">
	<span id="sEmail"></span>
	</td>
  </tr>
 
</table>
ไฟล์ ajax.php

โค้ด: เลือกทั้งหมด

<?php
    $strSQL = "SELECT * FROM member WHERE user = '".$_POST["sUser"]."' OR email = '".$_POST["eMail"]."' ";
    $objQuery = mysql_query($strSQL) or die (mysql_error());
    $intNumField = mysql_num_fields($objQuery);
    $resultArray = array();
    while($obResult = mysql_fetch_array($objQuery))
    {
        $arrCol = array();
        for($i=0;$i<$intNumField;$i++)
        {
            $arrCol[mysql_field_name($objQuery,$i)] = $obResult[$i];
        }
        array_push($resultArray,$arrCol);
    }
    
    
    echo json_encode($resultArray);
?>
กระทู้เกี่ยวข้อง
Typeahead ทำ Autocomplete บน Booststap
การตรวจสอบข้อมูลซ้ำด้วย Ajax บน Booststap
Auto Fill ข้อมูลด้วย Ajax บน Booststap
ภาพประจำตัวสมาชิก
gigahertz
PHP Newbie
PHP Newbie
โพสต์: 1
ลงทะเบียนเมื่อ: 26/02/2015 8:41 pm

Re: การตรวจสอบข้อมูลซ้ำด้วย Ajax บน Booststap

โพสต์ที่ยังไม่ได้อ่าน โดย gigahertz »

ทำไมของหนู มันไม่ขึ้นแจ้งเตือนเลยค่ะ TT
ตอบกลับโพส
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 67