Telerik Forums
Kendo UI for jQuery Forum
3 answers
69 views
I can't seem to get manual color entry to work in the flat color picker or hsv picker when using IE9. This includes the color pickers on the demo site. Is this something that is not supported in IE9? I don't see any limitations listed in the documentation.
Dimiter Madjarov
Telerik team
 answered on 05 Jun 2013
7 answers
677 views
Hello,

This may be because I am doing an Ajax post but I have the following and the kendo grid read method works fine.   I am trying to add a value to my kendo combox.  I also tried just a read call on the combobox to reload it and that also doesn't get into the controller action for the read.

<script type="text/javascript">
$(document).on('click', '.add-user', function(){
kendo.ui.progress($("#UserGrid"), true);

$("a.add-user").addClass("k-state-disabled");
$('a.add-user').on('click.disabled', false);

var koUserName = $("#UserName").data("kendoComboBox");
var koValue = $.trim(koUserName.value());

if (koValue.length) {
$.ajax({
url: '/User/CreateUser',
type: "POST",
data: { username: koValue },
success: function (data) {
$('#UserGrid').data("kendoGrid").dataSource.read();
$("a.add-user").removeClass("k-state-disabled");
kendo.ui.progress($("#UserGrid"), false);
$('a.add-user').off('click.disabled');

var ds = $('#UserName').data().kendoComboBox.dataSource;
ds.add({ text: "Test again!", value: "5" });  //doesn't work

//$('#UserName').data("kendoComboBox").dataSource.read();  also does not work and get into the read method
 },
error: function() {
alert("error");
}
});
}
});
</script>

This is my combobox:
@(Html.Kendo().ComboBox()
.Name("UserName")
.Filter(FilterType.Contains)
.DataTextField("FirstLastName")
.DataValueField("UserName")
.HtmlAttributes(new {@style = "width:300px;"})
.Placeholder("Search Active Directory")
.DataSource(dataSource => dataSource
.Read(read => read.Action("ADList_Read", "User"))
))
Dimiter Madjarov
Telerik team
 answered on 05 Jun 2013
11 answers
321 views
Hi,

My goal is to achieve a chart with, for each X values, I have 3 stacked bars.

Suppose that I want to present, for each month, my expenses in dollars for grocery, transport and mortgage.

I would create 3 series ('grocery', 'transport' and 'mortage') and set them all stacked.

Now suppose I want the exact same chart, but for each month I want 3 values for each of my series : the values for the years 2009, 2010 and 2011.

I achieved something near like this:

var chartData = [
   { X: 0, serie1: 12, serie2: 16, serie3: 11 },
   { X: 0, serie1: 32, serie2: 12, serie3: 15 },
   { X: 1, serie1: 15, serie2: 18, serie3: 9 },
   { X: 1, serie1: 8, serie2: 13, serie3: 17 }
];
 
$('#chartContainer').kendoChart({
   dataSource: {
      data: chartData
   },
   theme: 'default',
   legend: {
      position: 'bottom'
   },
   seriesDefaults: {
      type: 'column',
      stack: true
   },
   series:
      [
         { field: 'serie1', name: 'serie1' },
         { field: 'serie2', name: 'serie2' },
         { field: 'serie3', name: 'serie3' }
      ],
   categoryAxis: {
      field: 'X'
   },
   tooltip: {
      visible: true
   }
});

But I end up with a graph where categories are repeated on the x axis. Is there a way I could have them grouped? Something that would look like this:
http://peltiertech.com/Utility/pix/clusterstackchart.png

Thank you!
Iliana Dyankova
Telerik team
 answered on 05 Jun 2013
3 answers
191 views
Hello,
I was wondering if there is any trick to enable nested views within a Kendo UI Mobile application. The following code is not running as expected (all the sub-views are loaded at once). The documentation from Kendo UI is not very specific about this.

<div data-role="view" id="dashView" data-layout="mobile-view">
 
        <div data-role="view" id="dataA">
            <a data-role="button" href="#dataB">A</a>
        </div>
        <div data-role="view" id="dataB">
            <a data-role="button" href="#dataC">B</a>
        </div>
        <div data-role="view" id="dataC">
            <a data-role="button" href="#dataA">C</a>
        </div>
 
