 |
มีปัญหาในการใช้งาน SweetAlert ครับ เด้งเตือนแล้วหายไปไวมาก |
| |
 |
|
|
 |
 |
|
ผมพบปัญหาเหมือนกับกับกระทู้นี้ ได้ลองพยายามแก้ไขตามแล้ว แต่ยังไม่สำเร็จครับ
เมื่อกดปุ่ม Add IP จะ Alert แล้วหายไปไวมาก
 Quote:https://www.thaicreate.com/php/forum/125406.html
ไฟล์ index.php
Code (PHP)
<?php
// Connect Database
include("db_connection.php");
// Get the client ip address
$ipaddress = $_SERVER['REMOTE_ADDR'];
$ip = "https://api.ipdata.co/".$ipaddress;
// API IP Data
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $ip);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($ch, CURLOPT_HEADER, FALSE);
curl_setopt($ch, CURLOPT_HTTPHEADER, array(
"Accept: application/json"
));
$response = curl_exec($ch);
curl_close($ch);
$data = json_decode($response);
$ip = $data->ip;
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>What Is My IP Address</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- DataTable -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedheader/3.1.2/css/fixedHeader.bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Prompt" rel="stylesheet">
<style>
label {
margin-bottom: 0px !important;
}
</style>
</head>
<body>
<!-- Start Container -->
<div class="container-fluid">
<!-- Start Page Header -->
<div class="page-header" >
<div class="row">
<div class="col-md-5" >
<h2 style="margin-top:0px;">What Is My IP Address</h2>
<h5>Office of Information Technology and Service Development (ITSD)</h5>
</div>
<div class="pull-right">
<div class="col-md-12">
<label for="ip">Your Public IP :</label>
<form class="form-inline" method="POST" id="ipaddress-form">
<div class="form-group">
<input type="text" class="form-control" value="<?php echo $ipaddress; ?>" name="ip" disabled>
</div>
<button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-plus"></span> Add IP</button>
</form>
</div>
</div>
</div>
</div>
<!-- End Page Header -->
<!-- Start Data Table -->
<div class="row" style="margin-top: 35px;">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<table id="datatable" class="table table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th class="text-center nosort">Flag</th>
<th class="nosort">Country</th>
<th>City</th>
<th class="nosort">Region</th>
<th>IP Address</th>
<th class="select-filter nosort">Continent</th>
<th class="nosort">Latitude</th>
<th class="nosort">Longitude</th>
<th class="nosort">Organisation</th>
<th>Created</th>
</tr>
</thead>
<?php
// Design initial table header
$data = '<tbody>';
$sql = "SELECT * FROM thaitradecenter";
if (!$result = mysqli_query($conn,$sql)) {
exit(mysql_error());
}
// if query results contains rows then featch those rows
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$data .=
'<tr>
<td align="center"><img src='.$row['flag'].' height="15" width="25"></td>
<td>'.$row['country_name'].'</td>
<td>'.$row['city'].'</td>
<td>'.$row['region'].'</td>
<td>'.$row['ip'].'</td>
<td align="center">'.$row['continent_name'].'</td>
<td>'.$row['latitude'].'</td>
<td>'.$row['longitude'].'</td>
<td>'.$row['organisation'].'</td>
<td>'.$row['created'].'</td>
</tr>';
}
}
else
{
// records now found
$data .= '<tr><td colspan="6">ขณะนี้ยังไม่มีข้อมูล!</td></tr>';
}
echo $data;
?>
</tbody>
</table>
<!-- End Container -->
</div>
<!-- Jquery file -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- SweetAlert -->
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/fixedheader/3.1.2/js/dataTables.fixedHeader.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.1.1/js/dataTables.responsive.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.1.1/js/responsive.bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#ipaddress-form').on('submit',function(e) {
$.ajax({
type: 'POST',
url: 'save.php',
data: $(this).serialize(),
success: function(result) {
if(result.status == 1) // Success
{
swal({
title: "Successfully",
text: "คุณได้ทำการเพิ่มไอพีเรียบร้อย",
icon: "success",
buttons: false,
timer: 5000
});
}
else // Error
{
swal("Oops!", "Something went wrong on the page!", "error");
}
}
});
});
});
</script>
<script>
$(document).ready(function() {
$('#datatable').DataTable( {
'aoColumnDefs': [{
'bSortable': false,
'aTargets': ['nosort']
}],
"lengthMenu": [
[25, 50, 100, -1],
[25, 50, 100, "All"]
],
fixedHeader: true,
"aaSorting": [
[9, "desc"],
[4, "asc"],
[2, "asc"]
],
initComplete: function () {
//this.api().columns().every( function () {
this.api().columns('.select-filter').every( function () {
var column = this;
var select = $('<select class="form-control input-sm"><option value="">' + $(this.header()).html() + '</option></select>')
.appendTo( $(column.header()).empty() )
.on( 'change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false )
.draw();
} );
column.data().unique().sort().each( function ( d, j ) {
select.append( '<option value="'+d+'">'+d+'</option>' )
} );
} );
}
} );
} );
</script>
</body>
</html>
ไฟล์ save.php
Code (PHP)
<?php
header('Content-Type: application/json');
// Connect Database
include("db_connection.php");
// Get the client ip address
$ipaddress = $_SERVER['REMOTE_ADDR'];
$ip = "https://api.ipdata.co/".$ipaddress;
// API IP Data
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $ip);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($ch, CURLOPT_HEADER, FALSE);
curl_setopt($ch, CURLOPT_HTTPHEADER, array(
"Accept: application/json"
));
$response = curl_exec($ch);
curl_close($ch);
$data = json_decode($response);
$flag = $data->flag;
$country_code = $data->country_code;
$country_name = $data->country_name;
$city = $data->city;
$region = $data->region;
$ip = $data->ip;
$continent_name = $data->continent_name;
$latitude = $data->latitude;
$longitude = $data->longitude;
$organisation = $data->organisation;
$sql = "INSERT INTO thaitradecenter(flag,country_code,country_name,city,region,ip,continent_name,latitude,longitude,organisation)
VALUES('$flag','$country_code','$country_name','$city','$region','$ip','$continent_name','$latitude','$longitude','$organisation')";
$query = mysqli_query($conn,$sql);
if($query) {
echo json_encode(array('status' => '1'));
}
else
{
echo json_encode(array('status' => '0'));
}
mysqli_close($conn);
?>
Tag : PHP
|
ประวัติการแก้ไข
2018-02-26 18:09:46
2018-02-26 18:10:55
2018-02-26 19:48:35
|
 |
 |
 |
 |
