|
 |
| |
jquery edit inline ผมอยากทราบว่ามีวิธี หรือ Code ตัวอย่างในการทำ Edit inline โดยใช้ jquery เปล่าครับ |
| |
 |
|
|
 |
 |
|
ขอดูโค้ดหน่อยครับ เผื่อผม ช่วยได้ พอดีกำลังศึกษาเรื่องนี้อยู่เหมือนกันครับ
|
 |
 |
 |
 |
| Date :
2009-10-23 17:46:39 |
By :
DownsTream |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
Code (PHP)
<!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>Route Point Person</title>
<link rel='stylesheet' type='text/css' href='../library/jQuery/js/styles.css' />
<script type='text/javascript' src='../library/jQuery/js/jquery-1.3.1.min.js'></script>
<script type='text/javascript' src='../library/jQuery/js/jquery.inline-edit.js'></script>
<script type='text/javascript'>
$(document).ready(function(){
$('.inline-edit').inlineEdit({hover: 'hover'});
});
</script>
<?php
require '../function/Template.php';
require '../function/Connect.php';
require '../function/DateTime.php';
require '../function/ddl_value.php';
Template::get_Css_Template();
?>
</head>
<body>
<div class='inline-edit' style='border: none;'>
<div class='display'>Default</div>
<div class='form'>
<input type='text' class='text' /><br>
<input type='submit' class='save' value=' Save ' />
<input type='submit' class='cancel' value=' Cancel ' />
</div>
</div>
<?
//$slc_all = "SELECT * from testview ";
$slc_all = "SELECT master_route.routename, master_point.Pointname, COUNT(master_employee.Empcode) AS icount ";
$slc_all.= "FROM master_route, master_point, master_employee ";
$slc_all.= "WHERE (master_employee.PointID = master_point.PointID) AND (master_point.PointID = master_employee.PointID) AND ";
$slc_all.= "(master_route.PointID = master_point.PointID) AND (master_point.PointID = master_route.PointID) ";
$slc_all.= "GROUP BY master_route.routename, master_point.Pointname ";
$result_all = mysql_query($slc_all,$db_con)or die("ไม่สามารถค้นหา ข้อมูล Department ได้");
/* ### Code แบ่ง Page ###*/
$i=1;// $i คือ ตัวเลขที่ใช้คำนวณ การสร้างสีครับ
/* เป็นการแบ่งหน้า*/
/*$Per_Page =15;
if(!$Page)
{
$Page =1;
}
$Prev_Page =$Page-1;
$Next_Page = $Page+1;
$Page_Start = ($Per_Page*$Page)-$Per_Page;*/
$Num_Rows = mysql_num_rows($result_all);
/*if($Num_Rows<=$Per_Page)
{
$Num_Pages=1;
}
else if(($Num_Rows%$Per_Page)==0)
{
$Num_Pages = ($Num_Rows/$Per_Page);
}
else
{
$Num_Pages = ($Num_Rows/$Per_Page)+1;
}
$Num_Pages=(int)$Num_Pages;
if( ($Page>$Num_Pages) || ($Page<0) )
{
print "จำนวน$Pageมากกว่า$Num_Pages";
}*/
//เพิ่ม Limit เข้าไป
//$slc= $slc_all;//." LIMIT $Page_Start,$Per_Page ";
$result_dep =mysql_query($slc_all,$db_con)or die("ไม่สามารถติดต่อฐานข้อมูลได้");
$result_nvan =mysql_query($slc_all,$db_con)or die("ไม่สามารถติดต่อฐานข้อมูลได้");
$tmp_count = 0;
$nvan_array;
//ลูป สำหรับ ใส่ ชื่อ van
while($row_nvan = mysql_fetch_array($result_nvan))
{
$nvan_array[] = $row_nvan["icount"];
}
$index_arr = 0;
while($row_dep = mysql_fetch_array($result_dep))
{
$bgcolor =($i++ %2)?'#FFFFFF':'#F3F2F4';
$tmp_count_van = $tmp_count_van + $row_dep["icount"];
$tmp_name_van =$nvan_array[$index_arr];
//echo "count".$tmp_count." ";
//echo "name :".$tmp_nroute;
//ตรวจสอบ
$status = "Active";
/*if($row_dep["DepartmentStatus"] == 0)
{
$status="InActive";
}
else
{
$status="Active";
}
$effDate;
$effDate = convertDateTimeDBToString($row_dep['EffDate']);*/
//เปรียบเทียบ ว่าค่ามานตรงกันป่ะกับ DB ในฐานข้อมูล
if($row_dep["routename"]==$tmp_nroute)
{
// ถ้าตรงกับค่าเดิมให้สร้างตารางต่อไป แสดงว่ายังอยู่ในประเภทเดิม
?>
<tr bgcolor="<? echo $bgcolor; ?>" >
<td height="32" id = '<? echo $row_dep["routeid"];?>'></td>
<td height="32" id = '<? echo $row_dep["Pointname"];?>'><? echo $row_dep["Pointname"]; ?></td>
<td height="32" id = '<? echo $row_dep["icount"]; ?>' ><? echo $row_dep["icount"]; ?> </td>
<td height="32" id = '<? echo $row_dep["icount"]; ?>' > <div class='inline-edit' style='border: none;'>
<div class='display'><? echo $tmp_name_van;?></div>
<div class='form'>
<input type='text' class='text' /><br>
<input type='submit' class='save' value=' Save ' />
<input type='submit' class='cancel' value=' Cancel ' />
</div>
</div></td>
<td height="32"><table width="65%" border="0" align="center">
<tr>
<td align="center" id = '<? echo $effDate; ?>' >
<a id='<? echo $row_dep["routeid"];?>' class='edit' title='Edit'>
<img src="../images/edit.png" width="17" height="16" style="cursor:pointer" /></a></td>
</tr>
</table></td>
</tr>
<?
}
else
{
if($tmp_nroute !="")
{
?>
<tr>
<td colspan="2">GrandTotal</td>
<td><? echo $tmp_count;?></td>
<td></td>
<td></td>
</tr>
</table>
<?
$tmp_count = 0;
}
// ส่วน ของ หัว ตาราง ตอนเริ่มต้นประเภทใหม่
?>
<table width="98%" border="0" align="center" cellspacing="1" class="table1" id="table1">
<tr>
<td width="24%" height="20" align="center" bgcolor="#a6b4bb" class="boldwhite">Route</td>
<td width="21%" height="20" align="center" bgcolor="#a6b4bb" class="boldwhite">Point</td>
<td width="21%" align="center" bgcolor="#a6b4bb" class="boldwhite">Count(Person)</td>
<td width="21%" align="center" bgcolor="#a6b4bb" class="boldwhite">Van</td>
<td width="13%" bgcolor="#a6b4bb"> </td>
</tr>
<tr bgcolor="<? echo $bgcolor; ?>" >
<td height="32" id = '<? echo $row_dep["routeid"];?>'><? echo $row_dep["routename"]; ?></td>
<td height="32" id = '<? echo $row_dep["Pointname"];?>'><? echo $row_dep["Pointname"]; ?></td>
<td height="32" id = '<? echo $row_dep["icount"]; ?>' ><? echo $row_dep["icount"]; ?> </td>
<td height="32" id = '<? echo $row_dep["icount"]; ?>' >
<div class='inline-edit' style='border: none;'>
<div class='display'><? echo $tmp_name_van;?></div>
<div class='form'>
<input type='text' class='text' /><br>
<input type='submit' class='save' value=' Save ' />
<input type='submit' class='cancel' value=' Cancel ' />
</div>
</div>
</td>
<td height="32"><table width="65%" border="0" align="center">
<tr>
<td align="center" id = '<? echo $effDate; ?>' >
<a id='<? echo $row_dep["routeid"];?>' class='edit' title='Edit'>
<img src="../images/edit.png" width="17" height="16" style="cursor:pointer" /></a></td>
</tr>
</table></td>
</tr>
<?
}
$tmp_count = $tmp_count+$row_dep["icount"];
$tmp_nroute =$row_dep["routename"];
$index_arr = $index_arr + 1;
?>
<?
}
if($Num_Rows==0)
{
?>
<tr>
<td colspan="4" align="center" class="normal">ไม่มีข้อมูลในรายการนี้</td>
</tr>
<?
}
?>
<tr>
<td colspan="2">GrandTotal</td>
<td><? echo $tmp_count;?></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
http://www.codenothing.com/demos/2009/inline-edit/index.html เป้นตัว plugin ที่ใช้อยู่ครับ
|
| |
|
|
| |
| Date :
2009-10-23 20:25:39 |
By :
Kingnaka |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ซับซ้อนอยู่นะ
ต้องมีการซ้อน input ไว้ก่อน
พอคลิก ให้แสดง input นั้น แล้วซ่อน html
จะสลับกลับไปกลับมา โดยตอนเซฟก็ใช้ ajax เซฟเอา
|
| |
|
|
| |
| Date :
2009-10-23 22:53:52 |
By :
danya |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ครับ
แล้วถ้าตอน save จะค่า ของแต่ละแถว ก่อน
แล้วตอนข้างล่างสุดของ ตาราง มีปุ่ม submit ส่งไปทีเดียว
ผมอยากทราบว่า ผมจะเก้บค่าที่แก้ไข ยังไงได้มั่งครับ
หวังว่าคงไม่งงกับคำถามน่ะครับ
|
| |
|
|
| |
| Date :
2009-10-23 23:04:33 |
By :
Kingnaka |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ต้องเล่นกับตัวแปร array ของ $_POST แล้วอะคับ
วนลูปทั้งหมดแล้วจัดการตัวแปรให้ให้สามารถบันทึกได้หลายตารางในครั้งเดียว
|
| |
|
|
| |
| Date :
2009-10-24 00:44:41 |
By :
danya |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอบคุณครับสำหรับทุกคำตอบ
ผมอยากทราบว่า จะสามารถทำไงได้มั่งถ้าจะให้ตรง
Grand total ที่เท่ากับ 11 เปลี่ยน เป้นผลรวมใหม่ที่ผมได้ทำการแก้ไข
ซึ่งค่าที่ได้ทำการแก้ไขน่ะใช้ jquery edit inline ไม่ได้เกี่ยวข้องกับ ฐานข้อมูล
สามารถทำไงได้มั่งครับ
ถ้าไม่เข้าใจคำถามรบกวนช่วยท้วง ด้วยน่ะครับ
ขอบคุณมากครับ
thaicreate กับ narisa ช่วยผมมาในโปรเจคแรกแล้ว
โปรเจคที่สองช่วยผมด้วยน่ะครับ
|
| |
|
|
| |
| Date :
2009-10-24 11:27:45 |
By :
Kingnaka |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 04
|
