Hi,

I am trying to generate kendo ListView with cascading drop downs in it, all the other controls are working ok.

I followed the documentation and other threads in this forum with no luck

The browser not renders EntityTypeId input as drop down list

Also tried to render it in following ways:

layout.entityTypesData
= new
kendo.data.DataSource({

data: @(Html.Raw(Json.Encode(ViewBag.EntityTypes)))
});


<select data-role="dropdownlist" data-text-field="Text" data-value-field="Value" data-source="layout.entityTypesData"></select>

<select data-role="dropdownlist" data-text-field="Text" data-value-field="Value" data-bind="source:layout.entityTypesData,
value: #:EntityTypeId#"></select>

Please assist me in solving this issues

Here is my code:

@{


Layout = "~/Views/Shared/_Layout.cshtml";

}




<a class="k-button k-button-icontext k-add-button" id="add-quickLink" href="#">


<span class="k-icon k-add"></span>Add new record


</a>




<div id="listView"></div>

@section
scripts

{


<script type="text/x-kendo-tmpl" id="quickLinkEditTemplate">


<div class="quickLink-view k-widget">


<span class="handler">&nbsp;</span>


<span>


<input type="text" class="k-textbox
entityType" value="#:EntityTypeId#" name="EntityTypeId" id="EntityTypeId#:QuickLinkComponentId#" />


</span>


<span>


<input type="text" class="k-textbox entity" value="#:EntityId#" name="EntityId" id="EntityId#:QuickLinkComponentId#" />


</span>


<span>


<input type="text" class="k-textbox" value="#:Text#" name="Text" />


</span>


<span>


<a class="k-button k-cancel-button" href="\#"><span class="k-icon k-cancel"></span></a>


</span>


</div>


</script>






<script>


$(document).ready(function() {


layout.urls.root = "@Url.Content("~")";


layout.urls.getEntitiesForDropDownUrl = "@Url.Action("GetEntitiesForDropDownAsync")";


layout.entityTypesData = [{ Value: 1, Text: "Article" }, { Value: 2, Text: "Product" }, { Value: 3, Text: "Categories" }];


initListView();

initDropDownLists();

});

var
kendoDropDownOptions = {

autoBind: false,


optionLabel: "Select",


dataTextField: "Text",


dataValueField: "Value",


dataSource: {

type: "json",


serverFiltering: true,

transport: {

read: {

type: "POST",


url: layout.urls.getEntitiesForDropDownUrl,


dataType: "json",


contentType: "application/json"


},

parameterMap: function (data) {


return
JSON.stringify(data);


}


}


}


};




var initDropDownLists =
function() {


$(".quickLink-view").each(function () {


  var entityTypeComponent = $(this).find(".entityType");


var entityComponent =
$(this).find(".entity");




entityTypeComponent.kendoDropDownList({


dataTextField: "Text",


dataValueField: "Value",


dataSource: layout.entityTypesData


});




kendoDropDownOptions.cascadeFrom = entityTypeComponent.id;


entityComponent.kendoDropDownList(kendoDropDownOptions).data("kendoDropDownList");


//entityComponent.data('kendoDropDownList').value(layout.header.viewModel.PromotionEntityId);


});




};




var initListView = function() {


var dataSource = new kendo.data.DataSource({


transport: {


read: {


//returns
[{"QuickLinkComponentId":1,"EntityTypeId":1,"EntityId":1,"Text":"test1","SortOrder":0,"ParentId":1},{"QuickLinkComponentId":2,"EntityTypeId":2,"EntityId":1,"Text":"test2","SortOrder":0,"ParentId":1}]


url: layout.urls.root + "QuickLink",


dataType: "json"


},


update: {


url: layout.urls.root + "QuickLink/Update",


dataType: "json",


type: "POST"


},


destroy: {


url: layout.urls.root + "QuickLink/Delete",


dataType: "json",


           type: "POST"


},


create: {


url: layout.urls.root + "QuickLink/Create",


dataType: "json",


type: "POST"


},


parameterMap: function(options, operation) {


if (operation != "read") {


var items = {};




$.each(data.models, function(index, item) {


         for (var key in item) {


items["[" + index + "]" + "." + key] = item[key];


}


});




return items;


}


                  }


},


batch: true,


schema: {


model: {


id: "QuickLinkComponentId",


fields: {


QuickLinkComponentId: { editable: false, nullable: true },


}


}


}


});




var listView = $("#listView").kendoListView({


dataSource: dataSource,


   template: kendo.template($("#quickLinkEditTemplate").html())


}).data("kendoListView");




$("#add-quickLink").click(function(e) {


listView.add();


e.preventDefault();


});


};


</script>

}

Hello,

 In your example:

http://dojo.telerik.com/IyOGA

how can i bind the <li> element to the column ShipName? It says it is not declared.

Thank you.

Hi,

We have a rich text editor in our application. User is able to copy paste images from his local disk into the editor using Chrome, but it is not working in IE9. 

Could you please suggest any solution for this issue?

Many forums say that this is a limitation in IE9 and we can't do anything about it, is that so?

Thanks in advance.

I added an event call on Save to call a javascript function, so I can determine whcih cell the user changed, as I need this in the controller for a calcuation where the changed field takes precedence. However when I used the e.model.set('TriggeringField', 'whateverFieldWaschanged'); this causes the controller to be called twice, which I can't live with as it will cause the back end auditing to log the event twice. When I put in e.PreventDefault in the JS method, then the controller is not called at all. How do I get my controller called just ONCE, AND supply the name of the field that was changed. Nolte as above I am using Incell editing.

Hi,

I'd like to use the Autocomplete control as a lookup field. For example you can type in the company name, autocomplete would select the match and as soon as it was selected the field would become a HTML link to the selected object.

Eg. Typing ACME selects ACME Ltd.  After selection ACME Ltd. changes to a hyperlink to the company details page.

Is this possible with the autocomplete control?

Or would it be better to use the multi-select with a maximum item of 1?

Hi there,

Is it possible to manually show a validation message for an input with a custom message?

I have a process that's separate to the validation rules. Part of the outcome for this process is that the validation message might need to be displayed below a field.

Is there a way of using the validator to manually trigger a message against a field? Or do I need to recreate the html for the validation message and place it on the form using code?

Many thanks,
Bill

Hi there,

I think there is a bug when using mobile: 'phone'. The date in the header bar is there twice. It reads: 

You can see it here: http://dojo.telerik.com/OZExI

2014Q3 does not show this issue, only the new 2015Q1 release.

br, Chris