[Laravel] Ajax 사용하기

[Laravel] Ajax 사용하기 updated_at: 2024-01-30 17:51

Laravel 에서 Ajax를 사용하여 JSON 데이타 처리하기

여기서는 jquery의 Ajax와 연동하는 샘플에 대해서 말씀드리겠습니다.

PUT(수정)

$(function(){
  $(".btn-update").click(function(){
    var params = {
      name: $('input[name=name]').eq(i).val(),
    }
    var url = '/타겟 url';
    var csrf_token = $("meta[name=csrf-token]" ).attr("content"); // csrf-token을 함께 전송해야 함
    var data = {_token:csrf_token, params};

    $.ajax({
      url: url,
      type: 'PUT',
      data: data,
      success: function(resp) {
        // 이후 액션 (아래 JSON 에서 상세설명)
      }
    });
  })
})

DELETE(삭제)

$(function(){
  $(".btn-delete").click(function(){
    if(confirm('삭제하시겠습니까?')) {
      var csrf_token = $("meta[name=csrf-token]" ).attr("content");
      var url = '/타겟 url';
      var data = {_token:csrf_token, data:'mydata'};
      $.ajax({
        url: url,
        type: 'DELETE',
        data: data,
        success: function(resp) {
          // 이후 액션 (아래 JSON 에서 상세설명)
        }
      });
    }
  })
})

위에서는 두가지 예(PUT, DELETE)를 드렸는데 POST, GET도 동일한 방식입니다.

JSON 을 이용한 데이타 받기

json_encode을 이용하여 데이타 전송하기(PHP -> Front)

return json_encode(['error'=>false]);

위와 같이 사용할 경우는 jquery의 resp에서 JSON.parse 를 사용하여 문자를 Object로 변경해 주어야 합니다.;

success: function(resp) {
  var result = JSON.parse(resp);
}

response()->json를 이용하여 데이타 전송하기(PHP -> Front)

return response()->json([
  'error'=>false
]);

response()->json을 사용할 경우 바로 받아서 처리합니다.

success: function(resp) {
  console.log(resp);
}

사용상 response()->json 을 사용하시면 더욱 편리합니다.

평점을 남겨주세요
평점 : 5.0
총 투표수 : 1

질문 및 답글