jQuery UI Widgets Forums Grid Grid Loading with no data

This topic contains 6 replies, has 2 voices, and was last updated by  emad 9 years, 9 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • Grid Loading with no data #59208

    emad
    Participant

    Hello every body,,

    I’m new to jqwidgets, and spent last few dayes trying to make jqxGrid working with no reasons,, The Gride is loading with headers but with no data,, Can any one look if i’m right..

    I’m using asp.net to load data form sqlserver table and convert it to xml as below:

    1)) ASP.NET

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.Script.Services;
    using System.Data;
    using System.Configuration;
    using System.Web.Script.Serialization;
    using System.Web.Services;
    
    namespace WebApplication1
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            
            protected void Page_Load(object sender, EventArgs e)
            {
                
            }
    
            [WebMethod]
            [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Xml)]
            public static string getTenders()
            {
                conn cn = new conn();
                DataSet dsRetTendExpire = cn.getData("select Enq_ID,Enq_Ref from Enquiry", "Enquiry");
                System.IO.StringWriter writer = new System.IO.StringWriter();
                dsRetTendExpire.Tables[0].WriteXml(writer, XmlWriteMode.WriteSchema, false);
                return writer.ToString();
            }
        }
    }

    2)) Jquery and HTML Code:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <link href="jqwidgets/styles/jqx.base.css" rel="stylesheet" />
        <link href="jqwidgets/styles/jqx.classic.css" rel="stylesheet" />
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script src="jqwidgets/jqxcore.js"></script>
        <script src="jqwidgets/jqxbuttons.js"></script>
        <script src="jqwidgets/jqxdata.js"></script>
        <script src="jqwidgets/jqxgrid.js"></script>
        <script src="jqwidgets/jqxgrid.selection.js"></script>
        <script src="jqwidgets/jqxmenu.js"></script>
        <script src="jqwidgets/jqxscrollbar.js"></script>
    
        <script type="text/javascript">
    
            $(document).ready(function () {
                var url = "WebForm1.aspx/getTenders";
                var source = {
                    datatype: "xml",
                    datafields: [
                    { name: 'Enq_ID' },
                    { name: 'Enq_Ref' }
                    ],
                    async: false,
                    record: 'Table',
                    url: url
                };
    
                var dataAdapter = new $.jqx.dataAdapter(source,
                    { contentType: 'application/json; charset=utf-8' }
                );
    
                $("#jqxgrid").jqxGrid({
                    source: dataAdapter,
                    theme: 'classic',
                    width: 850,
                    columns: [
                        { text: 'Enquery ID', dataField: 'Enq_ID', width: 250 },
                        { text: 'Refrance', dataField: 'Enq_Ref', width: 300 }
                    ]
                });
            });
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        
            <div id="jqxgrid"></div>
      
        </form>
    </body>
    </html>

    I Really need your help to get start with this widgets..
    Thanks in advance,,

    • This topic was modified 9 years, 9 months ago by  emad.
    Grid Loading with no data #59216

    Dimitar
    Participant

    Hello emad,

    Your client-side code seems correct. The issue may be in retrieving the data. Please check out the ASP .NET Integration tutorials in the Documentation to see how to correctly bind jqxGrid to a database.

    To see if the data is successfully loaded in the data adapter, set its loadComplete callback function, e.g.:

    var dataAdapter = new $.jqx.dataAdapter(source, {
        contentType: 'application/json; charset=utf-8',
        loadComplete: function() {
            alert("Data loaded successfully.");
        }
    });

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Grid Loading with no data #59253

    emad
    Participant

    Thank you Dimitar for replay,,

    i’v added the load compleate function() and the result was ‘Data loaded Successfully’ but still no data showen in gride,,

    Regards

    Grid Loading with no data #59274

    emad
    Participant

    any ideas please,,

    Grid Loading with no data #59289

    Dimitar
    Participant

    Hi emad,

    It is possible that your XML mapping is incorrect and the loaded data is not the intended one. We cannot be sure without some sample data.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Grid Loading with no data #59292

    emad
    Participant

    Hi Dimitar,,

    I debuge using the firebug and the result of the loaded xml data was found:

    Result of Get request is:

    xmlresult.

    Regards,,
    Emad

    Grid Loading with no data #59298

    emad
    Participant

    Thank you very much it warks,,

    I changed the recorde: ‘Table’, To the name of my table record: ‘Enquiry’,

    Regards,,

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

You must be logged in to reply to this topic.