I have a grid that is loading in a modal popup (a partial view) that requires some information from the parent page being set before calling the datasource on the controller.  I have set AutoBind to false and while it does prevent the datasource from calling the controller until I load the partial view, the .Data(javascript function) that builds the dataset needed for the controller is still being hit as soon as the parent page is initialized, but before the values on the page have been set (user input fields).  

Is there a way to either prevent this from happening, or is there another technique I should be using?

Thanks for any help in advance

Hi 

I have implemented the card UI and have the drag and drop working using the example script

$(document).ready( function () { $("#list").kendoSortable({ filter: ".k-card", cursor: "move", placeholder: function (element) {return element.clone().css("opacity", 0.1);}, hint: function (element) {return element.clone().css("width", element.width()).removeClass("k-state-selected");}});});

I want to be able to save the new order if the user drags and drops and item.

Is there an event to know when a drag and drop action has occurred.

Then I can loop through a class in javascript and grab the order from the ids or a data attribute to re-order the items.

Many thanks

After my page comes back after a post the selected items in the multi select are gone. The datasource http GET returns no items because it filters it base off text...

RAZOR .cshtml

<kendo-multiselect for="SearchCriteria.SiteId" value="@Model.SearchCriteria.SiteId" datatextfield="Name"
                                   datavaluefield="Id" placeholder="Search for a Clinic" filter="FilterType.Contains"
                                   auto-bind="true" deferred="true">
                    <datasource server-filtering="true">
                        <transport>
                            <read url="@Model.SearchProvidersURL">
                        </transport>
                    </datasource>
                </kendo-multiselect>

RAZOR Model page

public string SearchProvidersURL => $"{Url.Page("ByClinic")}?handler=ProviderSearch";
        public async Task<JsonResult> OnGetProviderSearch(string text)
        {
            var providerSites = await _lookUpService.GetProviderSites(text);

             //No Results if text is less than 3 characters because there are too many sites. I would return 40,000 items
            return new JsonResult(providerSites);
        }

Can I write some javascript that could run after the post happens, I don't know what to do?

I have a column with html code. i.e. <div style='color: green'> Active</div>

and I have the filterable operator set to "Contains" but the filter result is alway not found.

Any advice how i can filter this?

Can I export what is created in this Editor out to RTF or to DOCX files?

Thanks,

Joel

Hello,

I have a grid edits in pop up:

 .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("RecordViewModelTemplate"))

The fields bind well to the model in the template when I do:

 <div class="form-group">
            <label asp-for="@Model.AnimalId"></label>
            <input asp-for="@Model.AnimalId" class="k-textbox" />
            <span asp-validation-for="@Model.AnimalId" class="text-danger k-invalid-msg" data-for="AnimalId"></span>
  </div>

  However, the fields don't bind to the model when I try:

@Html.CheckBoxFor(m => m.SampleTestPackage.biochemistry[1].Selected, new Dictionary<string, object> { { "class", "biochemistry" }, { "data-test", "Comprehensive" } })

  If the value is true in the model the check box doesn't appear selected.

I have tried also:

<h5> BIOCHEMISTRY </h5>
                                <div class="row">
                                    @{ for (int i = 0; i < @ViewBag.biochemistry.Count; i++)
                                        {
                                            var biochemistryId = String.Format("biochemistry{0}", @ViewBag.biochemistry[i].Value);
                                            <div class="form-group  col-4">
                                                <div class="custom-control custom-checkbox">
                                                    @Html.HiddenFor(m => m.SampleIndividualTest.biochemistry[i].Value)
                                                    @Html.HiddenFor(m => m.SampleIndividualTest.biochemistry[i].Text)
                                                    <input type="checkbox" id=@biochemistryId class="biochemistry custom-control-input" asp-for="@Model.SampleIndividualTest.biochemistry[i].Selected">
                                                    <label for=@biochemistryId class="custom-control-label"> @Html.Raw(@ViewBag.biochemistry[i].Text)</label>
                                                </div>
                                            </div> } }
                                </div>

but the check boxes don't bind and remain false when they are true/selected in the model.

If I do:

@{

if (Model == null){

<span> Model is empty </span>

}

}

I get as result that the model is empty.

I don't understand why some fields like AnimalId bind to the model and other no - when the model is apparently empty.

I am not coding anything to bind the model the template - is there any code I need to bind the model to the template when the edit event is clicked in the grid?

Also, when the update event is fired, the control gets and empty model, I suppose that it is logic as the model is empty.

Any help is appreciated, I suppose that I am missing the concept.

Kind Regards.

I am struggling for last 3 days. all nugets installed.. and contoller is doing all that needs to do and returning viewmodel back to index view. but kendo grid doesn't render any thing. code below. am i doing any thing wrong here?

**************************************************************************************

@model Icaew.StudentRegistration.Admin.WebApp.Models.UserSearchViewModel
@using Kendo.Mvc.UI
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.rtl.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.silver.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.mobile.all.min.css" />
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js">
</script>
<main class="primary content">    
    <div class="row">
        <div class="columns">     
            @if (Model != null && ViewBag.UsersCount >= 1 && !Model.HasError)
            {
                @(Html.Kendo().Grid(Model.SearchResult)
                        .Name("grid")
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .PageSize(2)
                            .ServerOperation(false)
                         )
                        .ToolBar(tools =>
                        {
                            tools.Pdf().Text("Custom PDF button text");
                            tools.Excel().Text("Custom Excel button text");
                        })
                        .Pageable()
                        .Sortable()
                        .Groupable()
                        .Columns(columns =>
                        {
                            columns.Bound(f => f.RecordCode);
                            columns.Bound(f => f.Firstname);
                        })
               )
            }
            <a asp-area="" class="cta-link" asp-controller="Home" asp-action="Index">Back</a>
        </div>
    </div>
</main>
************************************************************************************************************************************

please can anyone help me? am i not including any css or js?

Hello,

Could we customize the wizard functionality?

For example:

 1) disable the change of the content within the Circle of the Step,

 2) use a custom icon/img instead of Check Icon which is currently displayed? 

Is there a way to customize the appearance of the color picker popup window? For example, can I add a text separator, or perhaps a tooltip to each tile in the color picker?

Thanks

Matt

In a grid with GridEditMode.Popup, validation errors for fields in the pop-up window appear as a hint bubble by default.

Is it possible to change the style of the validation so that errors in the pop-up window appear below the input fields (as they might for a normal html form)?

See images for example.

Thanks,