2016-10-04 5 views
1

.ajax 호출을 통해 데이터를 검색하고 응답 HTML 코드를 부트 스트랩 모달 본문에 추가하려고합니다. 그러나 나는이 오류를 수신 유지 :jQuery .ajax 구문 오류, 인식 할 수없는 표현

JQuery와-3.1.0.min.js : 2 catch되지 않은 오류 : 구문 오류, 인식 할 수없는 표현 : http://localhost/menu/create

는 사실은 내가하지만이 때문에, 응답에서 원하는 데이터를 수신 할 오류, 모달 창에 데이터를 표시 할 수 없습니다.

여기 내 코드입니다. 링크를 클릭하면 ajax 호출이 html 형식을 반환하고 모달 본문에 삽입합니다. 그런 다음 모달 창이 표시됩니다.

<a href="{{route('menu.create')}}" class="btn btn-default pull-right show-new-menu-item-modal" data-toggle="modal">New Menu Item</a> 

$('body').on('click', '.show-new-menu-item-modal', function(event) { 
event.preventDefault(); 
$.ajax({ 
     url: $(this).attr('href'), 
     dataType: 'html', 
     success: function(response) { 
      $("#new-menu-item-body").html(response); 
     } 
    }); 
    $('#new-menu-item-modal').modal('show'); 
}); 

나는 인터넷 검색을 몇 시간에 대한 코드하지만 여전히 행운을 변경하고있다. 나는 누군가가 나에게 약간의 아이디어를 줄 수 있다면 그것을 높이 평가할 것이다. 미리 감사드립니다!

+0

ayax 호출이 끝날 때 return false를 추가하려고 시도했습니다. –

답변

0

부트 스트랩 때문인 것으로 생각되며 요소에 data-toggle="modal"을 설정 한 것 같습니다.

삭제 해보세요. 모달을 그대로 초기화하고 있습니다. 당신이 data-toggle는 모달 ID에 대한 jQuery를 선택기로 href을 사용하려고하고 당신이 당신 있는지 오류를 슬로우와 관련하여 필요한 data-target를 사용하지 않았기 때문에

는 내가 무슨 일이 일어나고 생각하는 것은 그랬어

+0

data-toggle = "modal"이 제거되어 작동했습니다! 정말 고맙습니다!!!! – bwang0904

0

@charlietfl 맞아요, 모달에 대한 기본 동작을 막을 수는 없지만 그렇게하지 않으면 부트 스트랩 문서에서 모달을 호출하는 자바 스크립트 방식을 확인하십시오. 원하는 것을 만들기 위해 사용할 수있는이 URL을 확인하십시오 : http://getbootstrap.com/javascript/.

희망 하시겠습니까?

최고!

관련 문제