0
私は、ユーザーがデータを追加、編集、削除できるページを作成しようとしています。私は非常に基本的な知識を持っており、ユーザーに彼らが先に行きたいと思っているかどうかを確認する確認メッセージを作成するための助けが必要です（そして、データを格納するテーブルのフォーマット方法についてのヒントは非常に役に立ちます）。削除する前に確認メッセージを追加するにはどうすればよいですか？
//index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CRUD Ajax PHP</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body onload="viewData()">
<p><br/></p>
<div class="container">
<p></p>
<button class="btn btn-primary" data-toggle="modal" data-target="#addData">Insert Data</button>
<!-- Modal -->
<div class="modal fade" id="addData" tabindex="-1" role="dialog" aria-labelledby="addLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="addLabel">Insert Data</h4>
</div>
<form>
<div class="modal-body">
<div class="form-group">
<label for="nm">Full Name</label>
<input type="text" class="form-control" id="nm" placeholder="Nama Lengkap">
</div>
<div class="form-group">
<label for="em">Email</label>
<input type="email" class="form-control" id="em" placeholder="Surel">
</div>
<div class="form-group">
<label for="hp">Phone</label>
<input type="number" class="form-control" id="hp" placeholder="Nomor Telp/HP">
</div>
<div class="form-group">
<label for="al">Address</label>
<textarea class="form-control" id="al" placeholder="Alamat"></textarea>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" onclick="saveData()" class="btn btn-primary">Save</button>
</div>
</form>
</div>
</div>
</div>
</div id="result">
</div>
<p></p>
<table class="table table-bordered table-striped">
<thead>
<tr>
<th width="40">ID</th>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Address</th>
<th width="150">Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<script>
function saveData() {
var name = $('#nm').val();
var email = $('#em').val();
var phone = $('#hp').val();
var address = $('#al').val();
$.ajax({
type: "POST",
url: "server.php?p=add",
data: "nm=" + name + "&em=" + email + "&hp=" + phone + "&al=" + address,
success: function(data) {
viewData();
}
});
}
function viewData() {
$.ajax({
type: "GET",
url: "server.php",
success: function(data) {
$('tbody').html(data);
}
});
}
function updateData(str) {
var id = str;
var name = $('#nm-' + str).val();
var email = $('#em-' + str).val();
var phone = $('#hp-' + str).val();
var address = $('#al-' + str).val();
$.ajax({
type: "POST",
url: "server.php?p=edit",
data: "nm=" + name + "&em=" + email + "&hp=" + phone + "&al=" + address + "&id=" + id,
success: function(data) {
viewData();
}
});
}
function deleteData(str) {
var id = str;
$.ajax({
type: "GET",
url: "server.php?p=del",
data: "id=" + id,
success: function(data) {
viewData();
}
});
}
</script>
</body>
</html>
// server.phpという
confirm()と呼ばれるJavaScriptでかなりクールな機能があります
<?php $db=new PDO('mysql:host=localhost;dbname=test', 'root', 'root'); $page=isset($_GET[ 'p'])? $_GET[ 'p']: '';
if($page=='add'){
$name=$ _POST[ 'nm'];
$email=$ _POST[ 'em'];
$phone=$ _POST[ 'hp'];
$address=$ _POST[ 'al'];
$stmt=$db->prepare("insert into crud values('',?,?,?,?)");
$stmt->bindParam(1,$name);
$stmt->bindParam(2,$email);
$stmt->bindParam(3,$phone); $stmt->bindParam(4,$address);
if($stmt->execute()){
echo "Success add data";
}
else{
echo "Fail add data";
}
}
else if ($page=='edit')
{
$id= $_POST['id'];
$name= $_POST['nm'];
$email= $_POST['em'];
$phone= $_POST['hp'];
$address= $_POST['al'];
$stmt=$db->prepare("update crud set name=?, email=?, phone=?, address=? where id=?");
$stmt->bindParam(1,$name);
$stmt->bindParam(2,$email);
$stmt->bindParam(3,$phone);
$stmt->bindParam(4,$address);
$stmt->bindParam(5,$id);
if($stmt->execute()){
echo "Success update data";
}
else{
echo "Fail update data";
}
}
else if ($page=='del')
{
$id = $_GET['id'];
$stmt = $db->prepare("delete from crud where id=?");
$stmt->bindParam(1,$id);
if($stmt->execute()){
echo "Success delete data";
}
else{
echo "Fail delete data";
}
}
else{
$stmt = $db->prepare("select * from crud order by id desc"); $stmt->execute(); while($row = $stmt->fetch()){ ?>
<tr>
<td>
<?php echo $row['id'] ?>
</td>
<td>
<?php echo $row['name'] ?>
</td>
<td>
<?php echo $row['email'] ?>
</td>
<td>
<?php echo $row['phone'] ?>
</td>
<td>
<?php echo $row['address'] ?>
</td>
<td>
<button class="btn btn-warning" data-toggle="modal"
data-target="#edit-<?php echo $row['id']?>">Edit</button>
<!-- Modal -->
<div class="modal fade" id="edit-<?php echo $row['id'] ?>" tabindex="-1" role="dialog" aria-labelledby="editLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="editLabel-<?php echo $row['id'] ?>">Edit Data</h4>
</div>
<form>
<div class="modal-body">
<input type="hidden" class="form-control" id="<?php echo $row['id'] ?>" value="<?php echo $row['name'] ?>">
<div class="form-group"><label for="nm">Full Name</label>
<input type="text" class="form-control" id="nm-<?php echo $row['id'] ?>" value="<?php echo $row['name'] ?>">
</div>
<div class="form-group"><label for="em">Email</label>
<input type="email" class="form-control" id="em-<?php echo $row['id'] ?>" value="<?php echo $row['email'] ?>">
</div>
<div class="form-group">
<label for="hp">Phone</label>
<input type="number" class="form-control" id="hp-<?php echo $row['id'] ?>" value="<?php echo $row['phone'] ?>">
</div>
<div class="form-group">
<label for="al">Address</label>
<textarea class="form-control" id="al-<?php echo $row['id'] ?>" placeholder="Alamat"><?php echo $row[ 'address'] ?>
</textarea>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default"
data-dismiss="modal">Close</button>
<button type="submit" onclick="updateData(<?php echo $row['id'] ?>)" class="btn btn-primary">Update</button>
</div>
</form>
</div>
</div>
</div>
<button onclick="deleteData(<?php echo $row['id'] ?>)"
class="btn btn-danger">Delete</button>
</td>
</tr>
<?php
}
}
?>
おかげで応答ニコラス、ファイルWOUのために私はこれを実装する必要がありますか？ – Adam
@Adamそれは純粋なjavascriptの何もない – Nicolas
オハイオ州クールな、あなたは私に "do stuff"部分を実行する方法のいくつかの指針を与えることができますか？ – Adam