Question

我遇到了php和ajax的问题。我已经建立了一个个人锻炼常规网站（所以我可以在健身房观看）。我已经构建了添加，编辑和删除例程的能力，但是我正在尝试构建它，以便编辑和删除通过ajax工作，以便它在页面上更新而不需要刷新页面。

我的主要问题是尝试让例程id通过ajax，因为我无法弄清楚如何动态地执行它！我已经在ajax中手动添加了id = 15并且顶级例程数据发生了变化（虽然现在需要刷新页面以便更改数据）但正如我所说，无法弄清楚如何动态拉动例程id已更新。

在此处查看网站http://www.swishwebs.co.uk/workout/view_workout.php

让我知道我需要做什么才能获得常规身份。

由于

Answer 1

你的锚标记中的

有一些自定义属性lik data-id

<a href="##" data-id="{dynamic id through looping results}" class="button>Edit</a>

在jquery中，您可以将其检索为

$(this).data("id");

在您的代码中，您可以将其设为

$(".button").click(function() {
        var id = $(this).data("id"); 
        var dy = $("#day").val();
        var bp = $("#body_part").val();
        var sw = $("#start_weight").val();
        var cw = $("#current_weight").val();
        var ex = $("#exercise").val();
        var st = $("#sets").val();
        var rp = $("#reps").val();

            //other code

}）;

根据您的评论，我创建了一个包含两行的示例表，如下所示：

<table border="0" bordercolor="#000000" cellspacing="0" cellpadding="0">
            <tbody>
                <tr style="border-top: 1px solid #ffffff;">
                    <Td><a href="##" data-id="5" class="button">Edit</a></td>
                    <Td>125</td>  
                </tr>


               <tr style="border-top: 1px solid #ffffff;">
                    <Td><a href="##" data-id="6" class="button">Edit</a></td>
                    <Td>135</td>  
                </tr>
          </tbody>
</table>

和编辑链接点击的jquery代码如下：

   $(".button").click(function(){
      var id = $(this).data("id");
      var startweight = $(this).parent().next().text();
      alert(id + ", " + startweight);
   });

单击锚标记时，'$（this）'指的是单击的元素，在您的情况下，它是锚标记。因此，当我说$（this）.data（“id”）时，它只搜索锚标记，但是当你想从相邻列中获取其他信息时，你需要了解更多的DOM操作。我刚刚举例说明了如何获取相邻列的信息。尝试使用您的代码，如果您有任何问题，请在此处发布

通过ajax更新数据后，您也可以这样做。发布一些你想要更新数据的样本html，然后我们可以修复它。

Answer 2

$(".button").click(function() {
    var id = $(this).data("id");
    var dy = $(this).parent().siblings().find(".day").val();
    var bp = $(this).parent().siblings().find(".body_part").val();
    var sw = $(this).parent().siblings().find(".start_weight").val();
    var cw = $(this).parent().siblings().find(".current_weight").val();
    var ex = $(this).parent().siblings().find(".exercise").val();
    var st = $(this).parent().siblings().find(".sets").val();
    var rp = $(this).parent().siblings().find(".reps").val();

    if(dy == "" || bp == "" || sw == "" || cw == "" || ex == "" || st == "" || rp == ""){
        alert("error");
    } else {
        var id_num = "id"+id;
        var day = "day"+dy;
        var body_part = "body_part"+bp;
        var start_weight = "start_weight"+sw;
        var current_weight = "current_weight"+cw;
        var exercise = "exercise"+ex;
        var sets = "sets"+st;
        var reps = "reps"+rp;

        $.ajax({
            type: "POST",
            url: "new_edit_workout.php",
            data: "id=" + id + "&day=" + dy + "&body_part=" + bp + "&start_weight=" + sw + "&current_weight=" + cw + "&exercise=" + ex + "&sets=" + st + "&reps=" + rp,
            dataType: "text/html",
            success: function(response){
                if(response !== undefined){

                    $(this).closest("tr").remove();

                    $(this).closest("tr").before("<tr class=\"row-refresh"+id+"><td class=\"bg-cell-td\">"+dy+"</td><td class=\"bg-cell-td\">"+bp+"</td><td class=\"bg-cell-td\">"+sw+"kg</td><td class=\"bg-cell-td\">"+cw+"kg</td><td class=\"bg-cell-td\">"+ex+"</td><td class=\"bg-cell-td\">"+st+"</td><td class=\"bg-cell-td\">"+rp+"</td><td class=\"bg-cell-td\"><a data-id="+id+" class=\"click-edit\" style=\"cursor: pointer;\">Edit</a> | <a href=\"delete_workout.php?id="+id+" rel=\"ibox&width=350\">Delete</a></td></tr>");  
                    $(".updated").slideDown(800).delay(2000).slideUp(800);

                } else {
                    alert("It failed!");
                    $(".edit-box").css("background-color", "#000000");
                }
            }
    });
}

}）; }）;

Answer 3

        print "<h1 style=\"margin: 0; text-shadow: 0 0 5px #B9C9FE; font-size: 16px;\">MONDAY</h1>
        <table border=\"0\" bordercolor=\"#000000\" cellspacing=\"0\" cellpadding=\"0\" id=\"refresh\">
            <tr style=\"border-top: 1px solid #ffffff;\">
                <th class=\"bg-cell\">Body Part</td>
                <th class=\"bg-cell\">Start Weight</td>
                <th class=\"bg-cell\">Current Weight</td>
                <th class=\"bg-cell\">Exercise</td>
                <th class=\"bg-cell\">Sets</td>
                <th class=\"bg-cell\">Reps</td>
                <th class=\"bg-cell\">Customise</td>
            </tr>";
    } 
} else {
    print "";   
}

if($r = mysql_query($query_monday)){
    while($row = mysql_fetch_array($r)){
        print "
            <tr class=\"row-refresh{$row['id']}\" id=\"{$row['id']}\">
                <td class=\"bg-cell-td\">{$row['body_part']}</td>
                <td class=\"bg-cell-td\">{$row['start_weight']}kg</td>
                <td class=\"bg-cell-td\">{$row['current_weight']}kg</td>
                <td class=\"bg-cell-td\">{$row['exercise']}</td>
                <td class=\"bg-cell-td\">{$row['sets']}</td>
                <td class=\"bg-cell-td\">{$row['reps']}</td>
                <td class=\"bg-cell-td\"><a data-id=\"{$row['id']}\" class=\"click-edit\" style=\"cursor: pointer;\">Edit</a> | <a href=\"delete_workout.php?id={$row['id']}\" rel=\"ibox&width=350\">Delete</a></td>
            </tr>

似乎无法获得特定形式的id更新

3 个答案: