2017-12-01 7 views
0

내가 모달 불이 요소를 사용 : 아이콘을 첫 번째 클릭에 모달 쇼를요소 ID를 얻고 그것을 기반으로 GET 요청을 수행

$('#modal-default').on('shown.bs.modal', function (e) { 
    e.preventDefault(); 
    $('i').on('click', function(){ 
    id = $(this).attr('id'); 
    }); 
    $.ajax({ 
    method: "GET", 
    url: baseURL + 'users/test/view/' + id, 
    dataType: "json", 
    success: function(data){ 
     $('#first').val(data.first_name); 
     $('#last').val(data.last_name); 
     $('#email').val(data.email); 
     $('#phone').val(data.phone_number); 
    } 
    }); 
}); 

:

<i data-toggle="modal" id="'.$user->user_id.'" data-target="#modal-default" data-toggle="tooltip" title="Edit" class="fa fa-pencil-square-o"></i> 

자바 스크립트를 데이터를 포함하고 있지 않습니다. 또한 URL 요청은 수행되지 않습니다 (네트워크에는 표시되지 않음). 콘솔은 id가 정의되지 않았다는 것을 알려줍니다 (url을 포함하는 줄에서). 페이지를 다시로드하지 않고 다시 클릭하면 작동합니다.

첫 번째 클릭으로이 작업을 수행 할 수있는 방법이 있습니까? 어떻게해야합니까?

답변

1

다음 코드를 평가하는 경우 :

$('i').on('click', function(){ 
    id = $(this).attr('id'); 
}); 

id 변수가 선언되고 있지만,이 사용자가 i 요소를 클릭합니다 후에 만 ​​채워집니다.

변수를 선언 한 직후에 $.ajax 요청이 실행되고 해당 변수를 채우지 않은 것입니다.

$.ajax 호출을 click 콜백으로 이동하는 것이 좋습니다.