如何通過ajax加載數據視圖

Question

當我單擊 div 時，我想在當前頁面下方加載另一個頁面內容。

當您單擊 .work-item div 時，它將獲取 id 並將數據從 work/getListData 函數中獲取到該相關 id，以便該函數將返回帶有相關數據的 json 編碼數據對象。 現在我想將它們傳遞到 detail-view,php 並將其顯示在 .work-item div 下面

請指教

//js

$(".work-item").live('click', function () {
  var id= this.id;
  $.ajax({
    type: 'GET',
    url: '/work/getistData/',
    data: {id : id},
    success: function (data) {
      var json_obj = $.parseJSON(data);
      console.log(data);
    }
  });
});

//controller 
public function listpage ($data) { 
  //this will give a page
}

public function getistData () { 
  $id = $this->request->getQuery('id');
  $data = $this->helper->fetchList($id )
  // echo json_encode($data);
  return $this->listpage($data);
}

Answer 1

如果我正確理解了您的問題，那么您應該在 AJAX 成功函數中執行這段代碼：

let div = document.createElement("div");
div.innerHTML = data;
document.getElementsByTagName("body")[0].appendChild(div);

Answer 2

這是我在 SO 中的第一個答案。

通常我首先做的是將問題分解成小塊。 測試，如果成功則繼續前進。

第1步：

console.log(id)

• 在您的 JavaScript 單擊回調中，確保您獲得正確的 id。

在 jQuery 中：

var id = $(this).attr("id"); //if your required id in HTML id element.

var id = $(this).data("id"); //if your required id in HTML data-id element.

第 2 步：我不確定您的 PHP 函數名稱是getistData()還是getListData( )。

第 3 步：在 PHP getistData()函數中使用var_dump($id) ，只需確保收到正確的 id。

我個人認為如果您使用GET ，您還可以發送這樣的參數：

在 JavaScript 中：

url: '/work/getistData/' + id,

然后在 php => getistData($id)

第 4 步：我不確定你為什么使用$$

$$this->helper->fetchList($id)

第 5 步：我確定正確的函數是JSON.parse()

你應該寫：

var json_obj = JSON.parse(data);

好吧。 祝你好運。