Questions on Kendo UI for jQuery Forum

1 answer

43 views

Bug in ListView when editing after creation of a new item

Hi,
I apologize if this is not the right forum, but I didn't find any bug report utilities inside kendoui.com.
To topic: according to the thread title, I think there is a bug inside the list-view when editing a listitem after the creation of a new one. Please feel free to proceed the following steps and see for yourself. The problem also appears when using the Kendo UI demo page:
http://demos.kendoui.com/web/listview/editing.html
Step 1: add a new item
Step 2: don't cancel creation and try to edit another record
Step 3: edit a second record without canceling the 2nd
Wright now the record from step 2 has overwritten the record from step 3, so that there are the same records twice inside the view. e.g. Chai - Chang - Chang - Chef Anton's Cajun instead of Chai - Chang - Aniseed Syrup - Chef Anton's Cajun

This behaviour has no effect on some sort of datasource or observable, these objects are ok. It seems to be a bug inside the listview widget itself.

Best regards
Thommy

ListView

answered on 15 May 2013

5 answers

1.4K+ views

How to add a delete button to editor template Grid Popup?

Hello all,

I have a kendo window delete confirmation box I created. The delete gets called on the click event of a button. I want to add this button beside the usual buttons that come up in the editor template grid popup automatically such as update cancel etc? I tried adding the following to the template itself:

<a class="k-button k-button-icontext k-grid-update" href="\\#"><span class="k-icon k-update"></span>Update</a>
<a class="k-button k-button-icontext k-grid-delete" href="\\#"><span class="k-icon k-delete"></span>Delete</a>
<a class="k-button k-button-icontext k-grid-cancel" href="\\#"><span class="k-icon k-cancel"></span>Cancel</a>

But the other buttons still show up above these when I do that. In the grid I have:

.Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("CustomerTemplate").Window(w => w.Title("Customer Detail").Name("editWindow").Width(850).Height(565)))

Grid

answered on 15 May 2013

1 answer

182 views

Bind to datasource twice

Hi

I've a datasource 'groups' in a viewmodel, which I bind to a kendo-listview.
No I want to bind that same datasource to a second simple ul-element, but unfortunately that doesn't seem to work. What am I doing wrong here?

All I get is a weird element inside the ul with some javascript in it.

<ul id="groupViewSelect" data-bind="source: groups" class="dropdown-menu" data-auto-bind="false">

</ul>

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

<li><span data-bind="text: Name"></span></li>

</script>

contactsGroupDataSource = new kendo.data.DataSource({

transport: {

read: {

url: "api/contactgroups"

}

},

schema: {

model: {

fields: {

Number: { type: "integer" },

Name: { type: "string" }

}

});

viewModel = kendo.observable({

groups: contactsGroupDataSource

});

Data Source

answered on 15 May 2013

2 answers

228 views

Showing min and max of a series inside of chart

Hi everyone,

I would like to display two horizontal lines for minimum and maximum values of a series in a chart. My current approach is to find the min and max values by hand and create two additional series where all points have the same value. The visual result is ok, but since I am refreshing the chart every couple of seconds the performance is not very good on mobile devices. Is there a way to create those horizontal min/max lines differently or is it possible to create a series with just two points that fills to complete width of the chart?

Best regards,

Pascal

Charts

answered on 15 May 2013

9 answers

431 views

NavBar display

Hi,

Is there anyway to always display NavBar on the top in all devices?

Thanks,
Dan

NavBar

answered on 15 May 2013

1 answer

479 views

Bind Json Object to LisiView

Hi,
I am retrieving data from database into JSON object using $.ajax method. I want to bind that data to listview. I am using following example. but in following example json has read from the file but I don't .json file I've an object which I need to bind. Can anyone tell me how to bind json object.
<script type="text/javascript">
    var clientData = null;
    // Urls to access the WCF Rest service methods
    var GetClientUrl = "http://localhost:1000/Service/GetClients/agentId=AG9898";

    function initListView() {
        $.ajax({
            cache: false,
            type: "GET",
            async: false,
            dataType: "json",
            url: GetClientUrl,
            success: function (clients) {
                if (clients != null && clients != "undefined") {
                    clientData = clients.Clients;
                }
            },
            error: function (xhr) {
                clientData = null;
                alert(xhr.responseText);
            }
        });

        var ds = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "team.json", //Here instead reading a data from file it should read from json object i.e. clientData
                    dataType: "json"
                }
            },
            change: function () {
                //debugger;
            }
        });
        $("#fixed-listview").kendoMobileListView({
            dataSource: ds,
            template: "#:SortName#"
        });
    }
