2017-09-15 63 views
1

我正在與laravel一起工作。我有兩個div。其中一個div用於顯示數據庫的某些輸出,其他div用於顯示數據庫的某些輸出。我想顯示數據庫的結果而不重新加載頁面

讓我看看我的代碼。

<div id="pending"> 
     @foreach($pendings as $pending) 
     {{ $pending->title }} 
     <br> 
    @endforeach 

<div id="accepted"> 
     @foreach($accepteds as $accepted) 
     {{ $accepted->title }} 
     <br> 
    @endforeach 

當用戶進入頁面,我想告訴他未決div或待處理的數據。 然後我想保留兩個按鈕。一個是PENDING,另一個是ACCEPTED。當用戶點擊接受按鈕以及接受div或用戶點擊接受按鈕時接受的數據,我想要顯示待定數據div或未決數據。 任何人都請幫助我。

還有一個人認爲我對AJAX或JQuery知之甚少。

+0

1)使用json創建端點2)在使用ajax獲取json之後顯示json? –

+1

查找Javascript AJAX – Pytth

+1

如果我理解正確,您希望能夠切換(即在兩個內容之間切換)?如果這是正確的,那麼你可能要考慮Bootstrap標籤:https://getbootstrap.com/docs/3.3/javascript/#tabs如果我錯了,那麼讓我知道... –

回答

2

創建兩個按鈕與IDS button_1 & button_2和綁定DB結果單div.You可以試試下面的代碼

function sendAjaxRequest(element,urlToSend) { 
      var clickedButton = element; 
       $.ajax({type: "POST", 
        url: urlToSend, 
        data: { id: clickedButton.val(), access_token: $("#access_token").val() }, 
        success:function(result){ 
        /*can add logic for html or json data*/ 
        $("#divid").append(result); 
        }, 
       error:function(result) 
        { 
        alert('error'); 
       } 
      }); 
    } 

     $(document).ready(function(){ 
      $("#button_1").click(function(e){ 
       e.preventDefault(); 
       sendAjaxRequest($(this),'/pages/test/'); 
      }); 

      $("#button_2").click(function(e){ 
       e.preventDefault(); 
       sendAjaxRequest($(this),'/pages/test/'); 
      }); 
     }); 
+0

我從控制檯'POST http:// localhost:8000/pages/test/404(Not Found)jquery.min.js:4' – Fokrule

+0

得到此錯誤您必須更改'/ pages/test'給你正在發送請求的路由。 –

+0

我已通過我的路線檢查過。但我得到這個錯誤。 '無法加載資源:服務器響應狀態爲500(內部服務器錯誤)' – Fokrule

0

我與引導標籤和丸做到了這一點。

+0

它可能不會動態。 – lazydeveloper

+0

是的你是對的。但是我對JS框架知之甚少。你能否請建議我應該學習哪個JS框架,以及我應該學習哪個框架來準確解決我的問題。 – Fokrule

+1

你應該練習js和jquery – lazydeveloper

相關問題