0

スタックオーバーフローのようなタグ付けシステムを作成しようとしています。したがって、すべてのタグの横には小さなxが付いているため、ユーザーがタグを削除すると、データベースから動的に削除されてしまいます。タグを入力したユーザーのみがタグを削除できます。xにアンカータグを使用し、Ajaxを使用してリクエストをphpスクリプトに送信します。これにより、次のように要素が削除されます。

<?php
    require_once("database_connection_handler.php");
    $x=$post->ID; 
    $i=0;
    $select_query = "Select * from wp_tags inner join wp_posts_tags on wp_posts_tags.tag_id=wp_tags.id where wp_posts_tags.post_id='". $x . "'";
    $result = mysql_query($select_query);
    $num=mysql_num_rows($result);
    echo "</ul>";
    echoTagHTML();
    while ($i < $num) {
        $tag=mysql_result($result,$i,"tag");
        $id=mysql_result($result,$i,"id");
        echo "<li>";
        tagLinks($tag,$id);
            if(is_current_user())
            {
            echo "<a href='javascript:void(0)' onclick='deleteTag($id);'>&nbsp x</a>";
            }   
            echo "</li>";
            $i++;
}echo "</ul></div>";

?>

これを処理するAjaxコードは次のとおりです。

function deleteTag(str){
    if (str.length != 0){
            if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();}
            else{// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
                xmlhttp.open("GET","links/livesearch.php?del="+str,true);
                xmlhttp.send();
                            }
    else{return;}
}

phpスクリプトは次のとおりです。

<?php 
$del=$_GET["del"];
ConnectToDB();
$delete_query="delete from wp_tags where id='".$del."'";
    if(!mysql_query($delete_query))
    {
        echo "error while deleting";
    }
mysql_close($con);
?>

私はAjaxを初めて使用します。ユーザーを削除するはずのリンクをクリックしても、何も削除されません。データベースからタグを削除したり、ページからリンクを削除したりすることはありません。私は何が欠けていますか?どんな助けでもいただければ幸いです。ありがとう。

4

1 に答える 1

1

質問に「jQuery」というタグを付け、HTMLを次のように想定していることに注意してください。

<div id="tagsContainer">
    <div class="tagWrapper">
        <a href="..." class="tag">php</a>
        <button class="tagDelete">X</button>
    </div>
    <div class="tagWrapper">
        <a href="..." class="tag">javascript</a>
        <button class="tagDelete">X</button>
    </div>
</div>

あなたのJavaScriptは次のようになります:

$(function() {
    $("#tagsContainer").on('click', ".tagDelete", function() {
        var $deleteButton = $(this).attr('disabled', true),
            $wrapper = $deleteButton.closest(".tagWrapper"),
            $tag = $wrapper.find('.tag');
        $.ajax({
            url: "links/livesearch.php"
            data: {
                action: 'tagdelete',
                tag: $tag.text(),
                //other params here, eg. to identify the user and the context of the deletion
            },
            success: function(data, textStatus, jqXHR) {
                $wrapper.remove();
            },
            error: function(jqXHR, textStatus, errorThrown) {
                $deleteButton.attr('disabled', false),
                //display error message?
            }
        });
    });
});

基本的に、これにより、ajax呼び出しを行い、サーバーから正常な応答を受信すると、DOMからタグ(およびそのボタン)を削除することにより、.deleteTag内のすべてのボタンに応答するハンドラーが配置されます。#tagsContainer.deleteTag

ここには多くの当て推量があるので、まだやるべきことがいくつかあります(そしてサーバーサイドスクリプトをデバッグします)。

于 2012-06-13T22:46:44.340 に答える