Questions on Kendo UI for jQuery Forum

1 answer

102 views

Hi,

I was creating a list with inset style and I realized the last element of the list hasn't bottom border. After checking the CSS (http://cdn.kendostatic.com/2013.1.319/styles/kendo.mobile.all.min.css) I saw this:

.km-meego .km-listgroupinset .km-list>li:last-child{border:1 ps solid rgba(0,0,0,0.2);

There is not any other ps in the CSS and I never have seen something like that, maybe is a typo? And if not, why there is not bottom border?

General Discussions

answered on 10 Jul 2013

7 answers

598 views

List View data-click event returns e with undefined dataItem properties

Hi,
I've been having trouble getting at the data associated with a list view item. In the event handler for the data-click event event I get an event parameter that doesn't seem to have any of the properties referenced in the sdk. Only the data-item property is undefined.

onLibraryItemClick e:[object Object]
06-26 13:01:29.439 1203-1203/com.verbum.wordhose.android I/Web Console: app: onLibraryItemClick e:onLibraryItemClick e.item:[object Object]
06-26 13:01:29.459 1203-1203/com.verbum.wordhose.android I/Web Console: app: onLibraryItemClick e.target:[object Object] at :2
06-26 13:01:29.459 1203-1203/com.verbum.wordhose.android I/Web Console: app: onLibraryItemClick e.dataItem:undefined at :2

The weird thing is that I am able to add new items to listview and they render correctly. So the template seems to be wired up correctly.

The related HTML is:

<div id="libraryPage" data-role="view" data-layout="appLayout" data-title="library" data-init="initLibraryListView">

<p id="wh_status">disconnected</p>

<div class="head">Wordhose Library</div>

<ul id="library-listview"

data-role="listview"

data-init="initLibraryListView"

data-click="onLibraryItemClick">

</ul>

<script type="text/x-kendo-template" id="libraryListViewTemplate">

<h3 class="item-title">${Title}</h3>

<p class="item-info">Text Status Data Here</p>

</script>

</div>

The click event JS is:

function onLibraryItemClick(e) {

console.log("app: onLibraryItemClick e:" + e);

console.log("app: onLibraryItemClick e.item:" + e.item);

console.log("app: onLibraryItemClick e.target:" + e.target);

console.log("app: onLibraryItemClick e.dataItem:" + e.dataItem);

//console.log("app: onLibraryItemClick e.target:" + JSON.stringify(e.target));

_CurrentTextData = e.dataItem;

//console.log("app: e.dataItem.Title=" + e.dataItem.Title);

};

And the code that adds the json item to the dataSource is:

_LibraryListViewDataSource.add(sampleText);

Like I said, items get added and rendered correctly in the listview itself, but there's no associated dataItem.

Help :) ?

Thanks.

ListView (Mobile)

answered on 10 Jul 2013

1 answer

224 views

Date Picker changing width on mouse hover, causing table contents to shift

I've got a simple table with text in the left column cells, and inputs in the right. The first time the mouse hovers over a Date Picker in the right column, all the contents of the left column shift to the left by a few pixels. It appears that the Date Picker is slightly changing its width on hover.

I've tried adding a margin and padding on the cell with the Date Picker, to no avail.

DatePicker

answered on 10 Jul 2013

1 answer

220 views

Delete listview item using rowdelete detail button, and change the icon style when rowdelete button is clicked

Hi

I would like to achieve similar UI behaviour as IPhone when delete a item from a list, and want to show different icon when rowdelete button is clicked, but not idea how to achieve this using kendo mobile. could someone please assist me? thanks.

<script id="wordListEditTemplate" type="text/x-kendo-template">

<a data-role="listview-link">
<span><a data-role="detailbutton" id="wordRowDelete" data-style="rowdelete" data-bind="click:delete"></a></span>
${name}
</a>
#= renderWordDefinitionsTemplate(data) #
</script>

in the above code snippet, I have binded the click event to a delete function. In the delete function, I want to show different icon, and also show the "Delete" button on the right position.

Cheers

ListView (Mobile)

answered on 10 Jul 2013

1 answer

168 views

PanelBar not working in IE9

Please load the following simple panelbar example page in IE with the browser mode set to IE 9 and the the document mode set to IE 9 Standards. Not that the panelbar renders incorrectly. Can you provide feedback on what is wrong?

https://www.angpcorp.com/view-1/pbar.html

PanelBar

answered on 10 Jul 2013

1 answer

123 views

How to connect to CCTV?

