Questions on Kendo UI for jQuery Forum

1 answer

272 views

Hi,

Populating ObservableArray using ajax does not trigger combobox refresh when ObservableArray initialized using empty array. What is the reason for this behavior?

This works (jsfiddle):

var vm = kendo.observable(new function () {

var self = this;

self.data = new kendo.data.ObservableArray([{}]);

self.selection = 0;

setTimeout(function () {

self.data.empty();

self.data.push(

{ id: 0, name: "E1" },

{ id: 1, name: "E2" },

{ id: 2, name: "E3" }

);

}, 30);

});

kendo.bind($("#sample"), vm);

This does not work (jsfiddle):

var vm = kendo.observable(new function () {

var self = this;

self.data = new kendo.data.ObservableArray([]);

self.selection = 0;

setTimeout(function () {

self.data.empty();

self.data.push(

{ id: 0, name: "E1" },

{ id: 1, name: "E2" },

{ id: 2, name: "E3" }

);

}, 30);

});

kendo.bind($("#sample"), vm);

<div id="sample">

<select data-role="combobox"

data-text-field="name"

data-value-field="id"

data-bind="value: selection, source: data">

</select>

</div>

MVVM

answered on 28 Apr 2014

3 answers

216 views

Kendo HTML Helper with VB in Razor/Webforms

I've look everywhere but all the code/examples I can find for Kendo UI MVC helper appear to be in C#.

Can someone point me at the VB samples or confirm Kendo only works with C#.

General Discussions

answered on 28 Apr 2014

1 answer

121 views

Kendo UI based Business Application

We are planning to develop a critical Business application around Sales Loyalty programs based on Kendo UI HTML and .Net Web APIs. Are there are case studies/real life examples of businesses developing complete applications using Kendo UI HTML controls and Web APIs. Could you please share information as we need to convince the customer on using Kendo UI (HTML) for complete application development.

General Discussions

answered on 28 Apr 2014

2 answers

84 views

Lose Header When Many List Items and tab through to the bottom

Hello,

I have a list view with a header. It is working fine until the list gets many. The currently we have 32 items. The problem is that when we are tabbing through the items, entering values all the way to the last item and then we try to scroll back to the top, it won't let us. It springs back to the middle and cannot get to the top nor get to the header. We have navigation buttons at the top and it is important that we get to the header. Is there any way to resolve this?

This happens in iPhone, IPad, Safari, and IE 11. All do the same thing.

My html is below (omitted in the middle since there are more than 30 items in the list):

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<script src="./Scripts/KendoUI/jquery.min.js"></script>
<script src="./Scripts/KendoUI/kendo.mobile.min.js"></script>
<script src="./Scripts/KendoUI/console.js"></script>
<script src="./Scripts/jquery.signaturepad.min.js"></script>
<script src="./Scripts/json3.min.js"></script>
<link href="./Content/KendoUI/kendo.mobile.all.css" rel="stylesheet" />
</head>
<body>
<div data-role="view" data-title="BUBBA" id="edit-event-view" >
<header data-role="header">
        <div data-role="navbar">
            <a data-align="right" data-role="button" class="nav-button" >Log Out</a>
            <a data-align="left" data-role="button" class="nav-button">Main</a>
            <span id="edit-event-title" data-role="view-title" />
        </div>
</header>
<ul data-role="listview" >
    <li style=""><label for="f15303">First Name</label><input type="text" id="f15303" value="" style="text-transform: uppercase;" text-casing="3" /></li>
    <li style=""><label for="f15304">Middle Name</label><input type="text" id="f15304" value="" style="text-transform: uppercase;" text-casing="3" /></li>
    <li style=""><label for="f15305">Last Name</label><input type="text" id="f15305" value="" style="text-transform: uppercase;" text-casing="3" /></li>
    <li style=""><label for="f15306">Suffix<select id="f15306" style="text-transform: uppercase;" ><option value="0"> </option><option value="3">I</option><option value="4">II</option><option value="5">III</option><option value="6">IV</option><option value="11">IX</option><option value="1">JR</option><option value="2">SR</option><option value="7">V</option><option value="8">VI</option><option value="9">VII</option><option value="10">VIII</option><option value="12">X</option></select></label></li>
....(Omitted)
    <li style=""><label for="f15307">Sex<select id="f15307" style="text-transform: uppercase;" ><option value="" selected="selected"></option><option value="M">Male</option><option value="F">Female</option><option value="U">Unknown</option></select></label></li>
