I am creating a grid on the fly in javascript which has a locked column. In the header, the locked column is almost 800px right of where it should be, while the row is aligned properly. I can apply a -800px margin-left to fix it, but I really shouldn't have to. Can anyone provide any insight as to why this is happening?
@(Html.Kendo().DatePicker().Name("txt_" + Model.QuestionID.ToString()).Value(Model.AnswerModel.AnswerText).Format("dd-MM-yyyy").DateInput() .Popup(p => { p.Origin("bottom right"); p.Position("top right"); }) .Deferred().HtmlAttributes(new { style = "width:100%", @id = "txt_" + Model.QuestionID.ToString(), pattern = pattern }))I have a kendo grid in an asp .net MVC application.
I Set a ClientDetailTemplateId in the grid that contains a one TabStrip HtmlHelper extension.
The Grid is showing up with the correct data.
but not when i want to display chekcbox column instead true/false.
I have a boolean columns in my two grids that i want to display as a checkbox instead true/false.
using
columns.Bound(p => p.isActif).Title("Actif").Width(60)..ClientTemplate("<input type='checkbox' disabled='disabled' #= isActif ? checked='checked': '' # />"); // this is work in my principle grid but i'm trying to do the same in my grid view detailtemplate ..it generates errors !!
any help is greatly appreciated

I have a gridview with many checkbox rows that i want to update these rows by calling a controller action after clicking a button.
I retrieve correctly the data.
I am using telerik UI in asp.net MVC
<div class="form-group">
<div class="form-row">
@(Html.Kendo().Grid<mySolution.Models.AutorisationsModel>()
.Name("gridPerm")
.Columns(columns =>
{
columns.Bound(o => o.Autorisation_ID).Title("id").Hidden();
columns.Bound(o => o.Module).Title("Module");
columns.Bound(o => o.Autorisation_READ).Title("Visible").Width(100).ClientTemplate("<input type='checkbox' #= PERM_READ ? checked='checked': '' # class='chkbx' />").HtmlAttributes(new { style = "text-align: center" });
columns.Bound(o => o.Autorisation_CREATE).Title("Créer").Width(100).ClientTemplate("<input type='checkbox' #= PERM_CREATE ? checked='checked': '' # class='chkbx' />").HtmlAttributes(new { style = "text-align: center" });
columns.Bound(o => o.Autorisation_DELETE).Title("Supprimer").Width(100).ClientTemplate("<input type='checkbox' #= PERM_DELETE ? checked='checked': '' # class='chkbx' />").HtmlAttributes(new { style = "text-align: center" });
columns.Bound(o => o.Autorisation_MODIFY).Title("Modifier").Width(100).ClientTemplate("<input type='checkbox' #= PERM_MODIFY ? checked='checked': '' # class='chkbx' />").HtmlAttributes(new { style = "text-align: center" });
columns.Bound(o => o.Autorisation_LIST).Title("Lister").Width(100).ClientTemplate("<input type='checkbox' #= PERM_LIST ? checked='checked': '' # class='chkbx' />").HtmlAttributes(new { style = "text-align: center" });
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(m => m.Autorisation_ID);
model.Field(m => m.Module).Editable(false);
model.Field(m => m.Autorisation_READ).Editable(true);
model.Field(m => m.Autorisation_CREATE).Editable(true);
model.Field(m => m.Autorisation_DELETE).Editable(true);
model.Field(m => m.Autorisation_MODIFY).Editable(true);
model.Field(m => m.Autorisation_LIST).Editable(true);
})
.Read(read => read.Action("Autorisations_Read", "Autorisations", new { Id = Model.Auto_ID }))
)
.Sortable()
.Scrollable()
.Height(400)
)
</div>
</div>
<div class="form-group">
<div class="form-row">
<div class="col-md-12" style="text-align: right;">
<input type="submit" id="confirmEdit" value="Enregister" class="mr-1 mb-1 btn btn-primary" />
@Html.ActionLink("Retour", "Autorisations_List", "Autorisations", null, new { @class = "mr-1 mb-1 btn btn-secondary" })
</div>
</div>
</div>

