public
Last active

  • Download Gist
YUI_JSON_Datatable_Problem.htm
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
 
 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>JSON Datatable Proof of Concept</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/datatable/assets/skins/sam/datatable.css" />
 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/element/element-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/datasource/datasource-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/datatable/datatable-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/connection/connection-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/json/json-min.js"></script>
 
 
<style type="text/css">
#container {height:15em;}
myContainer { background-color:Gray;}
</style>
<script type="text/javascript">
 
YAHOO.util.Event.addListener("myButton", "click", function() {
var myConfigs = {};
var myColumnDefs = [
{key:"EmpId"},
{key:"Name"},
{key:"Designation"},
{key:"Department"},
{key:"Country"}
];
 
var myDataSource = new YAHOO.util.DataSource('http://localhost:1715/JSONService/JSONService.svc/Charm?');
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.connMethodPost = true;
 
myDataSource.responseSchema = {
resultNode: "Rows",
fields : ["EmpId", "Name" ,"Designation", "Department" , "Country"]
};
 
var myDataTable = new YAHOO.widget.DataTable("myContainer", myColumnDefs, myDataSource, myConfigs);
return {
oDS: myDataSource,
oDT: myDataTable
};
});
 
 
</script>
</head>
<body class="yui-skin-sam">
<form id="form1" action="#">
<input type="button" id="myButton" value="Get Data" />
<div id="myContainer"></div>
</form>
</body>
</html>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.