写真を表示するフォームがあります。画像の横に表示される「削除」ボタンを使用して、表示されている画像を削除したいです。ボタンをクリックすると、画像がデータベースから削除されます。その後、画像はフォームから削除されます。
それを達成するために、データベースから画像を削除するAJAX呼び出しを開始する削除ボタンでonclick関数を使用することを考えています。次に、フォームから画像を削除します(jquery .remove()を介して) .
何をしなければならないかはわかっていますが、コードが機能していないようです。
エラー: 削除ボタンをクリックしても何も起こりません。
誰かが私が間違っているところを指摘できれば本当に助かります。
ありがとう!
私のコード:
メインページ:
<?php
if(!isset($_SESSION))
{
session_start();
}
if($_SESSION['auth']!=="yes")
{
echo"You are not authorised to view this page. Please login <a href='login.php'>here</a>";
exit();
}
?>
<!DOCTYPE HTML>
<html>
<head>
<!--Links to Css Page-->
<link type="text/css" rel="stylesheet" href="style.css">
<!--Loads JQuery script-->
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<!--edits list of item categories on page load-->
<script type="text/javascript">
$(document).ready(function(){
$("#edititemtable").hide();
$("#edititemsubcat").hide();
$("#edititemdetails").hide();
$("#edititemcat").load("getcategory.php");
$("#edititemcat").change(function(){
var cat=$("#edititemcat").val();
$("#edititemsubcat").show();
$("#edititemsubcat").load('getsubcategory.php?cat='+cat);
});
$("#edititemsubcat").change(function(){
var cat=$("#edititemcat").val();
var subcat=$("#edititemsubcat").val();
$("#edititemdetails").show();
$("#edititemdetails").load('getitem.php?cat='+cat+'&subcat='+subcat);
});
$("#edititemsubmit").click(function(){
var cat=$("#edititemcat").val();
var subcat=$("#edititemsubcat").val();
var item=$("#edititemdetails").val();
$("#edititemtable").show();
$("#edititemtable").append($("#details").load('changeitem.php?cat='+cat+'&subcat='+subcat+'&item='+item));
});
//Loads the Categories
$('#changeitemcat').load("getcategory.php");
//Loads the SubCategories
$("#changeitemcat").change(function(){
var cat=$("#changeitemcat").val();
$("#changeitemsubcat").load('getsubcategory.php?cat='+cat);
});
//Deletes the existing pic via AJAX
$("#changeitempicdel0").click(function(){
alert("SUCCESS");
});
});
</script>
</head>
<body style=" width:500px">
<form id="edititem" name="edititem" method="POST" action="getitem.php" >
<table>
<tr>
<td>
<select id="edititemcat" name="edititemcat"></select>
</td>
<td>
<select id="edititemsubcat" name="edititemsubcat"></select>
</td>
<td>
<select id="edititemdetails" name="edititemdetails"></select>
</td>
<td>
<input type="button" id="edititemsubmit" name="edititemsubmit" value="Get Item" />
</td>
</form>
<table id="edititemtable" border='1'>
<tr>
<td colspan='2'>Item Info</td>
</tr>
<tr>
<td>Select Category: </td>
<td>
<select id='changeitemcat' name='changeitemcat'></select>
</td>
</tr>
<tr>
<td>Select SubCategory: </td>
<td>
<select id='changeitemsubcat' name='changeitemsubcat'></select>
</td>
</tr>
<tr>
<td colspan="2" id="details" name="details">
</td>
</tr>
</table>
</body>
</html>
フォームページの抜粋(changeitem.php)
//NOTE:$imagecount is used to provide a unique id to each of the images loaded, starting from index 0, increasing per loop.
//E.g changeitempicdel0,changeitempicdel1,changeitempicdel2, etc.
$imagecount=0;
WHILE($showpic=$getpic->fetch(PDO::FETCH_ASSOC))
{
echo"<div id='image'.$imagecount>";
$image=$showpic['Path'];
$imageid=$showpic['ImageName'];
echo"<tr>";
echo"<td>";
echo"Image";
echo"</td>";
echo"<td>";
echo"<input type='hidden' id='changeitempicchangeid'$imagecount value=$imageid />";
echo"<input type='button' id='changeitempicchange'$imagecount value='Change Picture' />";
echo"</td>";
echo"</tr>";
echo"<tr>";
echo"<td></td>";
echo"<td>";
//Displays image
echo"<img src=$image id='image'$imagecount width='250' height='250' alt=''>";
//Passes image id, used for deletion
echo"<input type='hidden' id='changeitempicdelid'$imagecount value=$imageid />";
//Delete button
echo"<input type='button' id='changeitempicdel$imagecount' value='Delete' />";
echo"</td>";
echo"</tr>";
echo"</div>";
$imagecount++ ;
}
処理中ページ(deletepic.php)
<?php
if(!isset($_SESSION))
{
session_start();
}
if($_SESSION['auth']!=="yes")
{
echo"You are not authorised to view this page. Please login <a href='login.php'>here</a>";
exit();
}
?>
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<?php
include("cxn.inc");
$picid=$_POST['pid'];
$picdel=$cxn->prepare("DELETE FROM `testdb`.`itempic` WHERE `PicID`=:picid ");
$picdel->bindValue(":picid",$picid);
$picdel->execute();
?>
</body>
</html>