Example code for .NET Connector

Suite and Optimus Suite 5
#1

We recently bought the professional licence for dhtmlx. I am currently looking for full javascript and C# MVC .NET Connector sample code running against MS SqlServer on the back-end. All I see in the documentation is bits and pieces of php code, that is not very coherent. I am specifically looking for information as where to put things and what to call the files, I am looking for the glue to tie the pieces of information together.

In the documentation for .NET, you have below code in the index.html, or in my case it would be a javascript. What about “myconnector.ashx”, how does that file look like and where do I put it in the structure? I am assuming it would be in the server side somewhere, but at this point it is a little cryptic.

//index.html
myGrid = new dhtmlXGridObject(“someContainer”);// initializes grid
…
myGrid.load(“myconnector.ashx”);

A little further down you have this code, is that the “myconnector.ashx” mentioned above?

<%@ WebHandler Language=“C#” CodeBehind=“gridConnector.ashx.cs” Class=“dhtmlxConnector.gridConnector” %>

public class gridConnector : dhtmlxRequestHandler
{
}

You also have this code, where does that one go?

public override IdhtmlxConnector CreateConnector(HttpContext context)
{
return new dhtmlxGridConnector(
“BookStore”, //table to select from
“sales, title, author, price, instore, shipping, bestseller, pub_date”, //fields to select
“book_id”, //primary key column name
dhtmlxDatabaseAdapterType.SqlServer2005, //predefined database adapter type
ConfigurationManager.ConnectionStrings[“SamplesDatabase”].ConnectionString //connection string
);
}

It would be really helpful if you could post a full example project using javascript/Razor/MVC/C# .NET/MSSQLServer, so one can see where the various pieces go and naming convention.

#2

You can grab full package of .Net connectors, which includes samples for all components
dhtmlx.com/x/download/regula … or_net.zip

If you plan to use components with .Net MVC - check the next tutorial. MVC allows to use them without extra libs pretty easily
dhtmlx.com/blog/?p=1349
Above post includes full sample.
dhtmlx.com/x/download/regula … et_mvc.zip

#3

Thanks, partially what I have been looking for.

Currently I am trying to setup a web-service with a Connector to be able to grab rows from the database to export them to excel, due to the fact that the browser view is paged, only a few are exported.

The code runs until myGrid.toExcel(sURL), where it fails since the header row is empty, not sure any rows are pulled from the webservice at all. I put a break point there but it is never invoked. I can call the webservice from the browser manually, and it breaks into the code alright, returning xml for the entire database as expected, so that part works.

Are there any steps missing for index.cshtml to actusally call the webservice? Not sure if the dataprocessor is needed since I am only Getting not Posting. Shouldn’t

            myGrid.load("~/Handlers/ExportConnector.ashx?DatabaseID=1&Table=Table1");

be enough to call the webservice from index.cshtml and actually pull data into the grid? I don’t want the grid to be actually displayed, it’s just a temporary container send data to the Excel Service.

index.cshtml:
@using SquishIt.Mvc
@{
Layout = null;
}

Grid Export Request @(Html.BundleCss() .Add("~/Scripts/dhtmlx/dhtmlxLayout/codebase/dhtmlxlayout.css") .Add("~/Scripts/dhtmlx/dhtmlxLayout/codebase/skins/dhtmlxlayout_dhx_skyblue.css") .Add("~/Scripts/dhtmlx/dhtmlxLayout/codebase/status_toolbar_layout.css") .Add("~/Scripts/dhtmlx/dhtmlxWindows/codebase/dhtmlxwindows.css") .Add("~/Scripts/dhtmlx/dhtmlxWindows/codebase/skins/dhtmlxwindows_dhx_skyblue.css") .Add("~/Scripts/dhtmlx/dhtmlxForm/codebase/skins/dhtmlxform_dhx_skyblue.css") .Add("~/Scripts/dhtmlx/dhtmlxToolbar/codebase/skins/dhtmlxtoolbar_dhx_skyblue.css") .Add("~/Content/Site.css") .MvcRender("~/Content/SquishIt/UtilityGridExport_#.css")) 
<body oncontextmenu="return false;">
    <div id='Container' style='position:absolute; top:24px; left:4px; width: 519px; height: 246px;'> 
    </div>