| Date :
2018-02-26 18:05:01 |
By :
pramuan_thaicreate |
View :
3213 |
Reply :
3 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ใช้งานได้แล้วครับ ไม่ Alert แล้วแว๊บหายแล้วครับ
แก้ไขโดยเพิ่ม e.preventDefault(); ครับ
Code (PHP)
Code (JavaScript)
<script type="text/javascript">
$(document).ready(function(){
$('#ipaddress-form').on('submit',function(e) {
$.ajax({
type: 'POST',
url: 'save.php',
data: $(this).serialize(),
success: function(result) {
if(result.status == 1) // Success
{
swal({
title: "Successfully",
text: "คุณได้ทำการเพิ่มไอพีเรียบร้อย",
icon: "success",
buttons: false,
timer: 5000
});
}
else // Error
{
swal("Oops!", "Something went wrong on the page!", "error");
}
}
});
e.preventDefault();
});
});
</script>
|
ประวัติการแก้ไข
2018-02-26 18:28:13
| |
|
|
| |
| Date :
2018-02-26 18:27:30 |
By :
pramuan_thaicreate |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
onsubmit ถ้าใช้กับ ajax ไม่น่าใช้
เพราะวันถุประสงค์เราไม่ได้ใช้ feature ของ submit ทั้งหมด เราแค่ใช้ event click ของปุ่ม submit เท่านั้น
น่าจะเปลี่ยนเป็นปุ่ม type = button แทน type = submit
แล้วใช้ event click แทน
|
| |
|
|
| |
| Date :
2018-02-26 18:39:41 |
By :
Chaidhanan |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
