Реализация jgGrid от jQuery с использованием ASP.Форматирование Net и JSON
https://stackoverflow.com/questions/181029
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianВопрос
Кто-нибудь смог реализовать плагин jQuery grid, jqGrid?Я пытаюсь реализовать подкачку в формате JSON, и я чувствую, что приближаюсь к этому, но меня также заваливают несущественными деталями.Если бы кто-нибудь мог опубликовать какой-нибудь пример кода, я был бы очень признателен за это.
Решение
Нашел ваше сообщение, когда я пытался сделать это для своего проекта. Я получил это работает. Для тех, кому это нужно в будущем, jqGrid не будет работать из коробки с JSON и ASP.NET. Вам нужно сделать пару небольших изменений в grid.base.js. Вокруг строки 829 замените раздел случая json следующим:
case "json":
gdata = JSON.stringify(gdata); //ASP.NET expects JSON as a string
$.ajax({ url: ts.p.url,
type: ts.p.mtype,
dataType: "json",
contentType: "application/json; charset=utf-8", //required by ASP.NET
data: gdata,
complete: function(JSON, st) { if (st == "success") { addJSONData(cleanUp(JSON.responseText), ts.grid.bDiv); if (loadComplete) { loadComplete(); } } },
error: function(xhr, st, err) { if (loadError) { loadError(xhr, st, err); } endReq(); },
beforeSend: function(xhr) { if (loadBeforeSend) { loadBeforeSend(xhr); } } });
if (ts.p.loadonce || ts.p.treeGrid) { ts.p.datatype = "local"; }
break;
Затем добавьте следующую функцию:
function cleanUp(responseText) {
var myObject = JSON.parse(responseText); //more secure than eval
return myObject.d; //ASP.NET special
}
Вам также нужно будет включить JSON-анализатор и stringifier . Наряду с работой с ASP.NET этот пересмотренный код также более безопасный , поскольку оператор eval ушел.
РЕДАКТИРОВАТЬ . Я должен был также отметить, что вам, возможно, придется внести изменения, аналогичные grid.celledit.js, grid.formedit.js, grid.inlinedit.js и grid.subgrid.js. .
Другие советы
Я просто использую jTemplates для подкачки страниц на стороне клиента с помощью jQuery и ASP.NET. Я сделал пост в блоге, который вы можете найти здесь: http: // www .aaron-powell.com / blog.aspx? ID = 1209
В нем рассказывается, как создать шаблонное расположение данных, вернуть данные из ASP.NET и затем реализовать решение для разбиения на страницы.
Вы можете использовать ASP.Net MVC JsonResult для заполнения сетки.
Персональный класс
public class Person
{
public int ID { get; set; }
public string Name { get; set; }
public DateTime Birthday { get; set; }
public static IEnumerable<Person> GetABunchOfPeople()
{
// Get a bunch of People.
}
}
В вашем контроллере вы бы имели:
public JsonResult GetABunchOfPeopleAsJson()
{
var rows = (Person.GetABunchOfPeople()
.Select(c => new
{
id = c.ID,
cell = new[]
{
c.ID.ToString(),
c.Name,
c.Birthday.ToShortDateString()
}
})).ToArray();
return new JsonResult
{
Data = new
{
page = 1,
records = rows.Length,
rows,
total = 1
}
};
}
И конфигурация jqGrid для URL будет такой:
url: '<%= ResolveUrl("~/Person/GetAllPeople") %>',
Я просто колеблюсь, пытаясь собрать все воедино. Моя первая задача - просто генерировать правильный ответ JSON. Похоже, мой возвращенный класс сериализуется как свойство с именем 'd' - это вещь JQuery или соглашение о веб-методах ASP.Net? Боюсь, что jqGrid будет искать данные верхнего уровня, тогда как asp.net поместит их в свойство с именем 'd':
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static object GetData() {
TestClass tc = new TestClass() { One = "Hello", Two = "World" };
return tc;
}
$("#divResults").click(function() {
$.ajax({
type: "POST",
url: "GridData_bak.aspx/GetData",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(test) {
// Replace the div's content with the page method's return.
$("#divResults").text(test.d.One);
},
error: function(msg) {
$("#divResults").text(msg);
}
});
});
Плагин flexgrid довольно редок по сложности, однако в небольшом разделе демо-страницы рассказывается о создании сериализованного объекта json, это немного вводит в заблуждение, поскольку сетка требует определенного формата, я перенес код php для опции xml с небольшим количеством обезьяньего жира вы можете сделать то же самое для форматирования json
вот мой xml-порт
the setup for the grid
$("#tableToFlex").flexigrid({
url: 'WebService.asmx/getData'}
... *other configs* ...);
рассмотрите следующий код в классе webservice.asmx
<WebMethod()> _
<ScriptMethod(ResponseFormat:=ResponseFormat.Xml)> _
Public Function getData(ByVal page As Integer, _
ByVal qtype As String, _
ByVal Query As String, _
ByVal rp As Integer, _
ByVal sortname As String, _
ByVal sortorder As String) As System.Xml.XmlDocument
'note these parameters are inputted to determine paging and constrains for the resultant rows
'Sample list to send to the grid
Dim list = New List(Of ApplicationStateInformation)
'Sample row object that holds name , surname , address, idnumber ...
list.Add(New RowObjects( "test1", "test1", "test1", "12345"))
list.Add(New RowObjects( "test2", "test2", "test2", "12345"))
list.Add(New RowObjects( "test3", "test3", "test3", "12345"))
list.Add(New RowObjects( "test4", "test4", "test4", "12345"))
'retun a xml doc, as we are using the xml format on the flexgrid
Dim returnDoc = New System.Xml.XmlDocument()
returnDoc.Load(New IO.StringReader(ToXmlResult(list)))
Return returnDoc
End Function
Private Function ToXmlResult(ByVal list As List(Of RowObjects)) As String
'this is the xml document format the grid understands
Dim result As String = "<?xml version=""1.0"" encoding=""utf-8""?>" & vbCrLf
result += "<rows>" & vbCrLf
result += String.Format("<page>{0}</page>" & vbCrLf, "1")
result += String.Format("<total>{0}</total>" & vbCrLf, "10")
For Each item In list
result += ConvertRowData(item)
Next
result += "</rows>" & vbCrLf
Return result
End Function
Private Function ConvertRowData(ByVal row As RowObjects) As String
Dim result As String = String.Format("<row id='{0}'>" & vbCrLf, row.IdNumber.ToString)
'THESE SHOULD BE HTML ENCODED (the format arg) but I left it out
result += String.Format("<cell><![CDATA[{0}]]></cell>" & vbCrLf, row.Name)
result += String.Format("<cell><![CDATA[{0}]]></cell>" & vbCrLf, row.Surname)
result += String.Format("<cell><![CDATA[{0}]]></cell>" & vbCrLf, row.IdNumber)
result += "</row>" & vbCrLf
Return result
End Function
Я думаю, что вы можете заставить jqgrid работать с json & amp; asp.net без изменения grid.base.js и других файлов jqgrid, вы должны использовать свойство datatype для определения вашего собственного пользовательского вызова ajax и определения считывателя json, затем jqgrid будет использовать ваш пользовательский вызов ajax и считыватель каждый раз, когда сетка перезагружается .
Процесс похож на xml, вы просто определяете xmlreader вместо jsonreader.
Все свойства jsonreader определены в онлайн-документации
Примеры пользовательских типов данных см. в разделе «Функция как тип данных». на демонстрационной странице в разделе " Новое в 3.3 "
Мое Орудие труда:
данные:"{'страница':'" + gdata.page + "','строки':'" + gdata.rows + "','sidx':'" + gdata.sidx + "','sord':'" + gdata.sord + "','nd':'" + gdata.nd + "','_search':'" + gdata._search + "','Поле поиска':'" + ts.p.searchdata.searchField + "','Строка поиска': '" + ts.p.searchdata.searchString + "','searchOper':'" + ts.p.searchdata.searchOper + "'}",
успех:функция (JSON, st) { if (st == "успех") { addJSONData(JSON.d, ts.grid.bDiv);if (loadComplete) { loadComplete();} }
При использовании полного события ajax используйте событие успеха.этот способ предотвращает двойную серализацию json.
Только одна вещь, которую я не понял при редактировании ячеек:Предположим, что я хочу отредактировать несколько ячеек с одинаковым типом данных (int).У меня есть только один веб-метод!и я не могу загрузить файл с тем же типом данных с другим именем!Кто-нибудь решает такого рода проблемы?
