Solved

jQuery Flexigrid Plugin - newbie help

Posted on 2010-09-01
13
974 Views
Last Modified: 2012-05-10
Hi

Can anyone support my attempt to use this jQuery plugin, or know where I can go to get some decent support? I am using a .ashx generic handler and returning xml data but the data won't show up in the html page, any ideas please ????



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
		<title></title>
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="flexigrid/flexigrid.pack.js"></script>
		<link rel="Stylesheet" href="flexigrid/style.css" media="screen" />
		<script type="text/javascript">
				$("document").ready(function ()
				{
						$("#flex1").flexigrid({
								url: 'dac.ashx',
								dataType: 'xml',
								colModel: [
														{ display: 'ISO', name: 'iso', width: 40, sortable: true, align: 'center' },
														{ display: 'Name', name: 'name', width: 180, sortable: true, align: 'left' },
														{ display: 'Printable Name', name: 'printable_name', width: 120, sortable: true, align: 'left' },
														{ display: 'ISO3', name: 'iso3', width: 130, sortable: true, align: 'left', hide: true },
														{ display: 'Number Code', name: 'numcode', width: 80, sortable: true, align: 'right' }
														],								
								searchitems: [
														{ display: 'ISO', name: 'iso' },
														{ display: 'Name', name: 'name', isdefault: true }
														],
								sortname: "iso",
								sortorder: "asc",
								usepager: true,
								singleSelect: true,
								title: 'Countries',
								useRp: true,
								rp: 15,
								showTableToggleBtn: true,
								width: 700,
								height: 200
						});

				});

		</script>
</head>
<body>
		<table id='flex1'>
		</table>
</body>
</html>

-------------------------------------------------------------------------------------------------------------------------------------

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Text;

namespace testproj
{
	public class dac : IHttpHandler
	{

		public void ProcessRequest(HttpContext context)
		{
			context.Response.ContentType = "text/HTML";

			string buf = string.Empty;
			buf += "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
			buf += "<rows>";
			buf += "<page>1</page>";
			buf += "<total>2</total>";
			buf += "<row id='ZW'>";
			buf += "<cell>ZW</cell>";
			buf += "<cell>Zimbabwe</cell>";
			buf += "<cell>Zimbabwe</cell>";
			buf += "<cell>ZWE</cell>";
			buf += "<cell>716</cell>";
			buf += "</row>";
			buf += "<row id='ZM'>";
			buf += "<cell>ZM</cell>";
			buf += "<cell>Zambia</cell>";
			buf += "<cell>Zambia</cell>";
			buf += "<cell>ZMB</cell>";
			buf += "<cell>894</cell>";
			buf += "</row>";
			buf += "</rows>";

			context.Response.Write(buf);
		}

		public bool IsReusable
		{
			get
			{
				return false;
			}
		}
	}
}

Open in new window

0
Comment
Question by:jonatec
  • 8
  • 5
13 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 33576742
0
 

Author Comment

by:jonatec
ID: 33576825
Ok thanks, but why as a dot net developer should I write a JSON function when it's easy to return xml from ADO.NET ? Question is can I return xml to the Flexigrid ?
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33576876
I don't want to force you to return JSON or anything else, just to propose you the threads.
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:jonatec
ID: 33576923
The threads stated major on a JSON solution which I could just paste in and use. However I would like to return xml and process that in a Flexigrid, is that possible? ( The development documention at the Flexigrid web site is very sparse to say the least ).
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 33577583
Use a webservice instead, we get a "Connection Error" with the handler :


using System;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Xml;

/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {

    public WebService () {

        //Uncomment the following line if using designed components 
        //InitializeComponent(); 
    }

    [WebMethod]
    public XmlDocument HelloWorld()
    {
//        context.Response.ContentType = "text/HTML";
        XmlDocument xmlDoc = new XmlDocument();

        string buf = string.Empty;
//        buf += "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
        buf += "<rows>";
        buf += "<page>1</page>";
        buf += "<total>2</total>";
        buf += "<row id='ZW'>";
        buf += "<cell><![CDATA[ZW]]></cell>";
        buf += "<cell><![CDATA[Zimbabwe]]></cell>";
        buf += "<cell><![CDATA[Zimbabwe]]></cell>";
        buf += "<cell><![CDATA[ZWE]]></cell>";
        buf += "<cell><![CDATA[716]]></cell>";
        buf += "</row>";
        buf += "<row id='ZM'>";
        buf += "<cell><![CDATA[ZM]]></cell>";
        buf += "<cell><![CDATA[Zambia]]></cell>";
        buf += "<cell><![CDATA[Zambia]]></cell>";
        buf += "<cell><![CDATA[ZMB]]></cell>";
        buf += "<cell><![CDATA[894]]></cell>";
        buf += "</row>";
        buf += "</rows>";

//        context.Response.Write(buf); 
        xmlDoc.LoadXml(buf);
        return xmlDoc;
    }
    
}

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 33577621

.....
$("#flex1").flexigrid({
   url: 'WebService.asmx/HelloWorld',
....

Open in new window

0
 

Author Comment

by:jonatec
ID: 33577684
Great. Does the data type matter, ie...

context.Response.ContentType = "text/HTML";

should I change to text/xml  ?
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33577707
it work fine for me without changing anything else in the webservice not you ?
Clipboard02.jpg
0
 

Author Comment

by:jonatec
ID: 33577776
Yeah, that's great thanks !

Point of discussion then before I close this...

Would you agree that JSON formatted data is unecessary when returning data from an ADO.NET dataset and that xml is better to use ?

0
 
LVL 82

Expert Comment

by:leakim971
ID: 33577813
>Point of discussion then before I close this...

You mean you won't give points before having the answer ?
0
 

Author Closing Comment

by:jonatec
ID: 33577911
Thanks.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33578208
>Would you agree that JSON formatted data is unecessary when returning data from an ADO.NET dataset and that xml is better to use ?

Don't know about ADO.NET or another way to get data fastly.
Create a JSON object may be a long work with .NET but, as you know, for a large amount of data or a lot of requests you save a lot of bandwidth.
Point of view of the client side, most of time, it's easyest to use JSON data than XML data.

I saw first version of flexigrid used only XML.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33578214
You're welcome! Thanks for the points!
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn how to dynamically set the form action using jQuery.
In this fifth video of the Xpdf series, we discuss and demonstrate the PDFdetach utility, which is able to list and, more importantly, extract attachments that are embedded in PDF files. It does this via a command line interface, making it suitable …

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question