samedi 11 juin 2016

It seems that my ajax method is not properly calling my webservice?

I am trying to call a webservice with an ajax request. I am looking for all clinical cases between a date interval (i.e. 2015-01-01, 2016-06-08). When tested separately, the webservice works superbly. Here is the header:

[WebMethod]
public void getCasesForDateInterval(string startDate, string endDate)
{
...
}

Here is the JSON file that I am supposed to retrieve from the two aforementioned dates:

[{"key":"SSB","values":[]},{"key":"GEN","values":[]},{"key":"LYM","values":[]},{"key":"LUD","values":[]},{"key":"GCC","values":[{"dateOpened":"2015-06-01","total":1},{"dateOpened":"2015-06-15","total":2},{"dateOpened":"2015-06-17","total":2},{"dateOpened":"2015-06-22","total":1},{"dateOpened":"2015-06-29","total":1},{"dateOpened":"2015-07-21","total":1},{"dateOpened":"2015-07-22","total":1},{"dateOpened":"2015-08-10","total":1},{"dateOpened":"2015-08-11","total":1},{"dateOpened":"2015-08-19","total":1},{"dateOpened":"2015-08-23","total":1},{"dateOpened":"2016-06-07","total":3}]},{"key":"MAC","values":[{"dateOpened":"2016-06-07","total":1}]},{"key":"MMB","values":[{"dateOpened":"2015-01-02","total":2},{"dateOpened":"2015-01-05","total":1},{"dateOpened":"2015-01-06","total":4},{"dateOpened":"2015-01-07","total":1},{"dateOpened":"2015-01-08","total":2},{"dateOpened":"2015-01-09","total":1},{"dateOpened":"2015-01-12","total":2},{"dateOpened":"2015-01-13","total":6},{"dateOpened":"2015-01-14","total":3},{"dateOpened":"2015-01-15","total":3},{"dateOpened":"2015-01-16","total":2},{"dateOpened":"2015-01-19","total":7},{"dateOpened":"2015-01-20","total":4},{"dateOpened":"2015-01-21","total":1},{"dateOpened":"2015-01-22","total":3},{"dateOpened":"2015-01-23","total":4},{"dateOpened":"2015-01-26","total":3},{"dateOpened":"2015-01-27","total":5},{"dateOpened":"2015-01-28","total":3},{"dateOpened":"2015-01-29","total":3},{"dateOpened":"2015-01-30","total":6},{"dateOpened":"2015-02-03","total":8},{"dateOpened":"2015-02-04","total":10},{"dateOpened":"2015-02-05","total":8},{"dateOpened":"2015-02-06","total":17},{"dateOpened":"2015-02-07","total":1},{"dateOpened":"2015-02-08","total":2},{"dateOpened":"2015-02-09","total":3},{"dateOpened":"2015-02-10","total":2},{"dateOpened":"2015-02-12","total":5},{"dateOpened":"2015-02-13","total":3},{"dateOpened":"2015-02-17","total":6},{"dateOpened":"2015-02-18","total":4},{"dateOpened":"2015-02-19","total":5},{"dateOpened":"2015-02-20","total":2},{"dateOpened":"2015-02-22","total":1},{"dateOpened":"2015-02-24","total":2},{"dateOpened":"2015-02-25","total":2},{"dateOpened":"2015-02-27","total":8},{"dateOpened":"2015-03-03","total":7},{"dateOpened":"2015-03-04","total":4},{"dateOpened":"2015-03-05","total":2},{"dateOpened":"2015-03-06","total":5},{"dateOpened":"2015-03-08","total":1},{"dateOpened":"2015-03-09","total":3},{"dateOpened":"2015-03-10","total":4},{"dateOpened":"2015-03-11","total":6},{"dateOpened":"2015-03-12","total":3},{"dateOpened":"2015-03-13","total":2},{"dateOpened":"2015-03-15","total":1},{"dateOpened":"2015-03-17","total":5},{"dateOpened":"2015-03-18","total":2},{"dateOpened":"2015-03-19","total":1},{"dateOpened":"2015-03-20","total":14},{"dateOpened":"2015-03-22","total":1},{"dateOpened":"2015-03-23","total":1},{"dateOpened":"2015-03-24","total":4},{"dateOpened":"2015-03-25","total":2},{"dateOpened":"2015-03-26","total":8},{"dateOpened":"2015-03-27","total":13},{"dateOpened":"2015-03-28","total":1},{"dateOpened":"2015-03-29","total":1},{"dateOpened":"2015-04-10","total":1},{"dateOpened":"2015-04-24","total":2},{"dateOpened":"2015-07-08","total":1},{"dateOpened":"2016-03-15","total":1},{"dateOpened":"2016-03-25","total":1},{"dateOpened":"2016-06-07","total":3}]}] 

However, when I try to get this JSON file and post it into a div element, it's not working:

 <script type="text/javascript">
        $(document).ready(function () {
            $(document).on("click", "#btGO", function () {
                var startDate = $("#startDate").val();
                var endDate = $("#endDate").val();
                var resultElement = $("#resultDiv");

                $.ajax({
                    url: "dataWebService.asmx/getCasesForDateInterval",
                    method: "get",
                    data: {startDate: startDate, endDate: endDate},
                    dataType: "json",

                    success: function (data) {
                        resultElement.html(data);
                    }
                });
            });
        });
   </script>

When I replace "get" by "post" and use an alert (i.e. alert(data)), I get this:

enter image description here

Does it mean that my ajax request works, but the returned JSON file is empty? I am new to JQuery and ajax. I feel that I am making an obvious mistake. I would greatly appreciate the community's feedback. Thank you!

Aucun commentaire:

Enregistrer un commentaire