Hi there,
I have a custom command column in my grid, as follows...
.Columns(columns =>
{
columns.Bound(b => b.Created_DisplayString);
columns.Bound(b => b.Closed_DisplayString);
columns.Command(command => command.Custom("Close or ReOpen").Click("onCloseReOpen"));
})
My viewmodel has a (readonly) property that returns either "Close" or "ReOpen" (as appropriate)
public string CloseOrReOpen
{
get
{
return (Closed_DateTime.HasValue ? "ReOpen" : "Close");
}
}
How can I bind the text of the Command button to this property pls. (instead of the current "Close or ReOpen")?
Thx,
Erik
Hello i have a Kendo core grid that has inline edit mode turned on with create update and destroy.
What i am trying to do is get the required validator to fire when you create/update and to my understanding you're supposed to use the [Required] attribute on the model that's populating the grid.
The problem is when i do that, my grid doesn't load, instead it immediately get an error saying X field is required and then my grid is left showing nothing in the datasource.
Note: The controller returns sucessfully
What is the issue?
Grid implementation:
@(Html.Kendo().Grid<AccessControlsModel>()
.Name("kgAdmin")
.Columns(columns =>
{
columns.Bound(col => col.PermissionID).Width(50).Hidden(true);
columns.Bound(col => col.UserID).Width(100);
columns.Bound(col => col.Initials).Width(50);
columns.Bound(col => col.Country).Width(50).ClientTemplate("#=Country#");
columns.Bound(col => col.Admin).Width(50).ClientTemplate("<input type='checkbox' #= Admin ? checked='checked':'' # class='chkbx admin'/>").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.PendingStatus).Width(50).ClientTemplate("<input type='checkbox' #= PendingStatus ? checked='checked':'' # class='chkbx pendingstatus' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.BOM).Width(50).ClientTemplate("<input type='checkbox' #= BOM ? checked='checked':'' # class='chkbx bom' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.ProcessSheet).Width(50).ClientTemplate("<input type='checkbox' #= ProcessSheet ? checked='checked':'' # class='chkbx processsheet' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.Matrix).Width(50).ClientTemplate("<input type='checkbox' #= Matrix ? checked='checked':'' # class='chkbx matrix' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.Quality).Width(50).ClientTemplate("<input type='checkbox' #= Quality ? checked='checked':'' # class='chkbx quality' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.Process).Width(50).ClientTemplate("<input type='checkbox' #= Process ? checked='checked':'' # class='chkbx process' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.Release).Width(50).ClientTemplate("<input type='checkbox' #= Release ? checked='checked':'' # class='chkbx release' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.Hold).Width(50).ClientTemplate("<input type='checkbox' #= Hold ? checked='checked':'' # class='chkbx hold' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.AddItem).Width(50).ClientTemplate("<input type='checkbox' #= AddItem ? checked='checked':'' # class='chkbx additem' />").Editable(@<text> function(e){ return false; } </text>);
columns.Bound(col => col.Reports).Width(50).ClientTemplate("<input type='checkbox' #= Reports ? checked='checked':'' # class='chkbx reports' />").Editable(@<text> function(e){ return false; } </text>);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
})
.NoRecords(c => c.Template("<strong> No data </strong>"))
.Sortable()
.Editable(editable =>
{
editable.Mode(GridEditMode.InLine);
})
.ToolBar(tools =>
{
tools.Search().Text("Search all fields...");
tools.Excel().HtmlAttributes(new { id = "save", @class = "k-button margin-left" });
tools.Create();
})
.Scrollable(c => c.Enabled(true))
.Resizable(resize => resize.Columns(true))
.Reorderable(r => r.Columns(true))
.Height(750)
.HtmlAttributes(new { style = "width:100%;" })
.DataSource(dataSource => dataSource
.WebApi()
.ServerOperation(false)
.Model(model =>
{
model.Id(p => p.PermissionID);
model.Field(p => p.UserID).DefaultValue("JEINC\\");
model.Field(f => f.Initials);
model.Field(f => f.Country);
})
.Events(events => {
events.RequestEnd("GridRequestEnd");
events.Error("error_handler");
})
.Read(read => read.Action("GetGridData", "Admin"))
.Create(create => create.Action("Create", "Admin"))
.Update(update => update.Action("Update", "Admin"))
.Destroy(destroy => destroy.Action("Delete", "Admin", new { Id = "{0}" }))
)
)
The model:
public class AccessControlsModel
{
public int PermissionID { get; set; }
[Required]
public string UserID { get; set; }
public string Initials { get; set; }
[UIHint("CountriesDDL")]
public string Country { get; set; }
public bool Admin { get; set; }
public bool PendingStatus { get; set; }
public bool BOM { get; set; }
public bool ProcessSheet { get; set; }
public bool Matrix { get; set; }
public bool Quality { get; set; }
public bool Process { get; set; }
public bool Release { get; set; }
public bool Hold { get; set; }
public bool AddItem { get; set; }
public bool Reports { get; set; }
}
The error (immediately on load of the grid)
Thanks in advance!
Tyler
Hi,
I am struggling to use core UI wizard with respect to my requirement. What I need from wizard control is to provide navigation (Next, Previous), load partial views and submit data to a form. Following is an example;
<form>
Step 1
Partial View 1
Step 2
Partial View 2
Finish (Form submission)
Hi,
I'm using a Donut Chart and would like to specify the Color via expression like the expressionValue and categoryExpression like so:
series .Donut(model => model.Count, model => model.Status, model => model.Color)
I've looked via source code and can see that the ChartSeries class does have a Color filed but with no way of specifying it.
Can you please recommend a fix/solution?
PS I am using remote data source.
Hello all,
Following the guidelines https://docs.telerik.com/kendo-ui/knowledge-base/fixed-headers-grid, I managed to create a stuck headers grid.
Nevertheless, I have the following two open points that are related with this.
Best regards,
Sotiris
Our customers like to take data from the grid, and put it in editors like notepad, excel, word or others...
Is there a way to copy the visible, or, all, the grid data to clipboard, as tab separated values? as in the attached picture
I have a Core grid that manages the Sol objects.
<div
class
=
"col-sm-12"
>
@(Html.Kendo().Grid(Model)
.Name(
"mySolsGrid"
)
.Columns(columns =>
{
columns.Bound(c => c.Nom).Width(140);
columns.Bound(c => c.Code).Width(190);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(172);
})
.ToolBar(
toolbar => {
toolbar.Create();
toolbar.Excel();
}
)
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable(scr=>scr.Height(430))
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error(
"error_handler"
))
.Model(model => model.Id(p => p.Id))
.Create(update => update.Action(
"Sols_Create"
,
"Sols"
))
.Read(read => read.Action(
"Sols_Read"
,
"Sols"
))
.Update(update => update.Action(
"Sols_Update"
,
"Sols"
))
.Destroy(update => update.Action(
"Sols_Destroy"
,
"Sols"
))
)
)
</div>
This is my controller:
[AcceptVerbs(
"Post"
)]
public
async Task<ActionResult> Sols_CreateAsync([DataSourceRequest] DataSourceRequest request, SolDTO solDto)
{
SolDTO idOnly = solDto;
if
(solDto !=
null
&& ModelState.IsValid)
{
idOnly = await _solService.CreateAsync(solDto);
}
return
Json(
new
[] { idOnly }.ToDataSourceResult(request, ModelState));
}
this is my Service returning object:
public
async Task<SolDTO> CreateAsync(SolDTO solDto)
{
var sol = _mapper.Map<Sol>(solDto);
await _userService.SetCreatedByCurrentUserNowAsync(sol);
sol = await _repository.AddAsync(sol);
var dto = _mapper.Map<SolDTO>(sol);
return
dto;
}
I return here the ID that is not 0. However each time I add a new object (i click on update button) it calls the Create function one more time. First call once, second twice etc.
Does the Async method have something to do with that?
what is that
source = Regex.Replace(source, @
"\$\(document\)\.on\("
"kendoReady"
","
,
"$(document).ready("
, RegexOptions.Multiline);
in the ASP.NET Core Examples code?
Should I understand that all the document.on('kendoReady' in fact should not be used, and instead "document.Ready" should be used ?
How a developer that usually copies only parts of examples should guess that hack?
I try to implement a simple databinding in the Spreadseet, in an ASP.NETCore MVC application.
I read this article, "Specific behavior"
There it says in the first point : "Column headers are inferred from the data item fields. Configure the column headers and ordering by using the sheet setDataSource method."
The link on setDataSource goes to DataSource method of the jQuery (?!) component ...I didn't find any setDataSource in exemple code from github, there is a DataSource method, however it does not work locally...
please bring some clearly on how to bind the datasource with a simpler example maybe?
I can put my example here, I just try to bind to a datasource to display a "name" and "id", but it does not work, it reads the data from the server, but does not display that json collection that I return in the sheet.
001.
<
div
class
=
"row"
>
002.
<
div
class
=
"col-sm-12"
>
003.
<
div
id
=
"example"
>
004.
<
script
src
=
"https://kendo.cdn.telerik.com/2021.1.330/js/jszip.min.js"
></
script
>
005.
006.
<
div
class
=
"configurator"
>
007.
<
div
class
=
"header"
>Configurator</
div
>
008.
<
div
class
=
"box-col"
>
009.
<
h4
>Save data changes</
h4
>
010.
<
ul
class
=
"options"
>
011.
<
li
>
012.
<
button
id
=
"save"
>Save changes</
button
>
013.
<
button
id
=
"cancel"
>Cancel changes</
button
>
014.
</
li
>
015.
</
ul
>
016.
</
div
>
017.
</
div
>
018.
019.
@(Html.Kendo().Spreadsheet()
020.
.Name("spreadsheet")
021.
.HtmlAttributes(new { style = "width:100%" })
022.
.Toolbar(false)
023.
.Sheetsbar(false)
024.
.Events(e => e
025.
.DataBinding("onDataBinding")
026.
.DataBound("onDataBound")
027.
)
028.
.Excel(excel => excel
029.
.ProxyURL(Url.Action("Index_Save", "Entreprises"))
030.
)
031.
.Pdf(pdf => pdf
032.
.ProxyURL(Url.Action("Index_Save", "Entreprises"))
033.
)
034.
.Sheets(sheets =>
035.
{
036.
sheets.Add()
037.
.Name("Products")
038.
.DataSource<
EntrepriseDTO
>(ds => ds
039.
.Custom()
040.
.Batch(true)
041.
.Transport(t => t
042.
.Read("onRead")
043.
.Submit("onSubmit")
044.
)
045.
.Events(e => e.Change("onChange"))
046.
.Schema(s => s
047.
.Model(m =>
048.
{
049.
m.Id(p => p.Id);
050.
})
051.
)
052.
)
053.
.Columns(columns =>
054.
{
055.
columns.Add().Width(100);
056.
columns.Add().Width(415);
057.
columns.Add().Width(145);
058.
columns.Add().Width(145);
059.
columns.Add().Width(145);
060.
columns.Add().Width(145);
061.
})
062.
.Rows(rows =>
063.
{
064.
rows.Add().Height(40).Cells(cells =>
065.
{
066.
cells.Add()
067.
.Bold(true)
068.
.Background("#9c27b0")
069.
.TextAlign(SpreadsheetTextAlign.Center)
070.
.Color("white");
071.
072.
cells.Add()
073.
.Bold(true)
074.
.Background("#9c27b0")
075.
.TextAlign(SpreadsheetTextAlign.Center)
076.
.Color("white");
077.
078.
cells.Add()
079.
.Bold(true)
080.
.Background("#9c27b0")
081.
.TextAlign(SpreadsheetTextAlign.Center)
082.
.Color("white");
083.
084.
cells.Add()
085.
.Bold(true)
086.
.Background("#9c27b0")
087.
.TextAlign(SpreadsheetTextAlign.Center)
088.
.Color("white");
089.
090.
cells.Add()
091.
.Bold(true)
092.
.Background("#9c27b0")
093.
.TextAlign(SpreadsheetTextAlign.Center)
094.
.Color("white");
095.
096.
cells.Add()
097.
.Bold(true)
098.
.Background("#9c27b0")
099.
.TextAlign(SpreadsheetTextAlign.Center)
100.
.Color("white");
101.
});
102.
});
103.
})
104.
)
105.
</
div
>
106.
</
div
>
107.
</
div
>