</script>

ListView (Mobile)

answered on 15 May 2013

1 answer

59 views

Setting the ul element for the AutoComplete to update

I have a situation where I would like the AutoComplete control to populate a specific ul element rather than the default drop down list. Here is a jsfiddle that demonstrates what I am trying to do.

This works OK to a point, but I notice the list loses pretty much all of the functionality that the AutoComplete drop down list has, such as keyboard navigation and item select events.

Is there any way to make this work without sacrificing so much functionality?

AutoComplete

answered on 15 May 2013

3 answers

654 views

Setting Values from Remote Data Source

I have a multi select control which allows users to select items, I save the selected items to a database. When the page is next loaded I want to retrieve the list of items from a remote data source but also set the currently selected items.

My code is:

$('#componentList').kendoMultiSelect(
{
autoBind: false,
dataTextField: 'COMPONENT_NAME',
dataValueField: 'COMPONENT_ID',
dataSource: {
transport: {
read: {
url: '/Data/GetData'
dataType: 'json'
}
},
schema: {
data: function (data) { //specify the array that contains the data
return data.fullList;
}
}
});

As you can see my web service returns the data in the field fullList, I also have another field called selectedList on my datasource. How do I set the values from that? Do I have to do a seperate ajax call to get the selected data or can this be done in a single server round trip?

Thanks.

MultiSelect

answered on 15 May 2013

1 answer

158 views

Bubble Count Control on list

Hi,

Will there be any bubble count like jQuery's http://jquerymobile.com/demos/1.2.0/docs/lists/lists-count.html any time soon ?

Thanks

ListView (Mobile)

answered on 15 May 2013

1 answer

416 views

Duplicate Multiple Inserts on Update Insert and Delete commands

The code (nothing wrong with the code)

@(Html.Kendo().Grid<CourseTypeViewModel>()

      .Name("MyCourseTypesGrid")

      .Editable(e => e.Mode(GridEditMode.InLine))

      .ToolBar(toolbar => toolbar.Create().Text("New Course"))

      .Columns(columns =>

          {

              columns.Bound(o => o.Title);

              columns.Bound(c => c.IsActive).Width(60);

              columns.Bound(c => c.DotCourse).Width(60);

              columns.Bound(c => c.RenewalInterval).ClientTemplate("#=RenewalInterval# (#=TimeFrame#)").Width(60);

              columns.Bound(c => c.TimeFrame).Width(80);

              columns.Command(command =>

                  {

                      command.Edit();

                      command.Destroy();

                  }).Width(200);

          }).Sortable().Pageable().Groupable()

        .DataSource(datasource => datasource

        .Ajax()

        .Model(p => p.Id(m => m.Id))

        .Create(create => create.Action("InsertCourseType", "Admin"))

        .Read(read => read.Action("CourseTypesGridData", "Admin"))

        .Update(update => update.Action( "UpdateCourseType", "Admin"))

        .Destroy(delete => delete.Action("DeleteCourseType", "Admin"))))

Just posting this because I saw some similar posts that seemed unanswered
I was having some problems in that whenever I updated an item in my grid I was finding new records filling up
my database.
Update the record
During debugging I was seeing that the insert method was being called multiple times instead of the expected update. This was very frustrating.
10 new rows
I noticed that the the number of new phantom rows was equal to the number of records showing on the page.
The solution
It seems that the update or insert for the grid is based on the id being zero. I don't know what this would mean for other types. Anyhow, the problem is that in my viewmodel code I had forgot to copy over the primarykey ids so they were all zero.
The kendo grid
Apparently, decides to do an insert for every PrimaryKey equalling zero. If a non-zero value is there the update method is called.

Grid

answered on 15 May 2013