I have a search form which will get a list of records.
I would like to bind the search results on pressing submit after performing some initial checks on the entered data. How do i bind my action result to the Kendo Grid ?
My JS File is
function validateDataForSearch() {
var empNo = $("#empNo").val();
var empName = $("#empName").val();
var empMgr = $("#empMgr").val();
var clientName = $("#ClientName").val();
var noValues = empNo.length + empName.length + empMgr.length + clientName.length;
if (noValues <= 0) {
alert("Please enter at least one value to be able to search.");
}
else {
if (empNo.length <= 0)
empNo = 0;
$.ajax({
type: "POST",
url: 'Home/Search',
data: { empNo: empNo, empName: empName, empMgr: empMgr, clientName: clientName },
success: function (response) {
$("#pmtSearchResult").getKendoGrid().dataSource.data(response);
}
});
};
function getEmpLink(project) {
var action = '@Url.Action("Index","PMP", new { emp= '+ emp +')';
var empLink = kendo.format("<a href='{0}'>{2}</a>", action, emp.empNo);
return empLink;
}
var validator = $("#searchForm").kendoValidator().data("kendoValidator");
$("#btnSearch").click(function (e) {
if (!validator.validate()) {
e.preventDefault();
}
else
validateDataForSearch();
});
My CSHTML is as follows
@model IEnumerable<PMT.Models.EmpData>
<div id="kendoGrid">
@(Html.Kendo().Grid(Model)
.Name("SearchResult")
.Columns(columns =>
{
columns.Bound(p => p.empNo).ClientTemplate("#= getEmpLink(data) #");
columns.Bound(p => p.empName);
columns.Bound(p => p.empMgr);
columns.Bound(p => p.ClientName);
columns.Bound(p => p.empSal).hidden(true);
})
.Pageable()
.Sortable()
.Scrollable(scr => scr.Height(430))
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.ServerOperation(false)
)
)
I cant seem to render the grid to hide the empSal column or to show the emloyeeid column as a hyperlink column
Please find the below code as i want to set default value of dropdown instead of optionlable from JSON data which is returned from controller .
Please find the below code
@(Html.Kendo().DropDownList()
.Name("DropDownList1")
.HtmlAttributes(new { style = "width:300px" })
.OptionLabel("Select ...")
.DataTextField("District_Id")
.DataValueField("Location_ID")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetOrders", "IDTDashboard");
})
.ServerFiltering(true);
})
.AutoBind(false)
public ActionResult GetOrders()
{
List<usp_IDQ_GetLicenseDistrictsVO> objresult1 = new List<usp_IDQ_GetLicenseDistrictsVO>();
objresult1 = objConnection.usp_IDQ_GetLicenseDistricts(User.Identity.Name, true).ToList();
return Json(objresult1, JsonRequestBehavior.AllowGet); ;
}
Hi,
We have a combobox and a button inside a form (all HTML helper) and when we submit (its just a search form) two querystring items are appended to the forms destination - one with the name of the "Combobox" giving the value and one with "ComboBox_input" giving the text.
We're using a combobox so we can have the Text and the Value separate.
How can we stop both the Text AND Value being added as a querystring value?
I know we can do an on change event and window.location, but we've a requirement for an actual button to click and I thought this would work ...
01.@using (Html.BeginForm("Details", "Property", FormMethod.Get))02. {03. 04. @(Html.Kendo().ComboBox()05. .Name("PropertyId") 06. .DataTextField("Searchable") 07. .DataValueField("PropertyRef")08. .Placeholder("Search for property by ref or name ...")09. .Filter(FilterType.Contains)10. .AutoBind(false)11. .MinLength(4)12. .DataSource(source =>13. {14. source.Read(read =>15. {16. read.Action("PropertySearch_Read", "Search"); 17. })18. .ServerFiltering(false); 19. })20. .HtmlAttributes(new { style = "width:100%" })21. )22. 23. 24. @(Html.Kendo().Button()25. .Name("btnSubmit")26. .HtmlAttributes(new { type = "submit" })27. .Content("Search")28. )29.}Thanks,
Daniel
I have the following grid
<div class="actualGrid" id="actualGrid"> @(Html.Kendo().Grid<AVNO_KPMG.Models.Bench>() .Name("grid") .Columns(columns => { columns.Bound(p => p.name).Title("Bench").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains"))).Width(125); columns.Bound(p => p.freeSeats).Title("Free Seats").Width(350); columns.Command(command => { command.Custom("checkBench1 ").Text(" AM ").Click("doCheckIn"); command.Custom("checkBench 2").Text(" PM ").Click("doCheckIn"); command.Custom("checkBench3").Text("All Day").Click("doCheckIn"); }).Width(250).Title("Check in"); }) //.Editable(editable => editable.Mode(GridEditMode.PopUp)) .Pageable() .Sortable() .Scrollable() .Filterable(ftb => ftb.Mode(GridFilterMode.Row)) .HtmlAttributes(new { style = "height:530px;" }) .Events(events => events.DataBound("onDataBound")) .DataSource(dataSource => dataSource .Ajax() .PageSize(20) .Events(events => events.Error("error_handler")) .Model(model => model.Id(p => p.id)) .Read(read => read.Action("GetBenches", "Home")) ) ) </div> I would like to know if there is a way to change the size of the grid according to the number of results i have when i use filter
for Example if i filter first column and get 1 result grid would be small, and if i had 10 results i would be larger.

Hello,
Could you please let me know how one can control the placement of the slider tooltip? By default it is to bottom and the ask is to have it placed above.
Thanks!
Hello, I'm currently evaluating the MVC controls. I've created a custom control panel where the user can filter or create new items on the table. Currently the filter is working perfectly using javascript. The create button is not. I added the class k-grid-add but no luck. I look at the link the grid creates when using the standard create button in the toolbar and it looks something like this: tblAgents_Read?grid-mode=insert . I've tried adding this link to my custom link but it will return all data in a json file. Any help?
Hi,
we need to bind datatables to a grid. For that we found the following example code:
http://www.telerik.com/support/code-library/binding-to-datatable-0191a594e359
This is working fine with the following exception:
We need a custom popup editor. But this requires a model we do not have because the grid is <dynamic>. What can we do?
Best regards,
Thomas

Hi,
I have a frustrating issue with fields in my model not being populated in the Update action callback in my controller. The model:
public class CountsPerMonthModel{ [Editable(false)] public int Id { get; set; } public UserModel User { get; set; } public int January { get; set; } public int February { get; set; } public int March { get; set; } public int April { get; set; } public int May { get; set; } public int June { get; set; } public int July { get; set; } public int August { get; set; } public int September { get; set; } public int October { get; set; } public int November { get; set; } public int December { get; set; }}The User property is being correctly populated. Integer fields January through December are not.
The callback:
[HttpPost]public ActionResult CountsPerMonthUpdate([DataSourceRequest] DataSourceRequest request, CountsPerMonthModel model){ // model has User set, but January through December are always 0 // digging into request, the values are set correctly}And finally, the code for the popup template:
@model App.Models.CountsPerMonthModel<ul class="errors"></ul><div class="editor-label"> @Html.LabelFor(m => m.User)</div><div class="editor-field"> @(Html.Kendo().DropDownListFor(m => m.User) .Name("User") .OptionLabel("Select user...") .DataTextField("DisplayName") .DataValueField("UserId") .DataSource(source => { source.Read(read => { read.Action("GetUsers", "Management", new { includeReadOnly = false }); }); }) )</div><div> <p>@Html.Label("Counts Per Month")</p></div><div class="editor-label"> @Html.LabelFor(m => m.January)</div><div class="editor-field"> @Html.EditorFor(m => m.January) @Html.ValidationMessageFor(m => m.January)</div><div class="editor-label"> @Html.LabelFor(m => m.February)</div>... snipped for brevity ...<div class="editor-field"> @Html.EditorFor(m => m.February) @Html.ValidationMessageFor(m => m.February)</div><<div class="editor-label"> @Html.LabelFor(m => m.December)</div><div class="editor-field"> @Html.EditorFor(m => m.December) @Html.ValidationMessageFor(m => m.December)</div>@Html.HiddenFor(m => m.Id)When given a populated model, the values are displayed correctly in each field, it is only when Update is clicked, any updated values in the fields are not populated into the model object in the callback.
Any thoughts on what the issue might be? I've used similar code in other places, this is the first time though that any fields have been an int type, so am wondering if I'm missing something somewhere...
Also, the editor template for Integer is as follows:
@model int?@(Html.Kendo().IntegerTextBoxFor(m => m) .HtmlAttributes(new { style = "width:100%" }) .Min(int.MinValue) .Max(int.MaxValue))
Thanks,
Craig.
I have a DataSet that I'm generating on the fly.
I'm doing this by collecting all of my data and then building a DataTable and then using the DataTable as a DataSource for my Kendo Grid.
The Grid is set up to use AutoGenerated columns, like this ...
@(Html.Kendo().Grid(Model.Data) .Name("grid") .Columns(c => { c.AutoGenerate(true); } .Scrollable() .Resizable(a => { a.Columns(true); }))I want to freeze the first column in this Grid (I will always know what this column is).
I haven't found a way of manipulating the Columns at all when using AutoGenerated columns and have had to resort to a number of jQuery/CSS 'fudges' to get the Grid looking and behaving the way that I want it to.
However, I'm at a loss as to how I might be able to freeze a column when the Grid uses AutoGenerated columns.
Is is actually possible?
If it is, would you care to give me a hint as to how I might go about it?