@(Html.Kendo().Menu()
.Name("Menu")
.Items(items =>
{
items.Add()
.Text("Products - Expand me")
.Items(children =>
{
children.Add().Text("Furniture");
children.Add().Encoded(false).Text("<span class=\"k-icon k-i-clock\"></span>I have a Font Icon");
children.Add().Text("Decor");
});
items.Add().Text("Stores");
})
)
My app has a static footer bar, and in the bottom left of all pages I want to add a button which will launch the users "To Do List", ideally also down in the bottom left hand corner.
Obviously the content within that will be dynamic, and will likely be a list of items to attend to, groups by type, which will actually just be links off the various other pages.
What is the best way to achieve the pop up To Do List? I was looking at the Action Sheet, but the position / sizing is off, as I can only seem to have it open in the centre of the screen, or full width.
<div class="form-group">
Let's say I have a Telerik Wizard With Three Steps and I am passing a View Model to each step. In Step 1, A Telerik Form component would suffice. But, In Step 2, I need to have more specific control over the layout and function than what the Form Component provides. I would like to use custom MVC Razor View syntax for Step 2, for example:
<label asp-for="Title" class="control-label"></label>
<input asp-for="Title" class="form-control" />
<span asp-validation-for="Title" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Rating" class="control-label"></label>
<input asp-for="Rating" class="form-control" />
<span asp-validation-for="Rating" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="ReleaseDate" class="control-label"></label>
<input asp-for="ReleaseDate" class="form-control" />
<span asp-validation-for="ReleaseDate" class="text-danger"></span>
</div>Is this something that is possible and would I preserve the View Models state between steps? I'm not exactly finding a clear solution in the documentation. Any help or an example of how this could be done would be appreciated!
Based on step 2 in the solution in the following documentation: https://docs.telerik.com/aspnet-core/knowledge-base/grid-popup-editing-show-server-validation-errors
In order to get server side errors to display I would need to prevent databinding on the grid and then update grid elements. I would do this by first getting a reference to the grid via $("#gridName").
This would mean having a separate implemtation of this error handler for every grid in my application. Is there really no way of getting a reference to the grid or even the grid name from the error event itself?
I'd really like to avoid writing:
order_error_handler, orderline_error_handler, product_error_handler, product_category_error_handler, etc, etc. as this will be error prone and time consuming.
I have used partial views in many places, usually nested within a tab control, but also in some places nested inside a for EditorTemplate.
This was done using following type of code :
Html.Partial("_PartialViewName", Model)
Visual Studio was warning of :
MVC1000 : Use of IHtmlHelper.Partial may result in application deadlocks. Consider using <partial> Tag Helper or IHtmlHelper.PartialAsync.
So I went through and changed code where I could to :
awaits Html.PartialAsync("_PartialViewName", Model)
This works fine where the partial was within a tab control, or direct on the view but not when it's within an EditorTemplate on a form. Trying the same code gives this error :
The 'await' operator can only be used within an async lambda expression. Consider marking this lambda expression with the 'async' modifier.
I have tried a few things but nothing that VS will accept. Can it be done?
Thanks
Hy,
I am trying to display a list of data from an api model inside a TelerikGrid.
The api model is automatically generated and looks like this:
Data binding is done via a handler method in the razor page that return a JsonResult of the data list.
In this example below the column bind the property name "SalesGroup", but the bound method automatically resolves the name "salesGroup" (the name of JsonPropertyName attribute). Since the first letter is lowercase, the column does not display the value
I have currently created an extension of the Bound() method that resolves the correct name based on whether the "JsonPropertyName" attribute is present or not.
I would like to avoid using the "Bound(string memberName)" method.
Is there already a solution to my problem?
Thanks
I have build my parent child table grid by referring above link. Still i need to have check box for each row just like checkbox tree.
For that i need to bind my child row id in template, I tried as below.
Issue is:
At runtime, it is trowing error from child table by saying that it can not bind "OrderId" (No order id is not found).
Further i found out, This template only able to bind the date from parent data source only.
I installed the Telerik UI for ASP.Net Core R2 2020 version using the msi file. It installed successfully including the demo application under Kendo.Mvc.Examples folder. When I open the demo application Kendo.Mvc.Examples.csproj project in Visual Studio 2019 and build it so that there are no errors, then running the project in non-debug mode (i.e. Debug > Start without Debugging) always gives the following error. But, if I run the application in debug mode i.e. Debug > Start Debugging then it runs perfectly, and I can view the demo application in browser without any errors. I have given full security permissions to all users on my laptop for the folder Kendo.Mvc.Examples, and also, I have configured successfully the service dependencies of Secrets.json and a database file on localdb SQL Server.
Could you let me know why the installed demo runs only in debug mode? I looked at the logs in the Event Viewer and noticed an error message that doesn't tell much.
Error in browser as below when running the demo app in non-debug mode
When clicking the Add new record button on a grid from the Toolbar.Create method I am getting an error: kendo.all.js:3314 Uncaught TypeError: Cannot read properties of undefined (reading 'IsActive'). I'm using a ViewModel that is as follows:
public class PersonAddressViewModel
{
public List<PersonInfo>? PersonInfoList { get; set; }
public List<PersonAddress>? PersonAddressList { get; set; }
public PersonInfo? Person { get; set; }
public PersonAddress? Address { get; set; }
}
which is referencing these:
public partial class PersonInfo
{
[Key]
public int Id { get; set; }
[Required]
[StringLength(120)]
[Unicode(false)]
public string Name { get; set; }
public int Age { get; set; }
[Required]
[StringLength(10)]
[Unicode(false)]
public string Sex { get; set; }
[Required]
[StringLength(120)]
[Unicode(false)]
public string CreatedBy { get; set; }
public DateTime CreatedDate { get; set; }
[StringLength(120)]
[Unicode(false)]
public string? UpdatedBy { get; set; }
public DateTime? UpdatedDate { get; set; }
public bool IsActive { get; set; }
[InverseProperty("FkPersonInfoNavigation")]
public virtual ICollection<PersonAddress>? PersonAddresses { get; set; } = new List<PersonAddress>();
}
public partial class PersonAddress
{
[Key]
public int Id { get; set; }
[StringLength(120)]
[Unicode(false)]
public string StreetAddress { get; set; }
[StringLength(120)]
[Unicode(false)]
public string City { get; set; }
[StringLength(2)]
[Unicode(false)]
public string State { get; set; }
[StringLength(10)]
[Unicode(false)]
public string Zip { get; set; }
[Column("FK_PersonInfo")]
public int FkPersonInfo { get; set; }
[ForeignKey("FkPersonInfo")]
[InverseProperty("PersonAddresses")]
public virtual PersonInfo FkPersonInfoNavigation { get; set; }
}
This is my cshtml:
@(
Html.Kendo().DataSource<PersonAddressViewModel>()
.Name("DsPerAddVM")
.Ajax(datasource => datasource
.ServerOperation(false)
.Model(model =>
{
model.Id(perAdd => perAdd.Person.Id);
model.Field(perAdd => perAdd.Person.Id).Editable(false);
model.Field(perAdd => perAdd.Person.IsActive).DefaultValue(true);
model.Field(perAdd => perAdd.Person.Name).DefaultValue("Enter Name");
model.Field(perAdd => perAdd.Person.Age).DefaultValue(0);
model.Field(perAdd => perAdd.Person.Sex).DefaultValue("Optional");
model.Field(perAdd => perAdd.Person.CreatedBy).Editable(false).DefaultValue("Some User");
model.Field(perAdd => perAdd.Person.CreatedDate).Editable(false).DefaultValue(DateTime.Now);
model.Field(perAdd => perAdd.Person.UpdatedBy).Editable(false);
model.Field(perAdd => perAdd.Person.UpdatedDate).Editable(false);
model.Field(perAdd => perAdd.Address.Id).Editable(false);
model.Field(p => p.Address.FkPersonInfo).Editable(false);
})
.Read(read => read.Action("KendoRead", "Home"))
.Create(create => create.Action("KendoCreate", "Home"))
.Update(update => update.Action("KendoUpdate", "Home"))
.Destroy(destroy => destroy.Action("KendoDelete", "Home"))
)
)
<div>
@(
Html.Kendo().Grid<PersonAddressViewModel>()
.Name("UserGrid")
.Columns(columns =>
{
columns.Bound(perAdd => perAdd.Person.IsActive);
columns.Bound(perAdd => perAdd.Person.Name);
columns.Bound(perAdd => perAdd.Person.Age);
columns.Bound(perAdd => perAdd.Person.Sex);
columns.Bound(perAdd => perAdd.Address.StreetAddress);
columns.Bound(perAdd => perAdd.Address.City);
columns.Bound(perAdd => perAdd.Address.State);
columns.Bound(perAdd => perAdd.Address.Zip);
columns.Command(command => command.Destroy());
})
.ToolBar(toolbar =>
{
toolbar.Create();
toolbar.Save();
toolbar.Search();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Scrollable()
.DataSource("DsPerAddVM")
)
</div>
My grid loads the data as expected with the following methods (image attached):
public ActionResult KendoRead([DataSourceRequest] DataSourceRequest dsRequest)
{
List<PersonAddressViewModel> perAddList = KendoViewServices.GetGridData(_context);
return Json(perAddList.ToDataSourceResult(dsRequest));
}
public static List<PersonAddressViewModel> GetGridData(TestJohnCrudOpContext context)
{
context = context;
List<PersonAddressViewModel> perAddList = [];
PersonAddressViewModel GetPerAddVm = new()
{
PersonInfoList = [],
PersonAddressList = []
};
GetPerAddVm.PersonInfoList = context.PersonInfo.ToList();
GetPerAddVm.PersonAddressList = context.PersonAddresses.ToList();
foreach (PersonInfo person in GetPerAddVm.PersonInfoList)
{
PersonAddressViewModel perAddVm = new()
{
Person = new PersonInfo
{
Id = person.Id,
Name = person.Name,
Age = person.Age,
Sex = person.Sex,
CreatedBy = person.CreatedBy,
CreatedDate = person.CreatedDate,
UpdatedBy = person.UpdatedBy,
UpdatedDate = person.UpdatedDate,
IsActive = person.IsActive
}
};
foreach (PersonAddress address in GetPerAddVm.PersonAddressList.Where(w => w.FkPersonInfo == person.Id))
{
perAddVm.Address = new PersonAddress
{
Id = address.Id,
StreetAddress = address.StreetAddress,
City = address.City,
State = address.State,
Zip = address.Zip,
FkPersonInfo = address.FkPersonInfo
};
}
perAddList.Add(perAddVm);
}
perAddList.ToList();
return perAddList;
I've used this ViewModel to load and edit a standard HTML table with no issues. Also, updating the grid or performing a deletion works without error. I can tell that it is cutting off the first property of each field prior to the "." but I can't find a solution to correct this.
I'm just starting to catalog the issues list, but I'm immediately noticing that any markup passed to non-template areas has ceased rendering.
For example:
<div class="demo-section">
@(Html.Kendo().Switch()
.Name("switch")
.Messages(c => c.Checked("<span>YES</span>").Unchecked("<span>NO</span>"))
)
</div>
used to render the markup vs displaying the markup text. Now it spits it out.
I have used similar techniques in Grid commands as well, which are all also broken. Basic custom commands I can work around by using the .Template option instead of .Text, but for an Edit's UpdateText and CancelText, I cannot find a workaround that isn't completely unbearable to manage at anything remotely near scale.
Is there a workaround or option to re-enable rendering HTML in these places I am simply not seeing?
Also, this feels like a pretty significant change to bury inside of a generic "rendering mismatch" (which may not even be referring to this, but I cannot find anything in the breaking changes mentioning something like this change). If there's not an effective way to get back to this functionality, it's going to potentially cost me days/weeks to find a tenable solution.