|
|
|
ขอ้ปรึกษาเรื่อง Live table update โดยใช้ Ajax Jquery หน่อยครับติดมาสี่วันแล้วครับผมใช้ bootstrap framework ทำ interface ครับ |
|
|
|
|
|
|
|
ให้กดที่ปุ่มแก้ไข แล้วขึ้น popup modal / fancybox และมีฟอร์มแสดงข้อมูลเดิม และแก้ไขได้ด้วย ประมาณนั้นหรือป่าวครับ
|
|
|
|
|
Date :
2015-03-03 17:33:07 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ขอลองเขียนเล่นแปปน่ะครับ
|
|
|
|
|
Date :
2015-03-03 17:48:00 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ลืมเรื่อง datepicker ครับ
http://jsfiddle.net/j5pLogmL/4/
Code (PHP)
<style type="text/css">
.inline{
display:inline-block;
width:120px;
}
.textedit{
border:0px;
width:119px;
text-align:left;
}
.textborder{
border:1px solid black;
}
</style>
<div class='inline'>
<input class='textedit' name='fname' data-id='10001' value='Smith' />
</div>
<div class='inline'>
<input class='textedit selection' name='process' value='ยังไม่มีการดำเนินการ' />
</div>
<div class='inline'>
<input class='textedit datepicker' name='datepicking' value='2015-03-03' />
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var selection = '<select class="selection"><option value="ยังไม่มีการดำเนินการ">ยังไม่มีการดำเนินการ</option><option value="กำลังจัดส่ง">กำลังจัดส่ง</option></select>';
var inputbox = '<input class="textedit selection" name="process" value="" />';
var selectText = '';
$("div.inline").on("focus","input.textedit",function(){
var current = $(this);
if(current.hasClass('selection')){
selectText = current.val();
current.parent('div.inline').empty().append($(selection).val(selectText));
}else{
current.addClass('textborder');
}
}).on("focusout","input.textedit",function(){
var current = $(this);
if(!current.hasClass('selection')){
current.removeClass('textborder');
}
});
$("div.inline").on("change focusout","select.selection",function(){
var current = $(this);
var parentNode = current.parent("div.inline");
selectText = $("option:selected",current).val();
current.remove();
parentNode.append($(inputbox).val(selectText));
});
$("div.inline").on("focus click","input.datepicker",function(){
$(this).datepicker({dateFormat:'yy-mm-dd'});
});
});
</script>
|
ประวัติการแก้ไข 2015-03-03 23:38:14 2015-03-04 08:03:08
|
|
|
|
Date :
2015-03-03 23:29:34 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ขอบคุณพี่ๆทุกคนนะครับที่มาตอบ
|
|
|
|
|
Date :
2015-03-04 09:57:43 |
By :
tantai |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 00
|