I use sass theme builder as my kendo style.
I only include the generated css from theme builder, I don't include any common or bootstrap css.
When I tried to use text editor on my form, what I got is (see the attached file 1) while in the theme builder the text editor is nice (see the attached file 2).
As you can see in the toolbar,
On my side it renders as <a> tag
On theme builder it renders as <button> tag.
Does anyone know why?
I used the instructions from here: https://docs.telerik.com/aspnet-mvc/html-helpers/data-management/grid/faq#how-can-i-use-action-links
... and the code below works just fine, however this creates a GET. How can change it to create a POST?
Here is my code:
columns.Bound(c => c.InvoiceAmount) .Format("{0:C}") .Width(100) .Title("Invoiced") .HtmlAttributes(new { @style = "text-align:right;color:blue;" }) .ClientGroupHeaderColumnTemplate("#= kendo.format('{0:C}',sum)#") .ClientTemplate("<a href='/PurchaseInvoice/Index?StatusIDFrom=1&StatusIDTo=250&ProjectID=#=ProjectID#&SupplierID=#=SupplierID#&DateFrom=#= kendo.toString(DateFrom,'yyyy-MM-dd') #&DateTo=#= kendo.toString(DateTo,'yyyy-MM-dd') #'>#= kendo.format('{0:C}',InvoiceAmount)#</a>") .ClientFooterTemplate("<div style='text-align:right;color:blue;'><a href='" + Url.Action("Index", "PurchaseInvoice?ProjectID=#=projectID#")+"'>#= kendo.format('{0:C}',sum)#</a></div>");
... the ClientTemplate creates a GET, I need a POST.
Note: I want to display the InvoicedAmount as a link to a POST.
Thanks

this is my modal body .. it's a form to create a new product that should write a name and associate it to a catogory
@model mySolution.Models.
@using (Html.BeginForm("Product_Add", "", FormMethod.Post))
{
@Html.AntiForgeryToken()
<div class="form-horizontal" id="newProduct">
<div id="validation-summary">
</div>
<div class="form-group">
<div class="form-row">
@Html.LabelFor(model => model.ProductName, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.ProductName, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.ProductName, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
<div class="form-row">
@Html.LabelFor(model => model.ProductCategory, htmlAttributes: new { @class = "control-label col-md-2" })
@(Html.Kendo().DropDownList()
.Name("categoriesDropDownList")
.DataTextField("CategoryName")
.DataValueField("CategoryID")
.DataSource(source =>
{
source.Custom()
.ServerFiltering(true)
.Type("aspnetmvc-ajax")
.Transport(transport =>
{
transport.Read("Category_Read", "Category");
})
.Schema(schema =>
{
schema.Data("Data")
.Total("Total");
});
})
)
</div>
</div>
</div>
<br />
<div class="form-group">
<div class="form-row">
<div class="col-md-12" style="text-align: right;">
<input type="submit" value="Enregister" class="mr-1 mb-1 btn btn-primary" />
@Html.ActionLink("Annuler", "ProductList", "Products", null, new { @class = "mr-1 mb-1 btn btn-secondary" })
</div>
</div>
</div>
}
Product and Category are two differents table..I get the list of categories but when i want to submit the save of a new product ..i didn't get the correct value of categoryID and after submit :in the table of Product..it take the correct Name of Product filled and 0 as value of CategoryID
in the controller side i have an action method Product_Add(ProductModel model) that call a service to execute the save..
how can I get the correct CategoryID selected , pass it (Category_CategoryID_PK = Product_CategoryID_FK) and save it ? any propositions?
Thanks!
I used the examples I could find:
<input type="submit" value="Export to Excel" name="export" id="excel" formmethod="post" class="btn-secondary searchBtn px-5" />and then:
<script type="text/javascript"> $(function(){ kendo.ui.progress.messages = { loading: "Processing..." }; function displayLoading(target) { var element = $(target); kendo.ui.progress(element, true); this.form.submit(function(){ kendo.ui.progress(element, false); }); } $("#excel").click(function(){ displayLoading(document.body); }); });</script>
The problem is that the controller's action returns a file:
public ActionResult Index(...) { ... return File(renderedBytes, mimeType, fileName); // This is an Excel file.}
it looks to me that the
kendo.ui.progress(element, false);is never triggered, therefore the progress overlay stays displayed (and the form is disabled) even after the Excel file is returned to the browser.
How can I make the overlay disapear once the Excel file has been returned?
Thanks.

Hi,
i have few integer columns in grid.
I want to display sum of column in footer of the grid.
i tried several ways but could not success.
