如何使用ajax将检索到的数据分配给不同的td


how to assign the retrieved data to the different td using ajax

当用户按下按钮时,数据将保存到数据库中。成功后,我想从数据库中检索数据,并将其放置在正确的td中(在单击的td的同一行)。我成功检索数据,但不将检索到的数据分配给不同的td

ajax

$(document).ready(function(){
        $('.edit2').on('click', function(){

         arr = $(this).attr('class').split( " " );
        var clientid=document.getElementById("client").value;
        $.ajax({    type: "POST",
        url:"clientnetworkpricelist/updateprice.php", 
        data: "value="+$('.ajax input').val()+"&rowid="+arr[2]+"&field="+arr[1]+"&clientid="+clientid,
        success: function(data){
                            $('#CPH_GridView1_clientprice'+arr[2]).empty();
                            $('#CPH_GridView1_clientprice'+arr[2]).append(data);                                                             
                            $('.ajax').html($(this).val());
                            $('.ajax').removeClass('ajax');
                                }});
                                  }  
                             );
                        });

HTML

<td  id="CPH_GridView1_clientprice'.$rows['net_id'].'" class="edit clientprice '.$rows["net_id"].'">'.$rows["clientprice"].'</td>
 <td  id="CPH_GridView1_Status'.$rows['net_id'].'" class="edit2 status '.$rows["net_id"].' "><img  src="image/'.$rows["status"].'f.png" /></td>

在我的updateprice.php中,我连接到数据库并从数据库中检索值,只需打印检索值,如

print $newclientprice;
   print $status;

我的结果

两个值现在都显示在同一个td中,但我希望它在单独的td 0/01中显示在clientprice中,并在状态中增加

Client Price      status
 0.01increase    |
                 |
                 |

有人帮我,谢谢。

updateprice.php

让我们改一下:

<?php
print $newclientprice;
print $status;

我不知道你想做什么。因为你在使用jQuery,所以让我们利用JSON来为我们的利益服务重要信息:以下代码取决于在执行前没有发送输出它将立即完成php执行

<?php
// set type so client can understand what was sent
header('Content-Type: application/json');
// transform our 2 values into a JSON array,
// this will be transparently transformed into an array for your ajax handler
echo json_encode(array($newclientprice, $status));
// end the script, this is what the client ajax request wanted
exit;

javascript.js

我自由地重写了你的代码,这样它看起来会更清晰,至少也有一些评论

$(document).ready(function(){
  var onClick, ajaxSuccessHandleMaker;
  onClick = function() {
    var
      url = 'clientnetworkpricelist/updateprice.php',
      clientid = $('#client')[0].value,
      classesArray = $(this).attr('class').split(" "),
      // send data as object, jQuery will transparently transform for the server
      data = {
        value : $('.ajax input').val,
        rowid : classesArray[2],
        field : classesArray[1],
        clientid : clientid
      };
    // send POST request and expect JSON
    $.post(url,data,ajaxSuccessHandleMaker(classesArray),'json');
  };
  // success returns the ajax handler with a closure on classesArray
  ajaxSuccessHandleMaker = function (arr) {
    // the handler EXPECTS an array, which is why we have to protect output in updateprice.php
    return function (arrayOf2vals) {
      $('#CPH_GridView1_clientprice'+arr[2]).html(arrayOf2vals[0]);
      $('#CPH_GridView1_Status'+arr[2]).html(arrayOf2vals[1]);
      // I am not sure what you want with the following 2 lines of code
      $('.ajax').html($(this).val());// what is this?
      $('.ajax').removeClass('ajax');// what is this?
    };
  };
  // set the onClick handler
  $('.edit2').click(onClick);
});

最后

  • 欢迎提出任何问题
  • 请测试它是否有效,如果无效,请回复,我会尽力帮助你