<li style=""><label for="f15520">How Injury Occurred</label><textarea id="f15520" style="text-transform: uppercase;" text-casing="3" ></textarea></li>
<li style=""><label for="i15405" >Year of Death</label><input type="text" id="i15405" class="readonly-text" value="" default-value="" style="text-transform: uppercase; background-color: silver; " ></li>
<li style=""><label for="i15576" >Alert Count</label><input type="text" id="i15576" class="readonly-text" value="" default-value="" style="text-transform: uppercase; background-color: silver; " ></li>
</ul>
</div>
<script>
      window.kendoMobileApplication = new kendo.mobile.Application(document.body);
</script>
</body>
</html>

Thanks!

ListView (Mobile)

answered on 28 Apr 2014

2 answers

167 views

Grid behaves like a TreeView

Hello,

We would like to find a way to implement a Grid. When we click row, we want to be able to show subrow. But Is there any way or best practice to do that?

You can find a mockup as attachment. I think it would be more clean for everyone.

Many many thanks to your help,

Grid

answered on 28 Apr 2014

2 answers

149 views

[Solved] k-pager-info misaligned when grid has frozen columns and Pageable pagesize is set to true in Firefox

Hello Kendo Team,
It seems that k-grid-lockedcolumns style makes that k-pager-info appears misaligned in Firefox when you set pagesize option to true of the Pageable configuration object.
You can see this effect in this link: http://trykendoui.telerik.com/ItuL

Why does k-grid-lockedcolumns style have White-space: nowrap?

Kind regards.
Oscar.

Grid

answered on 28 Apr 2014

3 answers

329 views

no icons shown

Hello

Kendo UI:    2014.1.318
OS:              Windows7 32bit
VS:              2012

As a beginner in mobile app and Kendo UI this might be odd, but I couldn't find the solution myself.

From the examples I implemented the scheduler in the MVVM project that is prepared by opening a new Kendo project in VS.
The app is running. The views, today button and scrolling work.
But the arrow icons are not shown, neither in tablet nor phone mode.
Do I need to add icons or shapes for it? I suppose yes, but which one and where?

Thank you for any help!

Martin

Scheduler

answered on 28 Apr 2014

1 answer

351 views

[Solved] MultiSelect on losing focus still have class "k-state-focused"

MultiSelect on losing focus still have class "k-state-focused".
Its very noticeable with Bootstrap theme when blue glowing stays on Multiselect when focus is lost already.

When do you plan to have some Service Pack release for latest version of Kendo Controls?

Thanks,
Val

MultiSelect

answered on 28 Apr 2014

1 answer

138 views

RadialGauge Title and Value

I need to export an image of a RadialGauge. I would like to have a title and value included in the image. Is there anyway to do this?

Charts

answered on 28 Apr 2014

2 answers

117 views

DataSource mysteriously adding an "M" character to my ID upon update

When I submit an update given my data source, it generates the following HTTP request. Note the TEIID_TEST(2M) part - it should just be 2, corresponding to a numeric ID of 2:

PUT http://amr-dsiprod05:8080/odata/SDA/TEIID_TEST HTTP/1.1

Content-Type: application/json

Accept-Language: en-us

Authorization: Basic dXNlcjp1c2Vy

Accept: application/json, text/javascript, */*; q=0.01

Accept-Encoding: gzip, deflate

User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; MS-RTC LM 8)

Host: amr-dsiprod05:8080

Content-Length: 147

Connection: Keep-Alive

Pragma: no-cache

{"__metadata":{"uri":"http://amr-dsiprod05:8080/odata/SDA/TEIID_TEST(2M)","type":"SDA.TEIID_TEST"},"NAME":"test","FAVORITE_COLOR":"Blues","ID":"2"}

Here's my code:

<script type="text/javascript">
jQuery.support.cors = true;
var call = $.ajax({
url: "http://amr-dsiprod05:8080/odata/SDA/TEIID_TEST",
type: "GET",
headers: {
Authorization: "Basic dXNlcjp1c2Vy"
},
dataType: "json",
success: function(data){
var results = data.d.results;
var len = results.length;
var text = '<p>Successfully fetched ' + len + ' rows from the database</p>';
$('#RESULT').html(text);
},
error: function(err){
//alert(err.statusText);
$('#RESULT').html('<p>Failed to fetch data due to ' + err.statusText);
}
});
call.done(function (data, textStatus, jqXHR) {
$('#example').dataTable({
"bDestroy": true,
"bProcessing": true,
"aaData": data.d.results,
"aoColumns": [
{ "mData": "NAME" },
{ "mData": "FAVORITE_COLOR" },
{ "mData": "ID" }
]
});
});
call.fail(function (jqXHR,textStatus,errorThrown){
alert("Error retrieving Tasks: " + jqXHR.responseText);
});
</script>

Thoughts? Why does the M appear?

Data Source

answered on 28 Apr 2014