如何在ajax成功後顯示json？

Question

我在我的控制器中有一個查詢，它以json格式返回數據，現在我試圖用ajax和jquey顯示返回的數據。但每次輸出都是：[objet Object]。我正在尋找犯錯，如果有人能幫助...

這是Ajax代碼

<script> 
    $('#sub').click(function() { 
     var date1=$('#date1').val(); 
     var date2=$('#date2').val(); 
     var token=$('#token').val(); 
     $.ajaxSetup({ 
      headers: { 
       'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') 
      } 
     }) 
     $.ajax 
     ({ 

      url:"{{Url('showJobTime')}}", 
      type:'post', 
      dataType:'json', 
      data:{'date1':date1,'date2':date2,'_token':token,'id':id}, 
      success:function(response) 
      { 

       alert(response);//the output is object Object 
       //alert('success'); 
       $.each(response,function(index,element){ 
        $('#show').text({text:element.time1}); 
       }); 

      },error:function (error) { 

       alert('error'); 
       // console.log(error); 

      } 

     }); 

    }); 

</script> 

，這是控制器

public function searchJobTime() 
{ 

    $inputs=Request::all(); 
    $date1=$inputs['date1']; 
    $date2=$inputs['date2']; 
    $data=DB::table('consultant_timings')->whereNotBetween('date',[$date2,$date1])->get(); 
    return response()->json($data); 

} 

Answer 1

取而代之的警報使用 console.log(response); 在開發中來ols，你可以看到返回的Jon對象的結構。

Answer 2

你的反應是對象的數組，你應該使用console.log(response)代替警報

Answer 3

你的後端返回沒什麼前端。嘗試使用echo而不是返回。使用echo，你會實際編寫json，以便瀏覽器讀取它。如果你不這樣做，你會返回json字符串到任何正在調用searchJobTime（）函數，而不是將它寫入瀏覽器。

public function searchJobTime() 
{ 

    $inputs=Request::all(); 
    $date1=$inputs['date1']; 
    $date2=$inputs['date2']; 
    $data=DB::table('consultant_timings')->whereNotBetween('date',[$date2,$date1])->get(); 
    echo response()->json($data); 

} 

Answer 4

我用的console.log（響應[0]）找到輸出是什麼爲親愛的朋友們說... ...和使用$。每個（）jQuery的方法來考慮的數據顯示如下

，並再次，如果任何人上面的描述正確的我將不勝感激......

Ajax代碼

<script> 
    $('#sub').click(function() { 
     var date1=$('#date1').val(); 
     var date2=$('#date2').val(); 
     var token=$('#token').val(); 

     $.ajaxSetup({ 
      headers: { 
       'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') 
      } 
     }) 
     $.ajax 
     ({ 

      url:"{{Url('showJobTime')}}", 
      type:'post', 
      dataType:'json', 
      data:{'date1':date1,'date2':date2,'_token':token}, 
      success:function(response) 
      { 
       //alert('success'); 
       //console.log(response[0]); 
       $('#change').empty(); 
       $.each(response,function(key,value){ 
         $('#change').append(
          "<tr class='odd gradeX'>"+ 
           "<td><input type='checkbox' class='checkboxes' value='1' /></td>"+ 
           "<td class='hidden-phone' id='firstName'>"+value.date+"</td>"+ 
           "<td class='hidden-phone' id='lastName'>"+value.date+"</td>"+ 
           "<td class='hidden-phone' id='date'>"+value.date+"</td>"+ 
           "<td class='hidden-phone' id='time1'>"+value.time1+"</td>"+ 
           "<td class='hidden-phone' id='time2'>"+value.time2+"</td>"+ 
           "<td class='hidden-phone'><span class='label label-success'>Approved</span></td>"+ 
         "</tr>"); 
        }); 

      },error:function (error) { 

       alert('error'); 
       // console.log(error); 
      } 

     }); 

    }); 

</script> 

和控制器代碼

public function searchJobTime() 
{ 

    $inputs=Request::all(); 
    $date1=$inputs['date1']; 
    $date2=$inputs['date2']; 
    $data=DB::table('consultant_timings')->whereBetween('date',[$date2,$date1])->get(); 
    return response()->json($data); 

} 

Answer 5

嘗試$("#form_id").serialize()代替var date1=$('#date1').val(); var date2=$('#date2').val(); var token=$('#token').val();