jQWidgets Forums

Tagged: datagrid widget

This topic contains 3 replies, has 2 voices, and was last updated by Peter Stoev 11 years, 3 months ago.

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

Author

NestedGrid – no records found Posts
January 14, 2014 at 12:30 am NestedGrid – no records found #47812

purell007
Participant

Used the example.

The parent grid displays rows just fine. The nested grid doesn’t. It’s blank. BindSubGridDataJqxGrid() is never called.

Also what if there is more than one primary key. How does that work. What if there is 3 primary key’s on the nested grid table.

<%@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”JQXgrid2.aspx.cs” Inherits=”JQXgrid2″ %>

<!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 runat=”server”>
<title></title>
<link rel=”stylesheet” href=”Scripts/jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”Scripts/jquery-1.10.2.min.js”></script>
<script type=”text/javascript” src=”Scripts/jquery-ui.min.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxdata.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxscrollbar.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxmenu.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxgrid.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxgrid.selection.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxgrid.filter.js”></script>
<script type=”text/javascript” src=”Scripts/jqwidgets/jqxgrid.sort.js”></script>
<script type=”text/javascript” src=”Scripts/demos.js”></script>
</head>
<body>
<form id=”form1″ runat=”server”>
<script type=”text/javascript”>
$(document).ready(function() {
$(‘#BtnGo’).click(function() {
var url = “JQXgrid2.aspx/BindCountDataJqxGrid”;

var source =
{
datafields: [
{ name: ‘CountID’ },
{ name: ‘Count’ }
],
record: “Table”,
id: ‘CountID’,
datatype: “xml”,
async: false,
url: url
};

var countAdapter = new $.jqx.dataAdapter(source, { contentType: ‘application/json; charset=utf-8’ });

var subgridUrl = “JQXgrid2.aspx/BindSubGridDataJqxGrid”;

var employeesSource =
{
datafields: [
{ name: ‘RId’, type: ‘int’ },
{ name: ‘A’, type: ‘string’ },
{ name: ‘B’, type: ‘string’ },
{ name: ‘RDate’, type: ‘date’ }
],
record: ‘Table’,
datatype: “xml”,
async: false,
url: subgridUrl
};

var employeesDataAdapter = new $.jqx.dataAdapter(employeesSource, { autoBind: true });
employees = employeesDataAdapter.records;
var nestedGrids = new Array();

// create nested grid.
var initrowdetails = function(index, parentElement, gridElement, record) {
var id = record.uid.toString();
var grid = $($(parentElement).children()[0]);
nestedGrids[index] = grid;
var filtergroup = new $.jqx.filter();
var filter_or_operator = 1;
var filtervalue = id;
var filtercondition = ‘equal’;
var filter = filtergroup.createfilter(‘stringfilter’, filtervalue, filtercondition);
// fill the orders depending on the id.
var employeesbyid = [];
for (var m = 0; m < employees.length; m++) {
var result = filter.evaluate(employees[m][“CountID”]);
if (result)
employeesbyid.push(employees[m]);
}

var employeessource = {
datafields: [
{ name: ‘RID’, type: ‘int’ },
{ name: ‘A’, type: ‘string’ },
{ name: ‘B’, type: ‘string’ },
{ name: ‘RDate’, type: ‘date’ }
],
id: ‘RID’,
localdata: employeesbyid
};
var nestedGridAdapter = new $.jqx.dataAdapter(employeessource);

if (grid != null) {
grid.jqxGrid({
source: nestedGridAdapter,
width: 900,
height: 200,
columns: [
{ text: ‘RID’, dataField: ‘RID’, width: 150 },
{ text: ‘A’, dataField: ‘A’, width: 180 },
{ text: ‘B’, dataField: ‘B’, width: 150 },
{ text: ‘RDate’, dataField: ‘RDate’, width: 150 }
]
});
}
};

var renderer = function(row, column, value) {
return ‘<span style=”margin-left: 4px; margin-top: 9px; float: left;”>’ + value + ‘</span>’;
};

// create jqxgrid
$(“#jqxgrid”).jqxGrid(
{
width: 1000,
height: 600,
source: countAdapter,
rowdetails: true,
rowsheight: 35,
initrowdetails: initrowdetails,
rowdetailstemplate: { rowdetails: “<div id=’grid’ style=’margin: 10px;’></div>”, rowdetailsheight: 220, rowdetailshidden: true },
ready: function() {
$(“#jqxgrid”).jqxGrid(‘showrowdetails’, 1);
},
columns: [
{ text: ‘CountID’, datafield: ‘CountID’, width: 100, cellsrenderer: renderer },
{ text: ‘Count’, datafield: ‘Count’, width: 100, cellsrenderer: renderer }
]
});
});
});

</script>
<%– <asp:Button ID=”BtnGo” runat=”server” Text=”Go” Width=”63px” />–%>
<input id=”BtnGo” type=”button” value=”BtnGo” />
<div id=”jqxgrid”>
</div>
</form>
</body>
</html>

January 14, 2014 at 11:20 am NestedGrid – no records found #47842

Peter Stoev
Keymaster

Hi purell007,

I suppose that either the URL is incorrect or the contentType is incorrect. As far as I see, you use 2 different contentTypes in your dataAdapter’s.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

January 14, 2014 at 7:22 pm NestedGrid – no records found #47860

purell007
Participant

The URL is correct. Both url’s return xml string:
data.Tables[0].WriteXml(writer, XmlWriteMode.WriteSchema, false);
return writer.ToString();

I tried putting the same contenttype for both adapters and the child grid still says no records found.

January 15, 2014 at 6:39 am NestedGrid – no records found #47874

Peter Stoev
Keymaster

Hi purell007,

Unfortunately, I do not know what could be the reason. If the jqxDataAdapter is initialized correctly, it will make an Ajax call to the specified URL. If you’re a licensed customer or commercially evaluating the product, you may send your project to support@jqwidgets.com and our Team will test and debug exactly what goes wrong.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com
Author

Posts

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

You must be logged in to reply to this topic.