来自post请求的jQuery $ .ajax响应无法捕获成功/错误函数

时间:2017-09-30 20:24:24

标签: javascript jquery json ajax web-technologies

我在jQuery实现中遇到问题而无法在jQuery的success: functionerror: function中获得响应,而是我可以在浏览器中看到它(在Chrome中)或在IE中看到它请求保存json文件(在servlet中使用响应值)。

以下是我的配置

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="css/basic.css" type="text/css"></link>
<link rel="stylesheet" href="css/jquery-ui.css" type="text/css"></link>
<!-- <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> -->
<script src="script/jquery-1.12.4.js" type="text/javascript"></script>
<script src="script/jquery-ui.js" type="text/javascript"></script> 

<!-- <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
 -->
<script type="text/javascript">
$(document).ready(function() {
var frm = $('#ABCform');
frm.submit(function (e) {
    e.preventDefault();
    $.ajax({
        type: frm.attr('method'),
        //url: frm.attr('action'),
        url: 'controller',
        dataType: "application/json",
        data: frm.serialize(),
        success: function (responseJson) {
            alert(' test ');
            var $select = $('#country');
            $.each(responseJson, function(key, value) { 
                $('<option>').val(key).text(value).appendTo($select);
            });

            /* var obj = jQuery.parseJSON( data );

            alert(obj.value1);
            //Perform the operation to display the successmessage here
            alert('===1==SUCCESS======');

            alert('===testing Ajax===');

             var json = data.value;

             for (var i=0;i<json.length;++i)
             {
                 alert(json[i]);
             } */


        },
        error: function (responseJson) {
            alert('=====ERROR======');
        },
    });
});

    $(function() {
        $("#datepickerCB").datepicker({
            dateFormat : 'yy-mm-dd'
        });
        $("#datepickerRefund").datepicker({
            dateFormat : 'yy-mm-dd'
        });
        $("#datepickerGenerateRefund").datepicker({
            dateFormat : 'yy-mm-dd'
        });
    });

}); //document ready

</script>
</head>
<body>
    <div class="container">     
        <article>           
            <div id="uploadCBDiv" style="display: none;">               
                <form name="ABCform"  action="controller"  method="post">                   
                    <!-- Test START -->
                    <select id="country"></select>
                    <!-- Test END -->
                    <br>
                    <br> &nbsp; &nbsp; &nbsp; <input id="submitButton" type="submit" value="Upload"/>
                </form>
            </div>          
        </article>
</body>
</html>

Servlet方法:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        System.out.println("\n\n--------------POST--------------");
        doGet(request, response);
    }

protected void doGet(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        String country = request.getParameter("countryname");
        Map<String, String> ind = new LinkedHashMap<String, String>();
        ind.put("1", "New delhi");
        ind.put("2", "Tamil Nadu");
        ind.put("3", "Kerala");
        ind.put("4", "Andhra Pradesh");


        String json = null;
        json = new Gson().toJson(ind);

        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        response.getWriter().write(json);

    } 

我可以看到的一个观察是,我可以看到浏览器URL已更改。

enter image description here

0 个答案:

没有答案