2017-08-17 13 views
1

私はwishdelete2.phpにJquery Postを送るアイテムとボタン(Erledigt!)を持つリストを作成するlist.phpを持っています。問題は、JQueryのポストが完璧ではないことです。ボタンを3回または5回押し、Jqueryを処理するよりも一度押す必要があります。しかし、私は1xしか必要とせず、Jqueryの投稿が処理されることを望みます。何を変えなければならないのですか?PHPループ内のJQueryポストが完璧に動作しない

list.php:

<html lang="de"> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<meta charset="utf-8"> 
<title>Wünsche</title> 
<!-- <script src="../jquery.min.js"></script> --> 
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 

<style> 
table{ 
     width:100%; 
     border-collapse:collapse; 
} 
table th{ 
    padding:5px; 
    border:#5f5f5f 1px solid; 

} 
table td{ 
    padding:5px; 
    border:#5f5f5f 1px solid; 
} 
table tr{ 
    background: #bbbbbb; 
} 
table tr:nth-child(4n){ 
    background: #e3e3e3; 
} 
</style> 

</head> 
<div id="resulter"></div> 
<body> 
<h3>Wünsche</h3> 
<table> 
<tr><th>Zeit</th><th>IMDB-ID</th><th></th><th></th><th>Counter</th><th>Titel</th><th>Art</th></tr> 
<?php 
$pdo = new PDO('mysql:host=********;dbname=********;charset=utf8', '********', '********'); 
$sql = "SELECT * FROM ******** WHERE not marker = 'oU' ORDER BY cast(counter as int) DESC, timestamp "; 
foreach($pdo->query($sql) as $row) { 
$id = $row['id']; 
$timestamp = $row['timestamp']; 
$counter = $row['counter']; 
$art = $row['art']; 
$imdbid = $row['imdb_id']; 

$title = $row['title']; 
$language = $row['language']; 
$aufloesung = $row['aufloesung']; 
$marker = $row['marker']; 
?> 
<tr><td><?php echo $timestamp ?></td><td><?php echo $imdbid ?></td><td><?php echo $language ?></td> 
<td><?php echo $aufloesung ?></td><td class="counter"><?php echo $counter ?></td><td class="title" style=""><?php echo $title ?></td><td><?php echo $art ?></td><td><?php echo $marker ?></td> 
<td style="padding:0;"><button class="<?php echo $id ?>">Erledigt!</button> 
<select class="marker<?php echo $id ?>"><option></option><option>oD</option><option>oDwE</option><option>wE</option><option>oE</option><option>oU</option></select></td></tr> 
<script> 
$(document).ready(function(){ 
    $(".<?php echo $id ?>").click(function(){ 
     var id = "<?php echo $id ?>", 
     marker = $(".marker<?php echo $id ?>").val(); 
     $.post("wishdelete2.php", 
      { id: id, 
      marker: marker 
      }); 
     location.reload(); 
    }); 
}); 
</script> 
<?php } ?> 
</table> 

</body> 
</html> 

とwishdelete2.php:

<?php 
$con=mysqli_connect("********","********","********","********"); 
$id = mysqli_real_escape_string($con, $_POST['id']); 
$marker = mysqli_real_escape_string($con, $_POST['marker']); 
mysqli_close($con); 

$pdo = new PDO('mysql:host=********;dbname=********;charset=utf8', '********', '********'); 
if(empty($marker)){ 
$stmt = $pdo->query("DELETE FROM ******** WHERE id='$id' "); 
}else{ 
$stmt = $pdo->query("UPDATE ******** SET marker='$marker', IP='' WHERE id='$id' "); 
} 
?> 
+1

投稿リクエストは少し時間がかかります。リクエストを処理している間にボタンを押すだけではないのですか? – jackarms

+0

ブラウザのデバッグツールを確認してください。ボタンを初めて押すと、クリックハンドラが実行されますか? AJAXリクエストは作成されていますか?これがどのように失敗しているかについて具体的に説明してください。 – David

答えて

0

jQuery.postが非同期関数であり、すなわち、要求は、この関数の戻り回送信されていません。問題は、postを呼び出した直後にlocation.reload()に電話をかけることです。そのため、ほとんどの場合、ブラウザがページを再読み込みする前にリクエストが送信されません。投稿リクエストが送信された後にページをリロードする場合は、ハンドラーをpostに渡します。 successイベントに送信します。このハンドラがsuccessハンドラであるため、POSTリクエストが成功した場合にのみ、呼び出されること

$.post(
    "wishdelete2.php", 
    {id: id, marker: marker}, 
    function() { location.reload(); } 
); 

注:

としてはthe documentation of jQuery.postに説明し、あなたは単純にそうように、あなたのデータの後に関数を渡すことができます。リンクされたドキュメントを見て、エラーハンドラを提供して、必要に応じてユーザーにエラーを通知することができます。

また、ページが投稿要求を待っているという表示を追加することを検討する必要があります。あなたはローディングスピナーのgoogleを使用して、背景に何かを読み込んでいるスクリプトがあることを示す一般的に使用されるアニメーショングラフィックを見つけることができます。もちろん、このようなスピナーを表示することは、これを示すための唯一の方法です。クリエイティブに。

関連する問題