locked
Passing Multiple Date Parameters to Web Api2 RRS feed

  • Question

  • User1122355199 posted

    Hello everyone and thanks for your help in advance.  I am working on an application that utilizes web api2 to perform a database search to return JSON data to a jQuery datatable.  Where I am running into problems is that I need to pass two dates (actually four) but let's keep it simple to get started.  For example, I need to pass the values of two input boxes, txtBeginningDate and txtEndingDate along with a third value, txtInsuranceName to the controller.  I suppose I could use a POST rather than a GET, but the nature of the api call is really a GET.  I'm really not sure how to go about doing this.  Any help would be appreciated.

    Tuesday, July 21, 2015 9:40 PM

Answers

  • User-782957977 posted

    Try this

    var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2010', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
    $('#tblWellCallList').DataTable(
                    {
                        "processing": true,
                        "sortable": true,
                        "ajax": { 
                                 "url": "../api/Patient/GetWellCheckList/",
                                 "type": "get",
                                 "contentType": 'application/json; charset=utf-8',
                                 "dataType": 'json',
                                 "data": searchData 
                                 },
                        "columns": [
    
                            { "data": "PatientLastName" },
                            { "data": "PatientFirstName" },
                            { "data": "PatientID" },
                            { "data": "PatientPhone" },
                            { "data": "EmployerPhone" },
                            { "data": "Remarks" },
                            { "data": "Remarks2" },
                            { "data": "Ins1Company" },
                            { "data": "Ins1CertNmbr" },
                            { "data": "LastWellVisit" },
                            { "data": "NextWellVisit" }
                        ]
    
                    }
                    );

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, July 23, 2015 10:11 PM

