jQuery UI Widgets Forums DataTable Retrieving JSON from ASMX Web Service

This topic contains 2 replies, has 2 voices, and was last updated by  Hristo 7 years, 2 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • idormain
    Participant

    Hi All,

    I am not having any luck despite following the code examples and documentation provided. I am not able to retrieve data back after successfully calling a Web Service (this Web Service is in debug mode and the breakpoints are not being hit so it’s not even getting from the JS), In my opinion, the support provided is not very good, but I’m going to persist as I really like this suite and don’t really want to buy another like Kendo UI, but I may be left with little choice.

    So to summarise, I have an ASMX Web Service code below:

    
     [WebMethod]
            [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
            public string GetFileData(string tableName, int recordId)
            {
                try
                {
                    using (SMMDataModelContainer model = new SMMDataModelContainer())
                    {
                        StringBuilder stringBuilder = new StringBuilder();
                        List<Solomani_MyMembers_Online.Data.File> files = model.Files.Where(f => f.TableName.Equals(tableName) && f.RecordId.Equals(recordId)).ToList();
                        return new JavaScriptSerializer().Serialize(files);
                        //var serializer = new XmlSerializer(typeof(List<Solomani_MyMembers_Online.Data.File>),
                        //                                   new XmlRootAttribute("Files"));
                        //using (var stream = new StringWriter())
                        //{
                        //    serializer.Serialize(stream, files);
                        //    stringBuilder.Append(stream.ToString());
                        //}
                        //StringWriter writer = new StringWriter(stringBuilder);
                        //return writer.ToString();
                    }
                }
                catch (Exception ex)
                {
                    SMMErrorHandling.LogException(ex);
                    return null;
                }
            } 

    Instead of returning XML I want to return JSON and instead of using NewtonSoft I am using the .NET JavaScript Libraries. The JS source Code is below:

    function SetFileData(tableName, recordId) {
        try
        {
            if (recordId == '') {
                return false;
            }
            source = {
                type: "GET",
                datatype: "json",
                datafields: [
                        { name: 'FileId' },
                        { name: 'FileName' },
                        { name: 'EditLink' },
                        { name: 'DownloadLink' }
                ],
                data: "{'tableName':'" + tableName + "', 'recordId': '" + recordId + "'}",
                url: '../Services/SMMDataManagement.asmx/GetFileData',
                cache: false,
                root: 'data'           
            };
            var dataAdapter = new $.jqx.dataAdapter(source,
                {
                    contentType: 'application/json; charset=utf-8',
                    loadError: function (jqXHR, status, error) {
                    },
                }
            );
            $("#fileDataTable").jqxDataTable({
                source: dataAdapter,
                theme: 'SMM_EnergyBlue',
                pageable: true,
                pagerButtonsCount: 10,
                sortable: true,
                width: '100%',
                height: '100%',
                columns: [
                    { text: 'File ID', dataField: 'FileId', width: 100 },
                    { text: 'File Name', dataField: 'FileName', width: 180 },
                    { text: 'Open', dataField: 'EditLink', width: 250 },
                    { text: 'Download', dataField: 'DownloadLink', width: 250 }
                ]
            });
        }
        catch (e) {
            ErrorHandler('Oh No! An Exception has occured and has been logged [SetFileData]. Please try again.');
        }
    }

    When I call the function I get no fail back from the Data Adapter but the Web Service is not accessed, when I get to the jqxDataTable I generally get the exception: Uncaught TypeError: Cannot read property ‘fileName’ of undefined.

    Has anyone got any suggestions, any would be appreciated, thank you all.


    idormain
    Participant

    Ok so I fixed the issue:

    Removed the Decoration: UseHttpGet = true from the Web Method

    Used JQuery AJAX Call to retrieve Data:

    $.ajax({
                type: 'POST',
                url: '../Services/SMMDataManagement.asmx/GetFileData',
                data: "{requiredTableName: '" + tableName + "', recordId: '" + recordId + "'}",
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                async: false,
                cache: false,
                timeout: 10000,
                success: function (response) {
                    if (response.d != null) {
                        sourceData = response.d;
                    }
                },
                error: function (xhr, status, error) {
                    
                }
            });
    

    Removed the single quotes from the parsed arguments:

    data: “{requiredTableName: ‘” + tableName + “‘, recordId: ‘” + recordId + “‘}”,

    Set the Source to the following:

       source = {
                localData: sourceData,
                dataType: "json",
                dataFields:
                [
                    { name: 'FileId', type: 'number'},
                    { name: 'FileName', type: 'string'},
                    { name: 'EditLink', type: 'string'},
                    { name: 'DownloadLink', type: 'string'}
                ]
            };
    

    Set the Local Data Source to use the returned JSON Object from the AJAX Call.

    Changed from GET to POST (as the decoration originally used prohibited the using of POST.

    So it all works, and I’m happy to have been able to solve the issue myself; however, can I ask, is this the best solution?

    Cheers,

    Kind Regards,

    Ivan

    Retrieving JSON from ASMX Web Service #92691

    Hristo
    Participant

    Hello Ivan,

    Thank you for the interest to our widgets.
    It looks fine.
    Let me know if you need anything else.

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.