Telerik Forums
UI for ASP.NET MVC Forum
8 answers
2.7K+ views
The documentation at http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/ajax-binding#pass-additional-data-to-the-action-method shows how to pass additional data to the Read action, when asynchronously binding the grid using AJAX.

Is there similar functionality available to other AJAX action methods Create, Update and Destroy?  I do not see any mention in the documentation at http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/ajax-editing.
Stefan
Telerik team
 answered on 05 Sep 2017
1 answer
430 views
I created a Telerik asp.net MVC project and have a standard generated razor create from my controller When I try to run the create view I get the following error? the view does not have any controls.

The error below occurs on the HTML.EditorFor
----------create.cshtml--------------
 <div class="form-group">
            @Html.LabelFor(model => model.NonFoodAllergies, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.NonFoodAllergies, new { htmlAttributes = new { @class = "form-control" } }) --Errors On this
                @Html.ValidationMessageFor(model => model.NonFoodAllergies, "", new { @class = "text-danger" })
            </div>
        </div>

---------------------ERROR--------------------
System.Web.HttpCompileException occurred
  HResult=0x80004005
  Message=c:\Users\\Source\Workspaces\WebApps\Views\Shared\EditorTemplates\String.cshtml(3): error CS1061: 'System.Web.Mvc.HtmlHelper<object>' does not contain a definition for 'Kendo' and no extension method 'Kendo' accepting a first argument of type 'System.Web.Mvc.HtmlHelper<object>' could be found (are you missing a using directive or an assembly reference?)
  Source=System.Web.Mvc
  StackTrace:
   at System.Web.Mvc.BuildManagerWrapper.System.Web.Mvc.IBuildManager.GetCompiledType(String virtualPath)
   at System.Web.Mvc.BuildManagerCompiledView.Render(ViewContext viewContext, TextWriter writer)
   at System.Web.Mvc.Html.TemplateHelpers.ExecuteTemplate(HtmlHelper html, ViewDataDictionary viewData, String templateName, DataBoundControlMode mode, GetViewNamesDelegate getViewNames, GetDefaultActionsDelegate getDefaultActions)
   at System.Web.Mvc.Html.TemplateHelpers.TemplateHelper(HtmlHelper html, ModelMetadata metadata, String htmlFieldName, String templateName, DataBoundControlMode mode, Object additionalViewData, ExecuteTemplateDelegate executeTemplate)
   at System.Web.Mvc.Html.TemplateHelpers.TemplateHelper(HtmlHelper html, ModelMetadata metadata, String htmlFieldName, String templateName, DataBoundControlMode mode, Object additionalViewData)
   at System.Web.Mvc.Html.TemplateHelpers.TemplateFor[TContainer,TValue](HtmlHelper`1 html, Expression`1 expression, String templateName, String htmlFieldName, DataBoundControlMode mode, Object additionalViewData, TemplateHelperDelegate templateHelper)
   at System.Web.Mvc.Html.TemplateHelpers.TemplateFor[TContainer,TValue](HtmlHelper`1 html, Expression`1 expression, String templateName, String htmlFieldName, DataBoundControlMode mode, Object additionalViewData)
   at System.Web.Mvc.Html.EditorExtensions.EditorFor[TModel,TValue](HtmlHelper`1 html, Expression`1 expression, Object additionalViewData)
   at ASP._Page_Views_MedicalSelfReport_Create_cshtml.Execute() in c:\Users\\Views\MedicalSelfReport\Create.cshtml:line 31
   at System.Web.WebPages.WebPageBase.ExecutePageHierarchy()
   at System.Web.Mvc.WebViewPage.ExecutePageHierarchy()
   at System.Web.WebPages.StartPage.RunPage()
   at System.Web.WebPages.StartPage.ExecutePageHierarchy()
   at System.Web.WebPages.WebPageBase.ExecutePageHierarchy(WebPageContext pageContext, TextWriter writer, WebPageRenderingBase startPage)
   at System.Web.Mvc.RazorView.RenderView(ViewContext viewContext, TextWriter writer, Object instance)
   at System.Web.Mvc.BuildManagerCompiledView.Render(ViewContext viewContext, TextWriter writer)
   at System.Web.Mvc.ViewResultBase.ExecuteResult(ControllerContext context)
   at System.Web.Mvc.ControllerActionInvoker.InvokeActionResult(ControllerContext controllerContext, ActionResult actionResult)
   at System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilterRecursive(IList`1 filters, Int32 filterIndex, ResultExecutingContext preContext, ControllerContext controllerContext, ActionResult actionResult)
   at System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilterRecursive(IList`1 filters, Int32 filterIndex, ResultExecutingContext preContext, ControllerContext controllerContext, ActionResult actionResult)