All replies

  • User-782957977 posted

    Please do like this

    1) Create a model class with search input

    public class SearchModel
        {
            public DateTime StartDate { get; set; }
    
            public DateTime EndDate { get; set; }
    
            public string InsuranceName { get; set; }
        }

    2) Add a Get method that accepts parameter of type SearchModel. Convert data from db to a ResposeModel object and return List<ResponseModel>

    public class CustomerController : ApiController
        {
             
            [HttpGet]
            public List<ResponseMode> Get(SearchModel model)
            {
                 
            }
        }

    3) Make Ajax call

     var searchData = { StartDate: '07/01/2015', EndDate: '07/21/2015', InsuranceName: 'Test' };
                    $.ajax({
    
                        type: 'get',
                        url: '/Api/Customer',
                        contentType: 'application/json; charset=utf-8',
                        dataType: 'json',
                        data: JSON.stringify(searchData),
                        success: function (result) {
                             
                        },
                        error: function (ex) {
                            alert('Failed');
                        }
                    });

    Wednesday, July 22, 2015 12:29 AM
  • User1122355199 posted

    Thanks for the response.  I gave your method a try, but am running into errors.  Here is my code:

    Public Class WellCallSearch
    
        Private _Insurance As String = ""
        Private _LowerDOBRange As String = ""
        Private _UpperDOBRange As String = ""
        Private _LastVisitLowerRange As String = ""
        Private _LastWellVisit As String = ""
    
        Public Property Insurance() As String
            Get
                Return _Insurance
            End Get
            Set(value As String)
                _Insurance = value
            End Set
        End Property
    
        Public Property LowerDOBRange() As String
            Get
                Return _LowerDOBRange
            End Get
            Set(value As String)
                _LowerDOBRange = value
            End Set
        End Property
    
        Public Property UpperDOBRange() As String
            Get
                Return _UpperDOBRange
            End Get
            Set(value As String)
                _UpperDOBRange = value
            End Set
        End Property
    
        Public Property LastVisitLowerRange() As String
            Get
                Return _LastVisitLowerRange
            End Get
            Set(value As String)
                _LastVisitLowerRange = value
            End Set
        End Property
    
        Public Property LastWellVisit() As String
            Get
                Return _LastWellVisit
            End Get
            Set(value As String)
                _LastWellVisit = value
            End Set
        End Property
    
    End Class
    

    The controller:

        <HttpGet>
        <Route("api/Patient/GetWellCheckList/")>
        Function GetWellCheckList(ByVal model As WellCallSearch)
    
            Dim Insurance As String = model.Insurance
            Dim LowerDOBRange As String = model.LowerDOBRange
            Dim UpperDOBRange As String = model.UpperDOBRange
            Dim LastVisitLowerRange As String = model.LastVisitLowerRange
            Dim LastWellVisit As String = model.LastWellVisit
    
    ' Do stuff with the data

    And finally the ajax call:

                var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2015', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
                alert(JSON.stringify(searchData));
                $('#tblWellCallList').DataTable(
                    {
                        "processing": true,
                        "sortable": true,
                        "ajax": "../api/Patient/GetWellCheckList/",
                        "contentType": 'application/json; charset=utf-8',
                        "dataType": 'json',
                        "data": JSON.stringify(searchData),
                        "columns": [
    
                            { "data": "PatientLastName" },
                            { "data": "PatientFirstName" },
                            { "data": "PatientID" },
                            { "data": "PatientPhone" },
                            { "data": "EmployerPhone" },
                            { "data": "Remarks" },
                            { "data": "Remarks2" },
                            { "data": "Ins1Company" },
                            { "data": "Ins1CertNmbr" },
                            { "data": "LastWellVisit" },
                            { "data": "NextWellVisit" }
                        ]
    
                    }
                    );

    The datatable fails to load and I receive an "Object reference not set to an instance of an object." at the line:

    Dim Insurance As String = model.Insurance

    in the controller.  Obviously, it is not a routing issue because the controller gets called, but I'm not sure where the problem is.

    Wednesday, July 22, 2015 11:38 AM
  • User1644755831 posted

    Hello kmcnet,

    Seems like your datatable configuration is wrong. Please see below examples.

    https://datatables.net/reference/option/ajax#Examples

    https://datatables.net/reference/option/ajax.data

    Also you are posting the whole model so try to get it using [FromBody] and change your method to httppost.

    Please try this.

        var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2015', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
                alert(JSON.stringify(searchData));
                $('#tblWellCallList').DataTable(
                    {
                        "processing": true,
                        "sortable": true,
                        "ajax": { 
                                 "url": "../api/Patient/GetWellCheckList/",
                                 "type": "POST",
                                 "contentType": 'application/json; charset=utf-8',
                                 "dataType": 'json',
                                 "data": JSON.stringify({'':searchData}),
                                 }
                        "columns": [
    
                            { "data": "PatientLastName" },
                            { "data": "PatientFirstName" },
                            { "data": "PatientID" },
                            { "data": "PatientPhone" },
                            { "data": "EmployerPhone" },
                            { "data": "Remarks" },
                            { "data": "Remarks2" },
                            { "data": "Ins1Company" },
                            { "data": "Ins1CertNmbr" },
                            { "data": "LastWellVisit" },
                            { "data": "NextWellVisit" }
                        ]
    
                    }
                    );

    Now change your method to post method.

        <Route("api/Patient/GetWellCheckList/")>
        Function GetWellCheckList(<FromBody()> ByVal model As WellCallSearch)
    
            Dim Insurance As String = model.Insurance
            Dim LowerDOBRange As String = model.LowerDOBRange
            Dim UpperDOBRange As String = model.UpperDOBRange
            Dim LastVisitLowerRange As String = model.LastVisitLowerRange
            Dim LastWellVisit As String = model.LastWellVisit
    
    ' Do stuff with the data

    if you go though this link http://encosia.com/using-jquery-to-post-frombody-parameters-to-web-api/ you will understand that to use [FromBody] you post values like below.

    $.post('api/values', "=" + value);
    

    OR

    $.post('api/values', { '': value });
    

    Note that DataTables expects the table data to be an array of items in the data parameter of the object (use the ajax.dataSrc option of ajax as an object, if your data is formatted differently. so make sure your data that is returned in the following format.

    {
        "data": [
            // row 1 data source,
            // row 2 data source,
            // etc
        ]
    }
    

    Hope this helps.

    With Regards,

    Krunal Parekh

    Wednesday, July 22, 2015 10:50 PM
  • User1122355199 posted

    Thanks for the response.  So are you saying you cannot pass multiple parameters in a GET?  I tried the following outside of a datatable and am still getting the same error:

                    var searchData = { 'Insurance': 'INTEG', 'LowerDOBRange': '07/21/2015', 'UpperDOBRange': '07/21/2015', 'LastVisitLowerRange': '07/21/2015', 'LastWellVisit': '07/21/2015' };
                    //alert(JSON.stringify(searchData));
                    $.ajax({
    
                        type: 'get',
                        url: '../api/Patient/GetWellCheckList2/',
                        contentType: 'application/json; charset=utf-8',
                        dataType: 'json',
                        data: JSON.stringify(searchData),
                        success: function (result) {
                            alert('success');
    
                        },
                        error: function (ex) {
                            alert('Failed');
                        }
                    });

    So it doesn't seem to have anything to do with the datatable.  This seems to be passing a NULL dataset to the WebApi.

    Thursday, July 23, 2015 8:29 AM
  • User1122355199 posted

    Once again, thanks for the response.  So it appears sending the search data via JSON.Stringify only works with POST.  I tried your code for the datagrid, however, I am receiving the error "Requested Unknown Paramater - PatientLastName for Row 0, so this appears to not be returning any data.  I can't see anything using Fiddler.  However, when I take th code out of the datatable and use:

    var searchData = { 'Insurance': 'INTEG', 'LowerDOBRange': '07/21/2010', 'UpperDOBRange': '07/21/2015', 'LastVisitLowerRange': '07/21/2015', 'LastWellVisit': '07/21/2015' };
                    alert(JSON.stringify(searchData));
                    $.ajax({
    
    
    
                        type: 'POST',
                        url: '../api/Patient/GetWellCheckList2/',
                        contentType: 'application/json; charset=utf-8',
                        dataType: 'json',
                        data: JSON.stringify(searchData),
                        success: function (result) {
                            alert('success');
    
                        },
                        error: function (ex) {
                            alert('Failed');
                        }
                    });

    records get returned.  I aslo tried

    "data"

    : JSON.stringify({ '': searchData }), and

    "data"

    : JSON.stringify(searchData), but still no luck.

    Thursday, July 23, 2015 12:36 PM
  • User-782957977 posted

    Try this

    Controller

    <HttpGet>
            <Route("api/Patient/GetWellCheckList")>
            Function GetWellCheckList(Insurance As String, LowerDOBRange As String, UpperDOBRange As String, LastVisitLowerRange As String, LastWellVisit As String) As String
                Return "Success"
            End Function

    Ajax

     var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2015', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
                $.ajax({
                    type: 'get',
                    url: '/api/Patient/GetWellCheckList',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    data: searchData,
                    success: function (result) {
                        alert(result);
                    },
                    error: function (ex) {
                        alert('Failed');
                    }
                });

    Thursday, July 23, 2015 8:48 PM
  • User1122355199 posted

    Thanks for the response.  When I change the controller to:

        <HttpGet>
        <Route("api/Patient/GetWellCheckList2")>
        Function GetWellCheckList2(ByVal Insurance As String, LowerDOBRange As String, UpperDOBRange As String, LastVisitLowerRange As String, LastWellVisit As String)

    Note:  without the As String signature

    combined with ajax:

                    var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2010', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
    
                    $.ajax({
    
                        //type: 'POST',
                        type: 'GET',
                        url: '../api/Patient/GetWellCheckList2/',
                        contentType: 'application/json; charset=utf-8',
                        dataType: 'json',
    
                        data:  searchData,
                        success: function (result) {
                            alert('success');
    
                        },
                        error: function (ex) {
                            alert('Failed');
                        }
                    });

    It works fine.  However, when I try to incorporate it with the datatable:

                    var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2010', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
    
                    $('#tblWellCallList').dataTable().fnDestroy();
    
                    var oTable = $('#tblWellCallList').dataTable({
    
                        "type": 'GET',
                        "processing": true,
                        "sortable": true,
                        "ajax": '../api/Patient/GetWellCheckList2/',
                        "contentType": 'application/json; charset=utf-8',
                        "dataType": 'json',
                        "data": searchData,
                        
                        "columns": [
    
                            { "data": "PatientLastName" },
                            { "data": "PatientFirstName" },
                            { "data": "PatientID" },
                            { "data": "PatientPhone" },
                            { "data": "EmployerPhone" },
                            { "data": "Remarks" },
                            { "data": "Remarks2" },
                            { "data": "Ins1Company" },
                            { "data": "Ins1CertNmbr" },
                            { "data": "LastWellVisit" },
                            { "data": "NextWellVisit" }
                        ]
                    });

    it throws a 404 error.

    Thursday, July 23, 2015 9:55 PM
  • User-782957977 posted

    Try this

    var searchData = { Insurance: 'INTEG', LowerDOBRange: '07/21/2010', UpperDOBRange: '07/21/2015', LastVisitLowerRange: '07/21/2015', LastWellVisit: '07/21/2015' };
    $('#tblWellCallList').DataTable(
                    {
                        "processing": true,
                        "sortable": true,
                        "ajax": { 
                                 "url": "../api/Patient/GetWellCheckList/",
                                 "type": "get",
                                 "contentType": 'application/json; charset=utf-8',
                                 "dataType": 'json',
                                 "data": searchData 
                                 },
                        "columns": [
    
                            { "data": "PatientLastName" },
                            { "data": "PatientFirstName" },
                            { "data": "PatientID" },
                            { "data": "PatientPhone" },
                            { "data": "EmployerPhone" },
                            { "data": "Remarks" },
                            { "data": "Remarks2" },
                            { "data": "Ins1Company" },
                            { "data": "Ins1CertNmbr" },
                            { "data": "LastWellVisit" },
                            { "data": "NextWellVisit" }
                        ]
    
                    }
                    );

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, July 23, 2015 10:11 PM
  • User1122355199 posted

    That did it.  Thanks so much for the time and patience.

    Friday, July 24, 2015 11:05 AM