|
 |
| |
ขอความช่วยเหลือหน่อยค่ะ หาวิธีมาทั้งวันแล้วไม่ได้ซักที เรื่อง jquery กับ bootstrap ค่ะ |
| |
 |
|
|
 |
 |
|
โดยค่าปริยาย มันจะสามารถ toggle ออกจาก modal mode ได้อยู่แล้วครับ
การคลิ๊กที่พื้นที่ใดๆ ไม่ได้(modal ไม่ปิด) นั่นแสดงว่า พื้นที่ backdrop หายไป หรืออาจมีการโมโค้ด modal มาก่อนแล้วก็เ็ป็นได้
แต่ถ้าหากยังไม่มีการโม
ในที่นี้ โค้ดเท่าที่น้อง จขกท ให้มา ไม่มีส่วนใดเกี่ยวกับพื้นที่ backdrop ครับ
|
 |
 |
 |
 |
| Date :
2014-02-07 17:34:40 |
By :
triplea |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ขอบคุณมากค่ะ สำหรับคำตอบ แต่เราไม่ได้โมอะไรเลยนะ
Code (PHP)
<script type="text/javascript">
$(document).ready(function(){
$("#bt_adddis").click(function(){
var dis = $("input[name*='txt_dis']").val();
var id = $("input[name*='txt_id']").val();
$.ajax({
type: "POST",
url: "mmap/tb_dis.php",
cache: false,
data: "insert=1&dis="+dis+"&hurs="+id,
beforeSend: function(){$(".show_diss").html("<br/><br/><br/><center><img class='immap' src='image/map/ajax-loader.gif'/></center><br/><br/><br/>");},
success: function(msg){
$(".show_diss").empty();
$(".show_diss").append(msg);
}
});
});
});
function del_dis(dis,am){
if(confirm("ต้องการลบข้อมูลนี้หรือไม่?"))
{
$.ajax({
type: "POST",
url: "mmap/tb_dis.php",
cache: false,
data: "del=1&hurs="+am+"&dis="+dis,
beforeSend: function(){$(".show_diss").html("<br/><br/><br/><center><img class='immap' src='image/map/ajax-loader.gif'/></center><br/><br/><br/>");},
success: function(msg){
$(".show_diss").empty();
$(".show_diss").append(msg);
}
});
}
else
{
return false;
}
}
</script>
<?php
include "../config.php";
$amphur = $_POST['amphurs'];
if(isset($_POST['insert'])){
$dis_name = $_POST['dis'];
if($_POST['insert']==1){
mysql_query("INSERT INTO `district` ( `DISTRICT_CODE`, `DISTRICT_NAME`, `AMPHUR_ID`, `dt_id`, `GEO_ID`) VALUES ( '9999', '$dis_name', '$amphur', '1', '1')");
}
}
if(isset($_POST['del'])){
$diss_id = $_POST['dis'];
if($_POST['del']==1){
mysql_query("DELETE FROM `district` WHERE `DISTRICT_ID` = $diss_id");
}
}
$result=mysql_query("SELECT * FROM district WHERE AMPHUR_ID= '$amphur' ORDER BY DISTRICT_ID DESC");
$result111=mysql_query("SELECT AMPHUR_NAME FROM amphur WHERE AMPHUR_ID = $amphur;");
while($row = mysql_fetch_array($result111)){
$a_name = $row['AMPHUR_NAME'];
}
sleep(1);
?>
<right style="float: right;"><a href="#" data-toggle="modal" data-target="#addddis"><button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-plus"> เพิ่มตำบล</button></a></right>
<table class="table table-hover" >
<thead>
<tr>
<th>รหัสอำเภอ</th>
<th>ชื่ออำเภอ</th>
<th>การสำรวจพื้นที่</th>
<th>###</th>
</tr>
</thead>
<?PHP while($row = mysql_fetch_array($result)){ ?>
<tr>
<td><?PHP echo $row['DISTRICT_ID'];?></td>
<td><?PHP echo $row['DISTRICT_NAME'];?></td>
<td><?PHP if($row['GEO_ID']==0){echo '<font color="green">สำรวจแล้ว</font>';}else{ echo '<font color="red">ยังไม่สำรวจ</font>';}?></td>
<td><button type="button" class="btn btn-warning btn-sm">แก้ไข</button> <button type="button" onclick="del_dis(<?PHP echo $row['DISTRICT_ID'].",".$row['AMPHUR_ID'];?>);" class="btn btn-danger btn-sm">ลบ</button></td></tr>
<?PHP } ?>
</table>
<div class="modal fade" id="addddis" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">เพิ่มตำบลใหม่ในอำเภอ <?PHP echo $a_name; ?></h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="inputName" class="col-lg-2 control-label">ชื่อตำบล</label>
<div class="col-lg-10">
<input type="text" class="form-control" name="txt_dis" id="txt_dis" value="" required="">
<input type="hidden" class="form-control" name="txt_id" id="txt_id" value="<?PHP echo $amphur; ?>" required="">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">ปิด</button>
<button type="button" id="bt_adddis" class="btn btn-primary" value="Submit">บันทึก</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
|
| |
|
|
| |
| Date :
2014-02-07 18:18:18 |
By :
AEC |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
มันปิดไม่ได้จริงๆ พื้นที่ของ modal ที่เป็นฟอร์ม ก็หายไปด้วย เหลือแต่ พื้นที่สีดำๆ โปร่งใส คลิกอะไรไม่ได้เลย สงกะสัย ต้องเปลี่ยนวิธีแล้วค่ะ ขอบคุณนะคะ ถ้าไม่กรอกข้อมูลผ่าน modal ก็ปกติทุกอย่าง แต่ว่ามันสวยดี เลยอยากจะใช้ ขอบคุณสำหรับคำแนะนำค่ะ
|
| |
|
|
| |
| Date :
2014-02-07 18:23:41 |
By :
AEC |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
Code (PHP)
$.ajax({
type: "POST",
url: "mmap/tb_dis.php",
cache: false,
data: "insert=1&dis="+dis+"&hurs="+id,
beforeSend: function(){$(".show_diss").html("<br/><br/><br/><center><img class='immap' src='image/map/ajax-loader.gif'/></center><br/><br/><br/>");},
success: function(msg){
$(".show_diss").empty();
$(".show_diss").append(msg);
$("button[class=close]").trigger('click');// ลองเพิ่มตรงนี้
}
});
|
| |
|
|
| |
| Date :
2014-02-07 20:06:47 |
By :
Krungsri |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอบคุณพี่ Krungsri มากค่ะ ที่มาให้คำแนะนำ มันใช้ได้ค่ะ หนูลองแล้วแล้ว เหมือนที่พี่ TripleA บอกไว้เลย โค๊ดที่หนูให้ไปไม่น่ามีผลกับส่วนนี้
หนูลองเอามาเขียนใหม่ ก็ใช้งานปกติ แต่ว่าถ้าเข้าโปรเจคติดจอดำกดอะไรไม่ได้เหมือนเดิม
Code (PHP)
<html lang="en">
<head>
<meta charset="utf-8">
<title>Fixed Top Navbar Example for Bootstrap</title>
<!-- Bootstrap core CSS -->
<link href="bootstrap-3.0.3/dist/css/bootstrap.css" rel="stylesheet">
</head>
<body>
<a href="#" data-toggle="modal" data-target="#adddam"><button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-plus"> เพิ่ม</button></a>
<br/>
<div class="addmaps"></div>
<!-- Modal addam -->
<div class="modal fade" id="adddam" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">เพิ่มใหม่</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="inputName" class="col-lg-2 control-label">ชื่อ</label>
<div class="col-lg-10">
<input type="text" class="form-control" name="txt_amphur" id="inputName" value="" required="">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" id="bt_cam" class="btn btn-default" data-dismiss="modal">ปิด</button>
<button type="button" id="bt_adddam" class="btn btn-primary" value="Submit">บันทึก</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="bootstrap-3.0.3/dist/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#bt_adddam").click(function(){
var amphur = $("input[name*='txt_amphur']").val();
$.ajax({
type: "POST",
url: "mmap/add_am.php",
cache: false,
data: "insert=1&hurs="+amphur,
beforeSend: function(){$(".addmaps").html("<br/><br/><br/><center><img class='immap' src='image/map/ajax-loader.gif'/></center><br/><br/><br/>");},
success: function(msg){
$(".addmaps").empty();
$(".addmaps").append(msg);
alert("เพิ่มอำเภอสำเร็จแล้ว!!");
$("button[id=bt_cam]").trigger('click');
}
});
});
});
</script>
</body>
</html>
ใช้งานได้ปกติเลย ทำงานถูกต้องตามที่คิดไว้ทุกอย่าง แสดงว่าน่าจะเป็นที่ระบบแล้วค่ะ ตอนนี้ใช้วิธีนี้ แก้ขัดไปก่อน อิอิCode (PHP)
$.ajax({
type: "POST",
url: "mmap/add_am.php",
cache: false,
data: "insert=1&hurs="+amphur,
beforeSend: function(){$(".addmaps").html("<br/><br/><br/><center><img class='immap' src='image/map/ajax-loader.gif'/></center><br/><br/><br/>");},
success: function(msg){
$(".addmaps").empty();
$(".addmaps").append(msg);
alert("เพิ่มอำเภอสำเร็จแล้ว!!");
location.reload();
}
});
ขอบคุณสำหรับคำตอบค่ะ
|
| |
|
|
| |
| Date :
2014-02-08 09:18:16 |
By :
AEC |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 05
|