</div>
Regards,
Doru
Petyo
Telerik team
 answered on 05 Jun 2013
1 answer
153 views
I need to set the value of another column in the grid from a custom drop down editor. If a certain value is selected from the drop down, I would like to set some column values to dynamically chosen defaults. This works well with columns that don't have validation set. However, if I try to set the model data by calling options.model.set('column', newValue) from the event handler in the drop down event, the new value is not bound to the grid cell but the validation message is shown as if I tried to enter a null value.
This works well for model fields without validation rules.
How can I set a value in the data source when validation is present?
Alexander Valchev
Telerik team
 answered on 05 Jun 2013
1 answer
118 views
hi, i want to make a notification when user get a new messege like outlook mail.
do you have any Suggestion how do to it?
Duke
Top achievements
Rank 1
 answered on 05 Jun 2013
1 answer
399 views
Hello

I am running into a problem  using the data field on the transport read. The additionalData function is called  only the 1st time the datasource executes read. 
I have an event that updates the viewModel and the calls read() on the datasource. I can confirm that  it makes a call to the server every time but it only calls additionalData the 1st time.
Here are extracts of the related bits of code.

//in the datasource setup
transport: {
    read: {
    url: crudServiceBaseUrl + "/NoteSource",
    dataType: "json",
     data: App.Notes.additionalData(),
    cache: false
  },
  create: {
    url: crudServiceBaseUrl + "/Editing_Create",
    dataType: "json"
   }
 }

//in App.Notes 
where additionalData is:
additionalData: function () {
    console.log("additionalData");
    console.log(App.Notes.viewModel.linkedModel());
    return { entity: App.Notes.viewModel.linkedModel(), entityId: App.Notes.viewModel.linkedModelId() };
}
in the App.Notes namespace.

and viewModel is:
viewModel: {
                linkedModel: ko.observable(""),
                linkedModelId: ko.observable(0),
                username: ko.observable(""),
                noteType: ko.observable(""),
                createdAt: ko.observable(new Date())
            }
also in the same namespace.

The event handler contains the following that triggers the read and subsequent call to the server:
listView.dataSource.read();

Also just as a side note. This worked when i used the mvc version but I then got a stack overflow when I tried to include a partial of the cshtml page that contains this in my _Layout.
@(Html.Kendo().ListView<TimeTarget.RDM.Core.DataTransferObjects.NoteDto>()
                .Name("listView")
                .TagName("div")
                .ClientTemplateId("template")
                .Editable()
                .DataSource(dataSource => dataSource
                    .Model(model => model.Id("NoteId"))
                    .Create(create => create.Action("Editing_Create", "Note"))
                    .Read(read => read.Action("NoteSource", "Note")
                    .Data("App.Notes.additionalData")
                    ) // Specify the action method and controller name

                )
                .Pageable(paging => paging.Enabled(true))
                  )
Nikolay Rusev
Telerik team
 answered on 05 Jun 2013
2 answers
412 views
Hello,

I am struggling with declarative setting grid column to a external template

Here's my template
<script type="text/x-kendo-template" id="someTemplate">
    <div>
        <label> ${firstName}</label>  
        <label>${lastName}</label>
    </div>
</script>
and here's the grid declaration
<div data-role="grid" data-bind="source: people" data-columns='[
    {"field": "firstName",
     "title": "Full Name",
     "template": "kendo.template($("#someTemplate"))"
    }
]'></div>
And here's JS Fiddle reproducing my problem
http://jsfiddle.net/malovicn/bSGdW/8/

Anyone knowing how to fix that JS fiddle? :)
Nikola
Top achievements
Rank 1
 answered on 04 Jun 2013