</body>
<script language="javascript" type="text/javascript">
            myGrid = new dhtmlXGridObject('Container'); // initializes grid
            myGrid.init();
            sURL = "http://dhtmlxgrid.appspot.com/export/excel";
            sURL = AddURLParameter(sURL, "FileName", sFileName);
            myDataProcessor = new dataProcessor("~/Areas/Utility/Handlers/ExportConnector.ashx"); //lock feed url
            myDataProcessor.setTransactionMode("GET", true); //set mode as send-all-by-post
            myDataProcessor.setUpdateMode("off"); //disable auto-update
            myDataProcessor.init(myGrid); //link dataprocessor to the grid
            myGrid.load("~/Handlers/ExportConnector.ashx?DatabaseID=1&Table=Table1");

            myGrid.toExcel(sURL);
</script>
@(Html.BundleJavaScript()
      .Add("~/Scripts/dhtmlx/dhtmlxLayout/codebase/dhtmlxcommon.js")
      .Add("~/Scripts/dhtmlx/dhtmlxLayout/codebase/dhtmlxlayout.js")
      .Add("~/Scripts/dhtmlx/dhtmlxLayout/codebase/dhtmlxcontainer.js")
      .Add("~/Scripts/dhtmlx/dhtmlxWindows/codebase/dhtmlxwindows.js")
      .Add("~/Scripts/dhtmlx/dhtmlxForm/codebase/dhtmlxform.js")
      .Add("~/Scripts/dhtmlx/dhtmlxToolbar/codebase/dhtmlxtoolbar.js")
      .Add("~/Scripts/dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.js")
      .Add("~/Scripts/dhtmlx/dhtmlxGrid/codebase/dhtmlxgridcell.js")
      .Add("~/Scripts/dhtmlx/dhtmlxGrid/codebase/ext/dhtmlxgrid_export.js")
      .Add("~/Scripts/dhtmlx/dhtmlxDataProcessor/codebase/dhtmlxdataprocessor.js")
      .Add("~/Scripts/dhtmlx/dhtmlxConnector/codebase/connector.js")
      .MvcRender("~/Content/SquishIt/UtilityGridExport_#.js"))

Handlers/ExportConnector.ashx:
<%@ WebHandler Language=“C#” CodeBehind=“ExportConnector.ashx.cs” Class=“Handlers.ExportConnector” %>

Handlers/ExportConnector.ashx.cs:
using System;
using System.Web;
using System.Web.Services;
using dhtmlxConnectors;
using System.Data.SqlClient;

namespace Handlers
{
///


/// Connector body
///
[WebService(Namespace = “http://tempuri.org/”)]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class ExportConnector : dhtmlxRequestHandler
{
private string _msConnStr; // Connection string to database

    public override IdhtmlxConnector CreateConnector(HttpContext context)
    {
        _msConnStr = ConnectionString.GetTVConnectionString();
        var sDatabaseID = Convert.ToInt64(context.Request.QueryString["PSIMDatabaseID"]);
        var sTable = context.Request.QueryString["Table"];
        SqlConnectionStringBuilder cs = new SqlConnectionStringBuilder(_msConnStr);
        cs.InitialCatalog= sDatabaseID ;

        var connector = new dhtmlxGridConnector(
            sTable,
            "*",
            "ID",
            dhtmlxDatabaseAdapterType.SqlServer2005,
            cs.ConnectionString
        );

        return connector;
    }
}

}

#4

Got past all the errors once I set the headers before hand on the client side. Are there any way to have the headers feed into the grid from the server side, since I may not always how many columns a table has before hand?

Even after the errors are gone, I still get no actual data exported to the spreadsheet, just headers. The XML looks good, and I checked it on some of the online xml validators. What I do notice however is that the breakpoint one the server side is not hit until the client code is all done, so it’s like there is a synchronization issue, how do I get the webserver call happen synchronous, where the client will wait until the call is done?

#5

I tried putting the toExel call in an event catcher for onXLE, but it never fires for the grid, the webservice is still not breaking until the client is done.

            myGrid.attachEvent("onXLE", function (grid_obj, count) {
                myGrid.toExcel(sURL);
            });