- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
您好,我有绑定(bind)到 Gridview 的 DataTable。但是需要将知道的绑定(bind)到 jqxgrid 或 jqxdatatable。在谷歌搜索了这么多次之后,我没有找到合适的解决方案。
DataTable tb1= qry.GetTicketDetails();
serviceWindow.DataSource = tb;
serviceWindow.DataBind();
这就是我现在正在做的事情。
在 jquery 中,我可以采用如下所示的 XML。
var source =
{
dataType: "json",
dataFields: [
{ name: 'name', type: 'string' },
{ name: 'type', type: 'string' },
{ name: 'calories', type: 'int' },
{ name: 'totalfat', type: 'string' },
{ name: 'protein', type: 'string' }
],
id: 'id',
url: "data/ticket.XML", //how to take datatable from code behind file
};
最佳答案
.aspx代码 -->>
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestCellSelection.aspx.cs" Inherits="CourierApp.Project.TestCellSelection" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title id='Description'></title>
<link rel="stylesheet" href="../JQWidgets/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="../JQWidgets/scripts/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxmenu.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxgrid.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxgrid.selection.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxgrid.columnsresize.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="../JQWidgets/scripts/demos.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxdropdownlist.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxgrid.pager.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxgrid.edit.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxnumberinput.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxpanel.js"></script>
<script type="text/javascript" src="../JQWidgets/jqwidgets/jqxgrid.sort.js"></script>
<script type="text/javascript">
$(document).load(function () {
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$("#button").jqxButton({
theme: 'energyblue',
height: 30
});
$("#button").click(function () {
var cells = $('#jqxgrid').jqxGrid('getselectedcells');
var cellInfo = "";
for (var i = 0; i < cells.length; i++) {
var cell = cells[i];
cellInfo += "\nRow: " + cell.rowindex + ", " + cell.datafield;
}
alert(cellInfo);
});
//GetData
var data = {};
var dataFelds = {};
var dataCols = {};
GetDatas();
GetCol_Datafeilds();
GetCol_Columns();
function GetDatas() {
$.ajax({
url: '<%=ResolveUrl("~/Project/Service.aspx/GridValues")%>',
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
cache: false,
success: function (dataa) {
var response = dataa.d;
if (response != "Error") {
data = response;
console.log(data);
}
else {
alert("Retrive Error !!");
}
},
failure: function (data) {
alert(response.d);
},
error: function (error) {
console.log("Error : " + error.responseText);
}
});
}
function GetCol_Datafeilds() {
$.ajax({
url: '<%=ResolveUrl("~/Project/Service.aspx/Col_Datafeilds")%>',
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
cache: false,
success: function (dataa) {
var response = dataa.d;
if (response != "Error") {
dataFelds = $.parseJSON(response);
console.log(dataFelds);
}
else {
alert("Retrive Error !!");
}
},
failure: function (data) {
alert(response.d);
},
error: function (error) {
console.log("Error : " + error.responseText);
}
});
}
function GetCol_Columns() {
$.ajax({
url: '<%=ResolveUrl("~/Project/Service.aspx/Col_Columns")%>',
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
cache: false,
success: function (dataa) {
var response = dataa.d;
if (response != "Error") {
dataCols = $.parseJSON(response);
console.log(dataCols);
}
else {
alert("Retrive Error !!");
}
},
failure: function (data) {
alert(response.d);
},
error: function (error) {
console.log("Error : " + error.responseText);
}
});
}
// prepare the data
var source =
{
datatype: "json",
datafields: dataFelds,
updaterow: function (rowid, rowdata, commit) {
// synchronize with the server - send update command
// call commit with parameter true if the synchronization with the server is successful
// and with parameter false if the synchronization failder.
commit(true);
},
localdata: data
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#jqxgrid").jqxGrid(
{
width: 1000,
source: dataAdapter,
editable: true,
selectionmode: 'multiplecellsadvanced',
columnsresize: true,
columns: dataCols
});
// $('#jqxgrid').jqxGrid('pincolumn', 'From_KG');
//$("#jqxgrid").jqxGrid('enablehover', event.args.checked);
});
<%--$("#<%=btn_SelectCells.ClientID%>").click(function () {
var cells = $('#jqxgrid').jqxGrid('getselectedcells');
var cellInfo = "";
for (var i = 0; i < cells.length; i++) {
var cell = cells[i];
cellInfo += "\nRow: " + cell.rowindex + ", " + cell.datafield;
}
alert(cellInfo);
});--%>
</script>
</head>
<body class='default'>
<form id="form1" runat="server">
<div>
<div id='jqxWidget'>
<div id="jqxgrid">
</div>
</div>
<div style="margin-top: 10px;">
<input id="button" type="button" value="Get the selected cells" />
<%--<asp:Button ID="btn_SelectCells" runat="server" Text="Get the selected cells" UseSubmitBehavior="False" />--%>
</div>
</div>
</form>
</body>
</html>
.aspx.cs 或 Web 服务代码 ----->>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;
using System.Data;
using System.Data.SqlClient;
using System.Collections;
using System.Web.Script.Serialization;
using System.Web.Helpers;
using BL;
using DAL;
using Newtonsoft.Json;
public partial class Project_Service : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
#region Testing
[WebMethod]
public static String GridValues()
{
String Qry = "SELECT [From Kgs] as From_Kg,[To kgs] as To_Kg,[1] as Zone1,[2] as Zone2,[3] as Zone3,[4] as Zone4,[5] as Zone5,[6] as Zone6,[7] as Zone7,[8] as Zone8,[9] as Zone9 FROM Tnt_Rate";
DataTable dt = DbAccess.FetchDatatable(Qry);
System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
Dictionary<string, object> row;
foreach (DataRow dr in dt.Rows)
{
row = new Dictionary<string, object>();
foreach (DataColumn col in dt.Columns)
{
row.Add(col.ColumnName, dr[col]);
}
rows.Add(row);
}
String Val = serializer.Serialize(rows);
if (Val != "")
{
return (Val);
}
else
{
return "Error";
}
}
[WebMethod]
public static String Col_Datafeilds()
{
String Qry = "SELECT [From Kgs] as From_Kg,[To kgs] as To_Kg,[1] as Zone1,[2] as Zone2,[3] as Zone3,[4] as Zone4,[5] as Zone5,[6] as Zone6,[7] as Zone7,[8] as Zone8,[9] as Zone9 FROM Tnt_Rate";
DataTable dt = DbAccess.FetchDatatable(Qry);
System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
Dictionary<string, object> row = new Dictionary<string, object>();
String Col = "";
int counter = 0;
foreach (DataColumn col in dt.Columns)
{
if (counter < 2)
{
row = new Dictionary<string, object>();
row.Add("name", col.ColumnName);
row.Add("type", "string");
rows.Add(row);
}
else if (counter >= 2)
{
row = new Dictionary<string, object>();
row.Add("name", col.ColumnName);
row.Add("type", "number");
rows.Add(row);
}
counter += 1;
}
Col = serializer.Serialize(rows);
//Col = JsonConvert.SerializeObject(rows);
if (Col != "")
{
return (Col);
}
else
{
return "Error";
}
}
[WebMethod]
public static String Col_Columns()
{
String Qry = "SELECT [From Kgs] as From_Kg,[To kgs] as To_Kg,[1] as Zone1,[2] as Zone2,[3] as Zone3,[4] as Zone4,[5] as Zone5,[6] as Zone6,[7] as Zone7,[8] as Zone8,[9] as Zone9 FROM Tnt_Rate";
DataTable dt = DbAccess.FetchDatatable(Qry);
System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
Dictionary<string, object> row;
String Col = "";
int counter = 0;
foreach (DataColumn col in dt.Columns)
{
if (counter < 2)
{
row = new Dictionary<string, object>();
row.Add("text", col.ColumnName.ToUpper());
row.Add("datafield", col.ColumnName);
row.Add("columntype", "textbox");
row.Add("width", "100");
row.Add("cellsalign", "left");
//row.Add("pinned", "true");
rows.Add(row);
}
else if (counter >= 2)
{
row = new Dictionary<string, object>();
row.Add("text", col.ColumnName.ToUpper());
row.Add("datafield", col.ColumnName);
row.Add("columntype", "textbox");
row.Add("width", "25");
row.Add("cellsalign", "right");
rows.Add(row);
}
}
Col = serializer.Serialize(rows);
// Col = JsonConvert.SerializeObject(rows);
if (Col != "")
{
return (Col);
}
else
{
return "Error";
}
}
#endregion
}
粘贴吧......
用你的查询替换查询......
不要提供数据字段和列定义。在 .aspx 页面中
这是完全动态的解决方案!!!
关于c# - 如何在 jqxgrid 中使用来自代码后面的数据表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25304099/
如何以编程方式检查 jQWidgets jqxGrid 的所有行与复选框选项?我可以循环遍历行并逐一选择它们或使用 $("#jqxgrid").jqxGrid('selectallrows'); 但
引用下面给定链接中提供的代码 http://jsfiddle.net/tzHXR/ var data = generatedata(500); var source = { localda
我从这个论坛引用了一些答案 http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-gri
jqxGrid 是否可以渲染作为对象的单元格值? 例如在此Codepen example每行都有一个属性details,它有一个对象值。我想说的是,创建一个自定义渲染器来显示它的 JSON 字符串化版
我正在使用 jqwidgets 的 Jqxgrid。 我在网格中获取了一个下拉列表。 我想在页面加载时默认以可编辑模式显示下拉列表。 请看一下这个屏幕截图,其中第一个下拉列表显示为“请选择”,它会在单
JS: http://jsfiddle.net/tzHXR/ var data = generatedata(500); var source = { localdata: data,
您好,我有绑定(bind)到 Gridview 的 DataTable。但是需要将知道的绑定(bind)到 jqxgrid 或 jqxdatatable。在谷歌搜索了这么多次之后,我没有找到合适的解决
我正在尝试使 jqxGrid 中的单元格可编辑,具体取决于行中另一列的值(名称为 Editable)。 { text: "Percentage", datafield: "Percentage", c
在 Angular 中,我正在尝试将主题应用于我的网格。 我的网格 在 jqwidgets 文件夹中
我使用radiobutton的渲染器列使用JQXWidgets Grid(JQXGRID),并通过rowdata值检查了True或false,当检查了多个 radio 和滚动网格时,未选中的已检查 r
我正在尝试根据我的 jqxgrid 是否有要显示的数据来启用/禁用 jqxbuttons。我能想到的检查 jqxgrid 是否为空的唯一方法是执行以下操作: function CheckIfGridE
我有一个 jqxGrid,我需要用一些对象填充它。该对象是完全随机的,某些数据字段可能为空。仅当该数据存在于该对象中时,我才需要显示特定的列。 columns: [ { t
我正在关注这个http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm?%28arctic%29#demos/jqxgr
使用 jqxGrid 制作包含数据的表格(显然)。 我已经在 jqxGrid 中加载了我的 Angular Directive(指令)元素,数据更新网格很好,但它只是停留在那里,未渲染,我不知道如何触
我在我的应用程序中使用了 JQXGrid。在初始加载中,数据从服务器检索并加载到 dataAdapter 中,dataAdapter 用作网格的源。当我过滤网格中的任何列时,我需要在 dataAdap
有人可以提供正确的实现方法来利用 jqxDropDownList 并启用复选框作为网格列吗? 以下代码是根据jqwidgets网格演示代码'cellediting.htm'修改的。 我已经实现了一个带
在上图中,标题中的一些文本被隐藏了。我尝试了 padding-bottom 属性,但没有帮助。我使用 jqwidgets 中的 jqxgrid 小部件 关注的div是.jqx-grid-header我
我们使用 jqxgrid 在屏幕上显示房间信息。为了便于阅读,我们尝试将日期格式设置为“今天”或“明天”,而不是实际日期(今天或明天......)。 除了重新格式化为“今天”和“明天”之外,一切正常(
我按照这个例子的步骤(http://www.jqwidgets.com/jquery-widgets-documentation/documentation/java-integration/bind
在jqxGrid ,如何从 JSON 数据添加新的计算列? 我的 JSON 数据包含字段 baseQuantity 和 unitCost。我想添加一个名为 totalCost 的新字段,它是 base
我是一名优秀的程序员,十分优秀!