Ajax Success数据返回完整的HTML页面

时间:2014-08-16 14:44:50

标签: javascript jquery ajax json jsp

我正在使用带有日期选择器字段的iFrame类JSP页面。在从选择器中选择日期时,我使用如下所示的jQuery AJAX调用将日期发送到Struts Action:

$( "#datepickerStart" ).datepicker({
  onSelect: function(dateText, instance) {//date select from picker to trigger
  $.ajax({
    type: "Post",// post method
    url: 'checkAvailability.do?operation=getlist&datepickerStart='+ ("#datepickerStart").val(), // passing URL with date value to STRUTS Action
    data: "date="+date,
    //dataType: "application/json",
    success: function(data) {
      alert(data); //getting with the complete HTML page
    }
  }); 
 }
});

从数据库中我可以在LIST中获取结果并转换为JSON对象,如下所示:

Gson gson = new Gson();// Using google GSON to convert to JSON
String json = new Gson().toJson(lRList);
response.setContentType("application/json");// setting content type
response.setCharacterEncoding("UTF-8"); //setting character encoder
response.getWriter().write(json);// writing to response the JSON object
System.out.println("JSON Object::"+json);

在标准输出中给出了这样的结果:

JSON Object::[{"bookDate":"2014-07-11","fromTime":"2:00PM","totime":"3:30PM","userID":"XXX","isSuccess":false},
{"bookDate":"2014-07-11","fromTime":"10:30AM","totime":"11:00AM","userID":"XXX","isSuccess":false}]

但是Ajax成功的警报提供了完整的HTML页面:(。我需要这些数据,并希望通过在div表中显示来填充同一JSP中的值。所以任何人都可以帮我解决这个问题并让它我知道我在哪里做错了......

2 个答案:

答案 0 :(得分:0)

我认为你应该在ajax调用中使用get而不是post

    $( "#datepickerStart" ).datepicker({
      onSelect: function(dateText, instance) {//date select from picker to trigger
      $.ajax({
        type: "get",
        url: 'checkAvailability.do?operation=getlist&datepickerStart='+         ("#datepickerStart").val(), // passing URL with date value to STRUTS Action
        data: "date="+date,
        //dataType: "application/json",  
        success: function(data) {
          alert(data); //getting with the complete HTML page
        }
      }); 
     }
    });

答案 1 :(得分:0)

设置AJAX错误以获取如下错误:

$.ajaxSetup({
    error: function(jqXHR, e) {
        var msg = '';
        if(jqXHR.status==0){
            msg = 'You are offline!!\n Please Check Your Network.';
        }else if(jqXHR.status==404){
            msg = 'Requested URL not found.';
        }else if(jqXHR.status==500){
            msg = 'Internal Server Error.<br/>'+jqXHR.responseText;
        }else if(e=='parsererror'){
            msg = 'Error: Parsing JSON Request failed.';
        }else if(e=='timeout'){
            msg = 'Request Time out.';
        }else {
            msg = 'Unknow Error.<br/>'+x.responseText;
        }

        console.log('error: '+jqXHR.responseText);
        console.log('Error msg: '+msg);     
    }
});

然后在AJAX调用中将数据类型设置为json,作为以Json格式获取响应,如:

$("#datepickerStart").datepicker({
  onSelect: function(dateText, instance) {
  $.ajax({
    type: "post",
    url: 'checkAvailability.do?operation=getlist&datepickerStart='+$("#datepickerStart").val(),
    data: "date="+date,
    dataType: 'json',
    success: function(data) {
      alert(JSON.stringify(data));
    }
  }); 
 }
});

你也忘记了$

("#datepickerStart").val()开头

进一步参考结帐my app