Hi,
is there anyway to see CCTV 's cam ? do i need to find other plug-ins for this ?

Thanks..

General Discussions

answered on 10 Jul 2013

2 answers

149 views

Scroll View with data template

I am trying to use a template to render pages in a scroll view and I have run into some issues ... I have a jsFiddle that shows what I am trying to do the group has a red header with 'why does this not work'. I have a bunch of examples of things using templates and I don't understand why the template with the scroll view does not behave like the rest, could someone explain what I am missing?

http://jsfiddle.net/6RuHQ/6/

In case you are curious I am probably going to wind up with the last approach with my application since in some occasions I will end up with only 1 page and it looks silly as a scroller with 1 page (I'd rather just render that single page by itself).

ScrollView (Mobile)

answered on 10 Jul 2013

2 answers

221 views

[Solved] newline - data not saved

Anybody experienced this using Kendo UI Editor?

When typing a lot of text without a newline (Enter-button) everything saves just fine, but if anybody press the enterbutton to make the text more readable, the data just does not get saved. Being newbie on both mvc and kendo, I really need help getting past this problem..

Using OpenAccess ORM.

Thanks in advance.

public partial class Exercises

{

private string _note;

public virtual string Note

{

get { return this._note; }

set { this._note = value; }

}

Exercise.Note = drill.Comments;

DB.SaveChanges();

<div class="editor-label">

@Html.LabelFor(m=>m.Comments)

</div>

<div class="editor-field">

@Html.EditorFor(m=>m.Comments)

@Html.ValidationMessageFor(m=>m.Comments)

</div>

[Display(Name = "Comments", ResourceType = typeof(DisplayNameStrings)), UIHint("Editor")]

public string Comments { get; set

; }

Editor

answered on 10 Jul 2013

1 answer

108 views

[Solved] Source and template binding

Dear Sirs,

My question has to do with the sample referenced below.
http://demos.kendoui.com/web/mvvm/source.html
In that example an observable array is created with the following code:
products: [
{ name: "Hampton Sofa", price: 989.99, unitsInStock: 39 },
{ name: "Perry Sofa", price: 559.99, unitsInStock: 17 },
{ name: "Donovan Sofa", price: 719.99, unitsInStock: 29 },
{ name: "Markus Sofa", price: 839.99, unitsInStock: 3 }
]
I have been working on a similar example where I create a template and then bound the template to
an observable object using data that I created similar to the above. That code worked fine. When I
tried to create the data from a remote data source using a kendo data source the binding failed. I have looked at the demo where you bind a drop down list to a remote data source
http://demos.kendoui.com/web/mvvm/remote-binding.html
Questions:
1. Is there an example of how to take a source and template and bind it to an observable using data from a data source?
2. How do you create an observable array from a data source?

Scott

MVVM

answered on 09 Jul 2013

1 answer

108 views

[Solved] Bar Chart doesn't show graph

I am trying to write simple bar chart. Here is my controller

var test = new List<DataCenterSpaceViewModel>{new DataCenterSpaceViewModel { DataCenterName = "t1", AvailableSpace = 1, ConfiguredSpace = 3, ConsumedSpace = 2 },
new DataCenterSpaceViewModel { DataCenterName = "t2", AvailableSpace = 4, ConfiguredSpace = 5, ConsumedSpace = 2 }
};

return PartialView(test);

Here is my view

<div class="chart-wrapper">
@(Html.Kendo().Chart<SAN.ViewModel.DataCenterSpaceViewModel>()
.Name("DataCenterSpace")
.Title("DataCenter Space")
.Legend(legend => legend.Visible(false))
.DataSource(dataSource => dataSource
.Read(read => read.Action("DataCenterSpace", "Home") )
)
.Series(series =>
{

series.Bar(e => e.ConfiguredSpace).Name("Configured Space");
series.Bar(e => e.ConsumedSpace).Name("Consumed Space");
series.Bar(e => e.AvailableSpace).Name("Available Space");
}
)
.CategoryAxis(axis => axis
.Categories(e=>e.DataCenterName)
.MajorGridLines(lines => lines.Visible(false))
)
.ValueAxis(axis => axis
.Numeric()
.Max(10)
.Line(line => line.Visible(false))
.MajorGridLines(lines => lines.Visible(true))
)

.Tooltip(tooltip => tooltip
.Visible(true)
.Template("#= series.name #: #= value #")
)
)
</div>

I attached the result

Charts

answered on 09 Jul 2013