programing

jQuery.ajax 성공 콜백 함수가 실행되지 않았습니다.

kakaobank 2023. 3. 18. 08:46
반응형

jQuery.ajax 성공 콜백 함수가 실행되지 않았습니다.

JavaScript Ajax 콜(jQuery.ajax)이 있지만 성공 콜백 함수는 실행되지 않습니다.

$.ajax({
        url: target,
        contentType: 'application/json; charset=utf-8',
        type: 'POST',
        // type: 'GET',
        dataType: 'jsonp',
        error: function (xhr, status) {
            alert(status);
        },
        success: function (result) {
            alert("Callback done!");
            // grid.dataBind(result.results);
            // grid.dataBind(result);
        }
    });

fire bug에서는 요청이 게시되고 json에 대한 올바른 결과가 예상대로 반환되는 것을 알 수 있습니다.뭐가 문제죠?

여러 번 비슷한 문제를 겪었는데 대부분 잘못된 형식의 json이 원인입니다.결과를 텍스트 데이터 유형으로 가져와 문제가 있는지 확인하십시오.

또, 데이터 타입이 simple json이 아닌 jsonp이기 때문에, url에 「&json callback=?」라고 하는 파라미터를 사용하고 있지 않은지 묻고 싶습니다.

당신의.$.ajax와 통화하다.dataType: 'jsonp'는 다음 시나리오에서 동작할 수 있습니다.

  1. 페이지의 같은 도메인에 있는 URL을 호출하고 있습니다.
  2. 콜백을 지원하는 페이지의 도메인에서 URL을 호출하고 있습니다.

이러한 2개의 케이스가 없으면 크로스 사이트 XmlHttpRequest 콜을 할 수 없기 때문에 아무것도 할 수 없습니다.

이건 오래된 질문이지만, 사람들이 아직도 이 질문을 하고 있는 것 같아요.

저는 한동안 이 문제와 싸웠고, 결국 포기하고 연기된 모델로 옮겼습니다.(저는 jQuery를 오래 써서 아직 '구식' 습관에 머물러 있습니다.)지연모델로 이행하자마자 동작하기 시작했습니다.왜 예전 방식이 효과가 없었는지는 모르겠지만, 더 이상 신경 쓰지 않습니다. (이 질문은 새 모델보다 더 오래된 것입니다.)

cf. https://stackoverflow.com/a/14754681/199172

비동기 속성을 false로 설정해야 합니다.

$.ajax({
        url: target,
        contentType: 'application/json; charset=utf-8',
        type: 'POST',
        // type: 'GET',
        dataType: 'jsonp',
        async = false,
        error: function (xhr, status) {
            alert(status);
        },
        success: function (result) {
            alert("Callback done!");
            // grid.dataBind(result.results);
            // grid.dataBind(result);
        }
    });

제 동료 중 한 명에게 이런 일이 일어났기 때문에, 저도 제 솔루션을 추가해야겠다고 생각합니다.

Ajax 콜이 발신되어 Fiddler(상태 200/완전 유효한 JSON)에서 적절한 응답이 반환되는 것을 확인할 수 있었습니다만, 에러, 성공, 또는 완전한 콜백은 발생하지 않습니다.async: false를 ajax 호출에 추가하면 동작하지만 실제로는 적절한 솔루션이 아니었습니다.또한 (async: false를 사용하지 않고) Ajax 콜 직후에 경보를 발신하고 경보가 표시될 때까지 몇 초간 기다리면 Ajax 콜백이 강제로 동작합니다.정말 이상한데...

알고 보니, Ajax 호출을 사용하는 함수는 이 이상한 동작의 원인이었던 type="time" 입력에 바인딩되어 있었습니다.입력을 type="button"으로 변경하면 수정되었습니다.

여러 파라미터를 가진 서블릿에 대한 Jquery Ajax 호출이 성공 또는 에러를 호출하지 않았습니다.콜이 정상적으로 종료되었습니다.그것은 제출 버튼에 묶여 있었다.변경 시 성공 이벤트가 반환되었습니다.

혹시나 참고가 필요할 경우를 대비해서 여기 제 참조 코드입니다.

$(document).ready( function () {    
    $("#buttonSave").click(function() {
        alert('incustsave');
        var name = $("#custname").val();
        var gstnumber = $("#gstnumber").val();
        var custbizname = $("#custbizname").val();
        var email = $("#email").val();
        var address = $("#address").val();
        var street = $("#street").val();
        var city = $("#city").val();
        var zip = $("#zip").val();
        var phone = $("#phone").val();
        var country = $("#ctry").val();

        var inputArray = [name, gstnumber, custbizname, email, address, street, city, zip, phone, country];
        var Success = false;
        alert('added_button_and_dt');
        $.ajax({  
            type: "POST",
            url: "RegisterCustomerServlet",               
            data: {'input': inputArray},
            dataType: 'json',

            success: function (data) {
                alert('sucess');
            },
            error: function (e) {
                alert('error');
            }
        });
    });
});

HTML (Bootstrap3 포함) (버튼 참조)

<!-- Button -->
<div class='wrapper text-center'>
    <div class="btn-group">
        <button type="button"  id="buttonSave" class="btn btn-primary">Save</button>
    </div>
</div>

서블릿 참조

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    HashMap<String,String>  map = new HashMap<String,String>();
    CustomerDAO custinfo = new CustomerDAO();
    Gson gson = new Gson();
    CustomerVO vo = new CustomerVO();

    String[] myJsonData = request.getParameterValues("input[]");
    logger.info("in custregisterjsoninput" + myJsonData[0] + myJsonData[2] + myJsonData[3] + myJsonData[4]);

    map.put("custname", myJsonData[0]);
    map.put("getsnumber", myJsonData[1]);
    map.put("custbizname", myJsonData[2]);

    map.put("email", myJsonData[3]);
    map.put("address", myJsonData[4]);
    map.put("street", myJsonData[5]);
    map.put("city", myJsonData[6]);          
    map.put("pincode", myJsonData[7]);
    map.put("mainphone", myJsonData[8]);
    map.put("country", myJsonData[9]);

    try {
        vo = custinfo.saveCustomerInfo(map);
    } catch (Exception e) {
        logger.info("aftercall"+e.getMessage());
        throw new ServletException(e);
    }  
    response.setContentType("application/json");
    response.setCharacterEncoding("UTF-8");
    response.getWriter().write(Utility.convertPOJOtoJason(vo));
}

언급URL : https://stackoverflow.com/questions/2787180/jquery-ajax-success-callback-function-not-executed

반응형