1 answer
89 views
 My html is:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><link href="../../Content/kendo.common.min.css" rel="stylesheet" type="text/css" /><link href="../../Content/kendo.default.min.css" rel="stylesheet" type="text/css" /><link href="../../Content/examples-offline.css" rel="stylesheet" type="text/css" /><script src="../../Scripts/jquery.min.js" type="text/javascript"></script><script src="../../Scripts/kendo.web.min.js" type="text/javascript"></script><script src="../../Scripts/console.js" type="text/javascript"></script></head><body><select id="size"></select><script >$(document).ready(function() {$("#size").kendoDropDownList({dataTextField: "Text",dataValueField: "Value",dataSource: {transport: {read: {dataType: "jsonp",url: "/Grid/GetStateList",}}}});});</script></body></html>  And Controller is     public JsonResult GetStateList()        {            List<ListItem> list = new List<ListItem>() {                new ListItem() { Value = "1", Text = "One" },                new ListItem() { Value = "2", Text = "Two" },                new ListItem() { Value = "3", Text = "Three" }            };            return this.Json(list,JsonRequestBehavior.AllowGet);         /*   in MVC v3,v2   Json is blocked for GET requests (as you can tell from the error) for security reasons. If you want to override that behavior, check out the overload for Json that accepts a JsonRequestBehavior parameter.*/        }   But I am Unable to bind kendo dropdown in case of remote data .In case of local data its working fine .What changes should be done so that  kendoDropDownList can be bound ?Thank and Regards,Karan ShahSoftware Engineer,GIPL
Daniel
Telerik team
 answered on 04 Jun 2013
2 answers
1.3K+ views
I am developing an MVC 4 website for a customer and have run into an issue with the dropdownlist. 

I have a Grid, bound to my model, and I can see all the data (correctly) in the grid.
@(Html.Kendo().Grid((IEnumerable<MyModel>)ViewBag.Model)
                    .Name("Grid")
                    .Columns(columns =>
                    {
                        ..
                        removed for brevity
                        ..
                        columns.Command(command => { command.Edit(); command.Destroy(); });
                    })
                    .ToolBar(toolbar => toolbar.Create())
                    .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditorTemplate"))
                    .Pageable()
                    .Sortable()
                    .Scrollable()
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(20)
                        .Events(events => events.Error("error_handler"))
                        .Model(model => model.Id(m => m.recordID))
                        .Create(update => update.Action("Create", "Controller"))
                        .Update(update => update.Action("Update", "Controller"))
                        .Destroy(update => update.Action("Destroy", "Controller"))
                    )
                )
The above code loads the grid fine, I can trigger all the actions correctly, and they all work great.

My problem comes in when I edit a row, and the field I need to change is a DropDownList. For this particular issue, it is a list of States. We are using popup edit mode, and have a custom editor template.

This is the Editor Template code.
@(Html.Kendo().DropDownListFor(m => m.StateId)
        .Name("StateId")
        .DataTextField("StateName")
        .DataValueField("StateId")
        .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action("GetStatesList", "Controller");
            })
            .ServerFiltering(true);
        })
        .SelectedIndex(0)
        .OptionLabel("Select a State")
    )

The control successfully loads the states, and binds to the model, and shows the correct state value, if there is one provided. In our database, the StateId field is Nullable, and I think this is where the problems arise. 

For completeness, here is the controller function that populates the state list.
public JsonResult GetStatesList()
{
    var states = client.GetStates();
    return Json(states, JsonRequestBehavior.AllowGet);
}
the client.GetStates() returns an IEnumerable<State> collection.

NOTE: This exact same code works in a non-grid view in our MVC project.

Now, when the StateId is populated on load, it will display the correct state in the DropDownList. If I change this state and click the Update button on my popup editor, the Update Action is triggered, model.StateId = NewIDSelected and the change gets saved to the database. Now if the StateId is NULL from the database, obviously no state is selected, but now, if I select a state from the DropDownList, and click the Update button on my editor, the Update Action is not triggered, and no change is saved to the database.

To add to that, if I change any other field on the editor (say change or add the street address)  in addition to the State change (from null to a state value), the Update Action is correctly triggered, but the model.StateId = null.

As I stated before, this exact same scenario works perfectly on a view that does not use a grid at all (as a matter of fact the popup editor is an exact duplicate of that view).

Can anyone help me figure out how to fix this? We have got around it by using a plain HTML DropDownList, but it is ugly ugly... but it works.

I am using Chrome, .net Framework 4, kendo Q1 2013
Jeff Goldsack
Top achievements
Rank 1
 answered on 04 Jun 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?