Forum
Bildirimler
Hepsini Temizle
Yazılım Genel
2
Yazılar
2
Üyeler
0
Reactions
1,093
Görüntüleme
Konu başlatıcı
Merhaba,
Asp.net MVC teknolojisini kullanarak bir proje geliştiriyorum. Projemde sql tabanlı olarak sakladığım verileri modern bir grid üzerinde yansıtmaya çalışıyorum. Bunun için Jtable, Jqgrid gibi geliştirilmiş gridleri denedim fakat veri bağlantısı json ile kurulduğundan sıkıntı yaşıyorum. Araştırmama rağmen pek sağlıklı bir makale de bulamadım açıkçası. Gerekli görüntü geliyor fakat veriler yok. Bu konuda bana yol gösterebilecek bir kaynak arıyorum(kitap olur, makale olur). Daha önce kullanan arkadaşlar bana yol gösterebilir mi? Ya da önerebileceğiniz kolay ve gelişmiş yapılı bir grid var mıdır?
Gönderildi : 10/03/2014 19:08
Merhaba,
Ben kendoGrid kullanıyorum.
örnek kodum şu şekilde :
<div id="categories-grid"></div>
<script>
$(document).ready(function () {
$("#categories-grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: {
url: "@Html.Raw(Url.Action("List", "Category"))",
type: "POST",
dataType: "json",
data: additionalData
}
},
schema: {
data: "Data",
total: "Total",
errors: "Errors"
},
error: function(e) {
display_kendoui_grid_error(e);
// Cancel the changes
this.cancelChanges();
},
pageSize: @(gridPageSize),
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
pageable: {
refresh: true
},
editable: {
confirmation: false,
mode: "inline"
},
scrollable: false,
columns: [{
field: "Breadcrumb",
title: "Name"
}, {
field: "Published",
title: "Published",
width: 100,
headerAttributes: { style: "text-align:center" },
attributes: { style: "text-align:center" },
template: '<img src="@Url.Content("~/Content/images/")active-#=Published#.gif" />'
}, {
field: "DisplayOrder",
title: "DisplayOrder",
width: 100
}, {
field: "Id",
title: "Admin.Common.Edit",
width: 100,
template: '<a href="Edit/#=Id#">Edit</a>'
}]
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
//search button
$('#btnSearch').click(function () {
//search
var grid = $('#categories-grid').data('kendoGrid');
grid.dataSource.page(1); //new search. Set page size to 1
grid.dataSource.read();
return false;
});
$("#@Html.FieldIdFor(model => model.SearchCategoryName)").keydown(function (event) {
if (event.keyCode == 13) {
$("#btnSearch").click();
return false;
}
});
});
function additionalData() {
return {
SearchCategoryName: $('#@Html.FieldIdFor(model => model.SearchCategoryName)').val()
};
}
</script>
Control kısmı
public ActionResult List()
{
var model = new CategoryListModel();
return View(model);
}
[HttpPost]
public ActionResult List(DataSourceRequest command, CategoryListModel model)
{
if (!_permissionService.Authorize(StandardPermissionProvider.ManageCategories))
return AccessDeniedView();
var categories = GetAllCategories(model.CategoryName,
command.Page - 1, command.PageSize, true);
var gridModel = new DataSourceResult
{
Data = categories.Select(x =>
{
var categoryModel = x.ToModel();
return categoryModel;
}),
};
return Json(gridModel);
}
Gönderildi : 11/03/2014 15:45
