我只想在必要时显示我的剑道网格的滚动条。这是我的网格初始化:
@(Html.Kendo().Grid<UT.Repo.Core.up_HedgedCustomerLatestTradeListGet_Result>()
.Name("lastPositionsGrid")
.Columns(columns =>
{
columns.Bound(c => c.ACCOUNT).Title("Hesap").Width(70);
columns.Bound(c => c.TICKET).Title("Emir");
columns.Bound(c => c.SIDE).Title("Yön").Width(50);
columns.Bound(c => c.STATE).Title("Durum").Width(65);
columns.Bound(c => c.SYMBOL).Title("Sembol");
columns.Bound(c => c.VOLUME).Title("Hacim").Width(65);
columns.Bound(c => c.OPENPX).Title("Açılış");
columns.Bound(c => c.CLOSEPX).Title("Kapanış");
columns.Bound(c => c.P_L).Title("Kar Zarar").Width(75);
columns.Bound(c => c.SL).Title("Zararı Durdur");
columns.Bound(c => c.TP).Title("Karı Al");
columns.Bound(c => c.TIME).Title("Zaman").ClientTemplate("#= kendo.toString(TIME, \"dd/MM/yyyy HH:mm:ss\") #").Width(160);
})
.Scrollable()
.Sortable()
.Resizable(resize => resize.Columns(true))
.Events(events => events.DataBound("onLastPositionsGridDataBound"))
.DataSource(dataSource => dataSource
.Ajax()
.Sort(sort => sort.Add("TIME").Descending())
.Read(read => read.Action("HedgedCustomerLatestTradeListGet", "Home"))
)
)
在数据绑定(bind)上,我试图设置滚动条的可见性:
function onLastPositionsGridDataBound(e) {
var gridHeight = $("#lastPositionsGrid").outerHeight();
var gridHeaderHeight = $("#lastPositionsGrid table:eq(0)").outerHeight();
var gridBodyHeight = $("#lastPositionsGrid table:eq(1)").outerHeight();
if (gridHeight < gridHeaderHeight + gridBodyHeight) { // show the scrollbar
$("#lastPositionsGrid .k-grid-header").css('padding', '');
$("#lastPositionsGrid .k-grid-header").css('padding-right', '17px');
$("#lastPositionsGrid .k-grid-content").css('overflow-y','scroll');
}
else { // hide the scrollbar
$("#lastPositionsGrid .k-grid-header").css('padding','0 !important');
$("#lastPositionsGrid .k-grid-content").css('overflow-y', 'visible');
}
}
隐藏滚动条的部分可以很好地工作,但显示滚动条的部分却不行。这是显示滚动条后的屏幕截图:
如您所见,这些行将标题中的单元格分开,并且行不适合。我该如何解决?
最佳答案
这会起作用,总是尝试自动溢出。
function onLastPositionsGridDataBound(e) {
var gridHeight = $("#lastPositionsGrid").outerHeight();
var gridHeaderHeight = $("#lastPositionsGrid table:eq(0)").outerHeight();
var gridBodyHeight = $("#lastPositionsGrid table:eq(1)").outerHeight();
if (gridHeight < gridHeaderHeight + gridBodyHeight) { // show the scrollbar
$("#lastPositionsGrid .k-grid-header").css('padding', '');
$("#lastPositionsGrid .k-grid-header").css('padding-right', '17px');
$("#lastPositionsGrid .k-grid-content").css('overflow-y','auto');
}
else { // hide the scrollbar
$("#lastPositionsGrid .k-grid-header").css('padding','0 !important');
$("#lastPositionsGrid .k-grid-content").css('overflow-y', 'auto');
}
}
关于javascript - 隐藏/显示剑道网格滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35695301/