Veselin Tsvetanov
Telerik team
 answered on 05 Sep 2017
3 answers
480 views

We have implemented in grid a conditional filter using 'filterMenuOpen' and 'filter' events of the grid. And it works.
Now we have a page where a hierarchy data needs to be display and must have the same look and feel as the grid, hence the conditional filtering. In order to do this we have modified the treelist in order to have the 'filterMenuOpen' and 'filter' events on tree adapting the code from grid. 
We also handled the filter open like in the thread http://www.telerik.com/forums/cascade-filter-using-ajax-binding

But we have found that setting the filter on treelist does not work in the same way as it does for grid:
1. We have a table with Id, MainField, SubField, ParentId => the data is displayed in the treelist correctly
(The SubField has to have the source dynamic based on the MainField selected)
2. Select a filter on MainField => the data is filtered correctly
3. Select a filter on SubField => The datasource of SubField it is correct based on the selected MainField filter value and the filter is done correctly
4. Change the MainField filter and select another value (we have to remove the SubField filter) =>
The TreeList displays changes multiple times and the last one is not the correct one (It displays the same data as the first filter at point 2)

Questions:

1. Is there a way to make the filter functionality work like in grid?

2. Is there a plan to soon release a new version to make the treelist have the same functionality as the grid? If not can we still hope there will be one :D

3. Is there a solution to implement the hierarchy in the grid?

 

PS: Because we are using MVC and should have the same filtering as the grid we had to attach to the framework the same functionality (as in grid) already supported by the filter (kendoFilterMenu) in treelist.

Stefan
Telerik team
 answered on 05 Sep 2017
3 answers
198 views

Hello,

When using the standard HTML5 <video> tag, one can list various formats of the same video e.g. .webm, .mp4 and the browser will work down the list and take the first one it supports or render the text line following the files if nothing is supported.

<video controls width="640" height="360">
  <source src="~/Content/video/intro_20170825.webm" type="video/webm"></source>
  <source src="~/Content/video/intro_20170825.mp4" type="video/mp4"></source>
  <p>Your browser doesn't support video. Please use IE9+, Firefox, Chrome, Opera or Safari.</p>
</video>

 

How can I achieve the same result with Media Player control?

I can serve up files in various qualities (e.g. 480p, 720p) but it always takes the first file in the list no matter what (and does not display in IE11).

@(Html.Kendo().MediaPlayer()
    .Name("mediaplayer1")
    .AutoPlay(true)
    .HtmlAttributes(new { style = "height:360px; width:640px" })
    .Media(m => m
        .Title("Power Vision Mobile Platform")
        .Source(new[] {
            new { quality = "720p", url = "../Content/Video/intro_20170825.webm" }
        })
    )
    .Media(m => m
        .Title("Power Vision Mobile Platform")
        .Source(new[] {
            new { quality = "720p", url = "../Content/Video/intro_20170825.mp4" }
        })
    )
)

 

I've also tried having one .Media block with both files listed in the .Source array, but still it only takes the first one. We prefer to serve up .webm file as default and keep the .mp4 around for Internet Explorer users.

Thanks in advance for any suggestions,

Rob

Georgi
Telerik team
 answered on 04 Sep 2017
3 answers
344 views

