มีเรื่องถามการอับเดทข้อลมูลของ Jquery โค๊ตเอามาจากเว็บนี้

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา มีเรื่องถามการอับเดทข้อลมูลของ Jquery โค๊ตเอามาจากเว็บนี้

มีเรื่องถามการอับเดทข้อลมูลของ Jquery โค๊ตเอามาจากเว็บนี้

ตามหน้านี้ครับ

https://www.ninenik.com/แก้ไขข้อความแบบทันที_ด้วย_jQuery-160.html

แก้ไขข้อความแบบทันที ด้วย jQuery

แล้วผมจะทำให้มันส่งข้อมูลไปอับเดท ยังไงครับ ต้องส่งค่าไรออกไปครับ แล้วฝั่ง รับข้อมูลต้องเขียนคร่าวๆยังไงช่วยทีนะครับผม

Teayzad31 27.130.59.xxx 06-10-2010 03:52:03

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก

ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
User

Pass

Code
เปลี่ยน

จำข้อมูลการล็อกอิน
เข้าระบบอัตโนมัติ

( หรือ เข้าใช้งานผ่าน Social Login )

ล็อกอินด้วย Line

ล็อกอินด้วย Google

ล็อกอินด้วย Twitter

ล็อกอินด้วย Tiktok

ความคิดเห็นที่ 1

https://www.ninenik.com/demo/swap_textarea.php ลองดูจากโค้ด ไปก่อน เนื้อหาคำอธิบาย จะนำไปอัพเดท ในหัวข้างต้นภายหลัง

<?php
header("Content-type:text/html; charset=UTF-8");        
header("Cache-Control: no-store, no-cache, must-revalidate");       
header("Cache-Control: post-check=0, pre-check=0", false);       
if(count($_POST)>0){
	echo "<pre>";
	print_r($_POST);
	echo "</pre>";	
	exit;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>swap textarea editable</title>
<style type="text/css">
html{
		
}
body{
	font-family:tahoma, "Microsoft Sans Serif", sans-serif, Verdana;
	font-size:12px;
}
/* css สำหรับปุ่ม */
.okButton{
	border:1px groove #CCC;
	background-color:#390;
	color:#FFF;
	font-size:10px;
	margin-right:3px;
	cursor:pointer;
}
.cancelButton{
	border:1px groove #CCC;
	background-color:#FF0;
	color:#000;
	font-size:10px;
	margin-right:3px;
	cursor:pointer;
}
.editable_textarea{
	width:350px;
	height:100px;
}
</style>
<title>แก้ไขข้อความแบบทันที ด้วย jQuery</title>
</head>

<body>

<div style="margin:auto;width:550px;">
<p class="editable" id="data1">
ข้อความทดสอบ 1 ข้อความทดสอบ 1 ข้อความทดสอบ 1 ข้อความทดสอบ 1 ข้อความทดสอบ 1<br />
ข้อความทดสอบ 1 ข้อความทดสอบ 1 ข้อความทดสอบ 1 ข้อความทดสอบ 1 ข้อความทดสอบ 1 
</p>
<p class="editable" id="data2">
ข้อความทดสอบ 2 ข้อความทดสอบ 2 ข้อความทดสอบ 2 ข้อความทดสอบ 2 ข้อความทดสอบ 2<br />
ข้อความทดสอบ 2 ข้อความทดสอบ 2 ข้อความทดสอบ 2 ข้อความทดสอบ 2 ข้อความทดสอบ 2 <br />
test
</p>


<div id="consoleD" style="border:1px solid #CCC;background-color:#FFFFF0;color:#333;">

</div>
</div>


<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
var tempVal=[];
$(function(){
	$(".editable").click(function(){
		var indexThis=$(".editable").index(this);
		tempVal[indexThis]=$(".editable").eq(indexThis).html(); 
		editalbeThis(indexThis);
	});	
	$(".cancelButton").live("click",function(){
		var indexThis=$(this).parent(".editable").index();		
		$(this).parent(".editable").html(tempVal[indexThis]);
		$(".editable").eq(indexThis).click(function(){
			editalbeThis(indexThis);
		});
	});
	$(".okButton").live("click",function(){
		var indexThis=$(this).parent(".editable").index();		
		var newValue=$(this).siblings("textarea").val();
		var field=$(this).siblings("textarea").attr("id");
		$(this).parent(".editable").html(newValue);
		tempVal[indexThis]=newValue; 		
		$.post("swap_textarea.php",{
			"field":field,
			"value":newValue
		},function(data){
			$("#consoleD").html(data);
		});
		$(".editable").eq(indexThis).click(function(){
			editalbeThis(indexThis);
		});
	});	
});
function editalbeThis(index){
	var curThis=index;
	var gData=$(".editable").eq(curThis).text();
	var data=$("<textarea/>",{
		"name":$(".editable").eq(curThis).attr("id"),
		"class":"editable_textarea",
		"id":$(".editable").eq(curThis).attr("id"),
		"text":gData
	});
	var buttonUpdate="<br><button class=\"okButton\">Update</button>";
	var buttonCancel="<button class=\"cancelButton\">Cancel</button>";
	$(".editable").eq(curThis).unbind("click");
	$(".editable").eq(curThis).html(data).append(buttonUpdate).append(buttonCancel);	
}
</script>

</body>
</html>

Ninenik 183.89.223.xxx 06-10-2010

ขอบคุณทุกการสนับสนุน

สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet

20 บาท 50 บาท 100 บาท 300 บาท หรือ ระบุจำนวน