In this dojo I want to have a button to select the next and previous tabs(wizard navigation). The buttons work if the user clicks them slowly.
If the next button is clicked say 5 times rapidly, the tabstrip will only select up until the 2nd or 3rd tab instead of going all the way to the end.
I am using the asp.net core version of kendo but the jquery version is easier to show in the dojo and represents my problem.
https://dojo.telerik.com/EWALijil
Is there a way outside of disabling the button/debouncing/ or timeouts to get the tabstrip to queue any selects and use the final?
I insert a image to the sheet, and transform sheet to datauri format. I get a error message.
function SaveElnFile(e) {
var spreadSheet = GetSpreadsheet("ElnMain");
var sheet = spreadSheet.activeSheet();
spreadSheet.bind("excelExport", function (e) {
var fileName = "ElnTemplate/" + GetDateTimeString() + ".xlsx";
e.workbook.fileName = fileName;
var workbook = new kendo.ooxml.Workbook({
sheets: e.workbook.sheets
});
workbook.toDataURLAsync().then(function (dataURL) {
xxxxxx....
});
e.preventDefault();
});
spreadSheet.saveAsExcel();
}
I don't think I'm alone in saying that it would be nice to see better docs, maybe even an entire separate section for this library that was Raorpages-specific.
Would be nice to see such things as:
- Client template examples
- Different ways of loading & customizing the grid
- Common problems and their solutions
I recently upgraded my project to ASP NET Core 3.2 and now my grids are returning undefined. I've found a couple threads about this, but nothing that has worked for me so far. I have an enumerable defined object that I'm creating in my AJAX LoadData method to load my data and returning. What am I doing wrong?
index.cshtml
<ejs-grid id="Grid" allowPaging="true" allowSorting="true" allowFiltering="true">
<e-data-manager url="/Routes/LoadData" updateUrl="/Routes/UpdateData" adaptor="UrlAdaptor"></e-data-manager>
<e-grid-columns>
<e-grid-column field="Name" headerText="Name" allowSorting="true"></e-grid-column>
<e-grid-column field="Frequency.Name" headerText="Frequency" type="string"></e-grid-column>
<e-grid-column field="DayOfWeek.Name" headerText="Day" type="string"></e-grid-column>
<e-grid-column field="TimeOfDay.TimeString" headerText="Time"></e-grid-column>
<e-grid-column field="RouteId" headerText="" template="#edittemplate"></e-grid-column>
</e-grid-columns>
</ejs-grid>
<script id="edittemplate" type="text/x-template">
<div>
<a rel='nofollow' href="/Routes/Edit/${RouteId}">Edit</a> |
<a rel='nofollow' href="/Routes/Details/${RouteId}">Details</a> |
<a rel='nofollow' href="/Routes/Delete/${RouteId}">Delete</a>
</div>
</script>
Controller
public IActionResult LoadData([FromBody]DataManagerRequest dm)
{
var sa = new JsonSerializerSettings();
IEnumerable<Route> DataSource = _context.Route
.Include(r => r.DayOfWeek)
.Include(r => r.Frequency)
.Include(r => r.TimeOfDay)
.ToList();
DataOperations operation = new DataOperations();
if (dm.Search != null && dm.Search.Count > 0)
{
DataSource = operation.PerformSearching(DataSource, dm.Search); //Search
}
if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting
{
DataSource = operation.PerformSorting(DataSource, dm.Sorted);
}
if (dm.Where != null && dm.Where.Count > 0) //Filtering
{
DataSource = operation.PerformFiltering(DataSource, dm.Where, dm.Where[0].Operator);
}
int count = DataSource.Cast<Route>().Count();
if (dm.Skip != 0)
{
DataSource = operation.PerformSkip(DataSource, dm.Skip); //Paging
}
if (dm.Take != 0)
{
DataSource = operation.PerformTake(DataSource, dm.Take);
}
return Json(new { result = DataSource, count = _context.Route.Count() });
}
Have a razorpages app started and several areas of a view have various dropdowns etc that gather a users selections. These selections are then used as inputs to grab data for a grid. Ok, easy enough, my example is working so far. However, so far I have only got to the point of LOADING my grid, now I need to handle updates/deletes etc.
Im looking over the examples, both frm the kendo project template and from this github project
https://github.com/telerik/ui-for-aspnet-core-examples/blob/master/Kendo.Examples.RazorPages/Kendo.Examples.RazorPages/Pages/Grid/GridCrudOperations.cshtml
Ok, some general questions and observations:
(1) These examples assume that criteria for getting the grid data is known at execution time. In my case I need to gather several inputs before fetching the data for the grid. Im doing this now, then loading the grid with json and javascript and it works. However, now I need to handle updating/deleting etc
(2) What is the purpose of the .Data methods on the Datasource crud methods eg. and where is this Data method in the docs as used here?
.DataSource(ds => ds.Ajax()
.Read(r => r.Url("/Index?handler=Read").Data("forgeryToken"))
.Update(u => u.Url("/Index?handler=Update").Data("forgeryToken"))
.Create(c => c.Url("/Index?handler=Create").Data("forgeryToken"))
.Destroy(d => d.Url("/Index?handler=Destroy").Data("forgeryToken"))
.Model(m => m.Id(id => id.OrderID))
.PageSize(10)
(3) If I want to handle "batch" editing, AND I load the Dataset via JSON with javascript, how then does the .Read and other datasource method(s) need to change?
eg. this example ,
https://demos.telerik.com/aspnet-core/grid/editing
so to load the product grid then
function
testLoadDS() {
var
testObj = [{
"OrderID"
:
"1"
,
"Freight"
:
"10.1"
,
"OrderDate"
:
"10/19/2019"
,
"ShipCity"
:
"Austin"
,
"ShipName"
:
"Test123"
}];
let productDS = $(
"#grid"
).data(
"kendoGrid"
).dataSource;
productDS.data(testObj);
}
So then, this example, what things need to change from in-line to batch editing?
https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/Kendo.Examples.RazorPages/Kendo.Examples.RazorPages/Pages/Grid
In this example
https://demos.telerik.com/aspnet-core/grid/editing
How could one show a image button instead of a command type button for the delete function?
Also, similar to the last question - will this example work with partial page updates? In other words will the updating of the grid cause the entire view its contained within to be refreshed?
I want to export the current sheet to xlsx and send it to the server. I use excel proxy to send the file to server. but when the server side process done. the ui will auto refresh. I want to receive the return value and not refresh the UI, how can I do this, please help.
server side code:
[HttpPost]
public ActionResult Post()
{
try
{
var data = Request.Form;
var file = data["base64"][0];
var fileName = data["fileName"][0];
var contentType = data["contentType"][0];
byte[] buffer = Convert.FromBase64String(file);
string filePath = FileHelper.MapPath("/wwwroot/UserUpload/" + fileName);
FileStream fs = new FileStream(filePath, FileMode.CreateNew);
fs.Write(buffer, 0, buffer.Length);
fs.Close();
return new JsonResult("OK");
}
catch (Exception e)
{
return new JsonResult("Fail");
}
}
If one has a grid on a section of a page and follows the approach with inline editing, as in this example, will just the grid update and NOT the entire view?
https://demos.telerik.com/aspnet-core/grid/editing-inline