Hi! i have a serious problem with kendo ui autocomplete in my mvc cshtml page. With Chrome or Edge all work fine, but with Firefox i have a position problem with the autocomplete popup. If i load page and not scroll page, the position of autocomplete popup is correct, but when i scroll page the position become wrong as if the distance of the popup is calculate on the viewport and not on the body page.

 

Below the image.

Magdalena
Telerik team
 answered on 04 Sep 2017
5 answers
2.2K+ views

Hello everybody. I have a question. As I can run a tooltip in the following code grid? the idea is to show me where I positioned the field.
Thank you!

@(Html.Kendo().Grid<ControlGAS.DataAccess.Entities.Customer>()
    .Name("GridCustomers")
        .Columns(columns =>
        {
            columns.Bound(customer => customer.Id).Title("ID").Filterable(f => f.UI("filterById")).HtmlAttributes(new { @style = "white-space: nowrap;"});
            columns.Bound(customer => customer.Denomination).Title("Nombre").Filterable(f => f.UI("filterByName")).HtmlAttributes(new { @style = "white-space: nowrap;"});
            columns.Bound(customer => customer.Code).Title("Codigo").Filterable(f => f.UI("filterByCode")).HtmlAttributes(new { @style = "white-space: nowrap;"});
            columns.Bound(customer => customer.Address).Title("Direccion").Filterable(f => f.UI("filterByAddress")).HtmlAttributes(new { @style = "white-space: nowrap;"});
            columns.Bound(customer => customer.City).Title("Ciudad").Filterable(f => f.UI("filterByCity")).HtmlAttributes(new { @style = "white-space: nowrap;"});
            columns.Bound(customer => customer.FiscalIdentification).Title("Identificacion Fiscal").Filterable(f => f.UI("filterByFiscalId")).HtmlAttributes(new { @style = "white-space: nowrap;"});
            columns.Template(customer => { }).ClientTemplate(
                "<a href=" + quote + @Url.Action("Editing", "Customer", new { customerId = "#=Id#" }) + quote + "><i class='font-size-20 icon md-edit margin-right-10' aria-hidden='true'></i></a>" + "" +
                "<a href=" + quote + @Url.Action("Editing", "Customer", new { customerId = "#=Id#" }) + quote + "><i class='font-size-20 icon md-delete margin-right-10' aria-hidden='true'></i></a>")
                .Title("Actions").Width(100);
 
        })
        .Scrollable()
        .Sortable()
        .Groupable()
        .Pageable()
        .DataSource(
            dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("GetCustomers", "Customer"))
        )
         
        .Reorderable(r => r.Columns(true))
        .ClientDetailTemplateId("master")
        .Filterable(filter => filter.Mode(GridFilterMode.Row)
              .Extra(false)
              .Operators(operators => operators
                  .ForString(str => str.Clear()
                      .StartsWith("Empieza con")
                      .IsEqualTo("Igual a")
                      .IsNotEqualTo("No es igual a")
 
                 )
                 .ForNumber(num => num.Clear()
                      .IsEqualTo("Es igual a")
                      .IsNotEqualTo("Distindo de")
                      .IsNull("Vacio")
                      .IsLessThan("Menor a")
                      .IsGreaterThan("Mayor a"))
            )
        )
        .Events(events => events.DataBound("dataBound"))
)

Ianko
Telerik team
 answered on 04 Sep 2017
2 answers
395 views

Hi, currently I am doing the following to get some tooltip information on a grid row:

$("#gridPop").kendoTooltip({
                filter: 'td:nth-child(10)',
                content: function (e) {
                    var template = kendo.template($("#myToolTipTemplate").html());
                    var dataItem = $("#grid").data("kendoGrid").dataItem(e.target.closest("tr"));
                    var tooltipHtml;
                    $.ajax({
                        url: DetailsURL + "/" + dataItem.Id,
                        async: false
                    }).done(function (data) {   // data is a JSON object from the server with details for the row
                        if (data.Success) {
                            data.Result = data.Result.replace(/null/g, "\"N/A\"");
                            tooltipHtml = template($.parseJSON(data.Result));
                        } else {
                            tooltipHtml = "Ooops!<br>Something went wrong (" + data.Result + ")";
                        }
                    });
                    return tooltipHtml;
                }
            });

 

