or
0 answers
35 views
Hello,
I was wondering if there is a way to change the asp.net mvc data grid checkbox selection option's image from a checkbox to say, a star.
Or would I need to essentially rebuild the functionality through a custom template?
Thanks
Jimmy
Top achievements
Rank 1
Rank 1
asked
on
02 Nov 2023
2 answers
920 views
All the styling is broken, using bootstrap. I noticed a massive change in the files in Content/kendo/2023.1.314 (i.e. none of the previous files I had linked to actually exist anymore). I upgraded from 2023.1.117. Do I use bootstrap-4.css or bootstrap-main.css or what?
I ran the upgrade wizard and there was nothing about such massive changes.
Where's the documentation on these changes? Happy to read up but I couldn't find anything?
This is disgraceful for a minor upgrade to break/change everything so drastically.
Anton Mironov
Telerik team
answered
on
24 Mar 2023
0 answers
79 views
Hi, after following the guide on setting the colour of tasks on data binding, which worked great, we have noticed an issue. If we have something like the following tree
Level 1
-- Level 2
---- Level 3
---- Level 4
Level 5
Level 6
If level 3 and 4 have a background colour set to say purple.... its working fine, but if we collapse Level 2, Level 5 and 6 have the background colour changed to purple as Level 3 and 4 would have been.
From looking at the source code, Levels 5 and 6 seem to replace the details in the rows for Level 3 and 4 but don't change the styling used. What we need to do is on collapsing the level, we need to repaint the rows to refresh the styling.
Is there any event we can use to detect the expanding / collapsing function so i can call another function which repaints the displayed tasks? I've included 2 screenshots which demonstrate the behaviour.
1 answer
177 views
Hi, I saw earlier posts about this, but this for an (MVC5 grid, VS 2019, Latest version)
I have no java script errors as suggested as a solution from 2014 posts.
I load the Telerik MVC grid partial view into a div 'lcContent' using $("#lcContent").load(url);
Tried it in both chrome and edge, seems the scrolling is fine if I run it stand alone (i.e. not inside the the confines of the lcContent div)
Thx
I have
In my _Layout file
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
<link rel="shortcut icon" href="@Url.Content("~/favicon.ico")" ; />
<link href="https://cdn.kendostatic.com/2022.2.621/styles/kendo.classic-silver.min.css" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="https://cdn.kendostatic.com/2022.2.621/js/jquery.min.js"></script>
<script src="https://cdn.kendostatic.com/2022.2.621/js/jszip.min.js"></script>
<script src="https://cdn.kendostatic.com/2022.2.621/js/kendo.all.min.js"></script>
<script src="https://cdn.kendostatic.com/2022.2.621/js/kendo.aspnetmvc.min.js"></script>
<script src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>
</head>
and in the Index view a side bar menu (UL + Li) and a content pane, as per beneath
with
.lcContent {transition: margin-left .5s;
padding: 10px;
height: 900px;
width: 90%;
display: block;
overflow-y: hidden;
overflow-x: hidden;
left: 0px;
}
<style>
button.k-button {
background-color: darkgrey !important;
color: forestgreen
}
.k-grid-toolbar {
/* background-color: lightslategrey !important;*/
}
th.k-header {
color: white;
background-color: darkslategray !important;
}
div.k-grouping-header {
background-color: gainsboro !important;
}
tr.k-master-row {
background-color: white !important;
color: blue;
}
tr.k-master-row:active, tr.k-master-row:hover {
background-color: lightgrey !important;
}
tr.k-alt {
color: white;
background-color: lightcyan !important;
color: darkblue;
}
span.k-icon, k-i-filter {
background-color: gainsboro !important;
}
tr.k-alt:active, tr.k-alt:hover {
color: darkblue !important;
background-color: lightgrey !important;
}
input.k-input-inner {
/* background-color: gainsboro !important;*/
}
span.k-filtercell {
/*background-color: red !important;*/
}
th {
background-color: lightslategray !important;
}
span.k-operator-hidden {
display: none;
}
div.k-grid-content {
/* height: 80% !important;*/
}
.k-grid tbody tr {
line-height: 14px;
}
.k-grid tbody td {
padding: 0;
}
.k-grid {
overflow-y: hidden;
height: 900px;
min-height: 600px;
/* width: 2700px;
max-width: 2800px;*/
width: 98%;
max-width: 99%;
padding-left: 10px;
}
.k-button{ }
.k-grid-Edit{ }
td.k-command-cell{ }
.k-button-text{ }
.k-filter-row{ /* has multiple th beneath it, with a span in them, with k-filter-cell class*/
}
</style>
<div id="lcContent" class="lcContent" >
<div class="text-left" style=" width: 100%;">
@(Html.Kendo().Grid(Model)
.Name("LeasedTenements")
.Reorderable(reorder => reorder.Columns(true))
.Columns(columns =>
{
columns.Command(command => command.Custom("Edit").Click("Edit")).Width(180);
columns.Bound(c => c.ID).Hidden();
columns.Bound(c => c.Lease).Width(150).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
columns.Bound(c => c.Name).Width(150).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
columns.Bound(c => c.LocalityType).Width(250).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
columns.Bound(c => c.Locality).Width(250).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
columns.Bound(c => c.Status).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
columns.Bound(c => c.InternalStatus).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
columns.Bound(c => c.CurrentArea).Width(250).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
columns.Bound(c => c.AreaType).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
columns.Bound(c => c.MineralField).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
columns.Bound(c => c.Commodity).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
columns.Bound(c => c.GovtOffice).Width(200);
columns.Bound(c => c.AppliedArea).Width(200);
columns.Bound(c => c.GrantedArea).Width(200);
columns.Bound(c => c.AreaSurveyed).Width(100);
columns.Bound(c => c.CurrentCommitment).Width(200);
columns.Bound(c => c.NextYearCommitment).Width(200);
columns.Bound(c => c.CurrentRent).Width(200);
columns.Bound(c => c.NextYearRentAmount).Width(200);
columns.Bound(c => c.NextYearRentAmount).Width(200);
columns.Bound(c => c.Project).Width(200);
columns.Bound(c => c.CostCode).Width(150);
columns.Bound(c => c.ManagingCompany).Width(200);
columns.Bound(c => c.Operator).Width(200);
columns.Bound(c => c.LeaseManager).Width(200);
columns.Bound(c => c.ResponsibleParty1).Width(200);
columns.Bound(c => c.ResponsibleParty2).Width(200);
columns.Bound(c => c.Region).Width(200);
columns.Bound(c => c.TotalShares).Width(150);
columns.Bound(c => c.Comments).Width(200);
columns.Bound(c => c.LastUpdate).Width(10);
columns.Bound(c => c.ByWhom).Width(150);
columns.Bound(c => c.LinkLeaseID).Width(150);
})
.ToolBar(toolbar =>
{
toolbar.Excel();
toolbar.Create();
toolbar.Save();
})
.HtmlAttributes(new { style = "width: 99%;" })
.Scrollable()
.Groupable()
.Sortable()
.Editable(editable => editable.Mode(GridEditMode.InCell))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Model(model =>
{
model.Id(p => p.ID);
model.Field(p => p.ID).Editable(false);
model.Field(p => p.Lease).Editable(true);
model.Field(p => p.Lease).DefaultValue(
ViewData["defaultObjections"] as Demo.Mvc.ViewModels.vmTenementObjected);
model.Field("GrantDate", typeof(DateTime));
model.Field("GrantArea", typeof(int));
})
.Create(create => create.Action("EditingCustom_Create", "Objections"))
.Update(update => update.Action("EditingCustom_Update", "Objections"))
.Destroy(destroy => destroy.Action("EditingCustom_Destroy", "Objections"))
)
.Filterable(ftb => ftb.Mode(GridFilterMode.Row))
.Reorderable(reorderable => reorderable.Columns(true))
)
</div>
</div>
1 answer
274 views
This is kendo ui for asp.net mvc. In the past I have used float:right to move menu items and gridtoolbar items to the right side, but that no longer works. For example:
.ToolBar(toolbar =>
{
toolbar.Search();
toolbar.Custom()
.Text("Clear Filters/View All")
.Url("#")
.HtmlAttributes(new { id = "btnClearFilters", @class="btn btn-link", onclick = "btnClearFiltersClick()" });
toolbar.Custom()
.Text("New Order")
.Url("#")
.IconClass("k-icon k-i-add")
.HtmlAttributes(new { id = "btnNew", style = "float:right;", onclick = "btnNewClick()" });
toolbar.Custom()
.Text("Copy Order")
.Url("#")
.IconClass("k-icon k-i-copy")
.HtmlAttributes(new { id = "btnCopy", style = "float:right;margin-right:20px;", onclick = "btnCopyClick()", disabled = "disabled" });
})
2 answers
294 views
Hello everybody,
im trying to achieve that the dropdown filter list in my grid takes the size from it's biggest option.
I found other explanations for different situations and none of those worked for me.
I have a MVC Grid with a ForeignKey Column, that is filtered with a dropdown of enum values.
x.ForeignKey(b => b.Status, Model.OrderGapStatus).Filterable(f => f.Cell(c => c.Template("statusFilter"))).Title(Localizer.Lang_Status).ClientTemplate("#: StatusName #");And a js handler trying to set the width to "auto". But it doesn't work :/
<script type="text/javascript">
function statusFilter(element) {
// what do i need to do here?
}
</script>Help would be really appreciated 😃
Have a good day & happy coding
Nils
Nils
Top achievements
Rank 1
Veteran
Iron
Rank 1
Veteran
Iron
answered
on
17 May 2021