I would like to get rid of the synchronous ajax call and make it asynchronous. I saw some asynchronous examples where the server delivers the full html, but nothing that works with JSON data from the server, that is then "compiled" via a kendo.template() to html on the client. Any suggestions how to do this?

Caecilia
Top achievements
Rank 1
 answered on 01 Sep 2017
2 answers
392 views

Kendo updated with our last Sitefinity update, and previous to now it always stored the selected item in the list to the MVVM model.  However in the current version it seems to just store literally as the string "[Object, object]"

I've tried setting data-value-primitive to true\false, no change either way.

 

<select class="schedules form-control"
                                 data-bind="source: schedule, value: location.schedule, events: { change: onScheduleChange }, visible: hasScheduleItems"
                                 data-text-field="StartDateFormatted"
                                 data-value-primitive="false"
                                 data-role="dropdownlist"
                                 data-option-label="Select a schedule entry"
                                 style="width: 100%; max-width: 300px">
                            </select>
sitefinitysteve
Top achievements
Rank 2
Iron
Iron
Veteran
 answered on 31 Aug 2017
7 answers
2.4K+ views

I have a Kendo Grid with drop-down lists for in-line update.When i am in edit mode, the drop-down list text fields are displayed. But after i save, the value of the selected items are displayed in the grid instead of the text fields. I am using EditorTemplateName for displaying the drop-down lists in the grid.Can you please help me find what is wrong and help me correct this issue.

I have uploaded a copy of the code and 2 images. Thanks for the help

Chinonso
Top achievements
Rank 1
 answered on 30 Aug 2017
1 answer
221 views

I have a scheduler built with MVC and I would like for the events to be filtered by multiple fields. I am having difficulty in setting the filter logic along with the operators in the javascript.

Is there a way to filter by multiple values on a button click event?

Here are my selections:

<div id="tutors-listing">
    Tutors
    <div id="tutors">
        Adalhi<input type="checkbox" id="alex" aria-label="Alex" value="3">
        Annik<input type="checkbox" id="bob" aria-label="Bob" value="4">
        Bobby<input type="checkbox" id="charlie" aria-label="Charlie" value="5">
    </div>
</div>
 
<div id="subjects-listing">
    Subjects
    <div id="subjects">
        AES<input type="checkbox" id="1" value="AES">
        NURS<input type="checkbox" id="2" value="NURS">
        ENG<input type="checkbox" id="3" value="ENG">
        MED<input type="checkbox" id="4" value="MED">
    </div>
    <button type="button" id="filter">Filter</button>
</div>

 

And here is my javascript. I am having issues getting the classesChecked value to show:

<script type="text/javascript">
    $(function () {
        $("#filter").click(function () {
 
            var tutorsChecked = $.map($("#tutors :checked"), function (checkbox) {
                return parseInt($(checkbox).val());
                 
            });
 
            alert(tutorsChecked);
             
            var filter = {
                logic: "or",
                filters: [
                    {
                        logic: "and",
                        filters: [
                            { field: "SUBJECT", operator: "eq", value: classesChecked }
                        ]
                    },
                    {
                        logic: "and",
                        filters: [
                            { field: "TutorID", operator: "gt", value: tutorsChecked }
                        ]
                    }
                ]
 
            };
 
            var scheduler = $("#scheduler").data("kendoScheduler");
 
            scheduler.dataSource.filter(filter);
        });
    })
</script>

 

Is there a better method to filter these values and how can I see the multiple value selections? Thanks in advance.

Plamen
Telerik team
 answered on 29 Aug 2017
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
ComboBox
Upload
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
Dialog
MultiColumnComboBox
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
Security
ColorPicker
DateRangePicker
Wizard
Styling
Chat
DateInput
MediaPlayer
TileLayout
Drawer
SplitView
Template
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?