Questions on Kendo UI for jQuery Forum

3 answers

285 views

How do you set the initial values of a RangeSlider?

I am using MVC style API to test and develop these tools.
I am using a range slider

    @(Html.Kendo().RangeSlider()
         .Name("yearRange")
         .Min(2000)
         .Max(DateTime.Today.Year)
         .SmallStep(1)
         .LargeStep(5)
         .Values(new double[] { 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2010, 2011, 2012, 2013 })
)

but I cannot see the property to set the initial value of this control.

can someone help me please :)

Slider

answered on 20 Dec 2013

1 answer

227 views

Splitting Data over multiple Views

Good day

I have the following task at hand.

I have a datasource which contains my data. I have more data then in the simple example but for explaining it will do.

For example

Name
Phone number
Shoe size
Age

At the moment I get the data from my SQL server by Web API returning JSON and I use a template to display the data on one view.

Now to make the icenium app a bit more userfriendly (I get more daten then in the example) I want to split the data over multiple views and use a tabstrip footer.

so views would be

view-name
view-phone
view-shoe
view-age

I have no problem implementing the views, tabstrip footer and so on.

What I don't know is how to split the data into 4 templates to bes used on 4 views . I want to make only one trip to the database of course.

Is this possible?

Markus

Here is the real code I am using at the moment.

Function is called from another view and redirects to the one view at the moment.

function getDetails(userID) {

app.navigateTo("#view-firmen-details") ;

var dataSource = new kendo.data.DataSource({

type: "json",

transport: {

read: {

url: "http://mobile.mydomain.com/api/T_users/GetUserByID/?id=" + userID,

data:{

Accept: "application/json"

}

},

});

$("#notfilterable-details").kendoMobileListView({

dataSource: dataSource,

template: $("#firmen-details-template").text(),

dataBound: function(e) {

$("#User_text1").html($("#User_text1").html().replace(new RegExp("../images/kunden", "g"), 'http://www.zuol.ch/images/kunden'));

},

});

}

This is a how I display the data at the moment

<div data-role="view" id="view-firmen-details" data-layout="drawer-layout-back-firmen-details" data-title="Gewählte Firma" >

<div data-role="content" class="view-content" >

<div id="notfilterable-details">

</div>

<script type="text/x-kendo-tmpl" id="firmen-details-template">

<h2>#=User_firmaname#</h2>

<h4>

Adresse & Kontakt

</h4>

<p>#=User_strasse# <br />

#=User_plz# #=User_ort# <br /><br />

Jetzt anrufen: <a href="tel:#=User_telefon#">#=User_telefon# </a><br /><br />

Seite öffnen: <a href="javascript:window.open('#=User_internet#','_blank','location=yes');" target="_blank">#=User_internet#</a> <br /> </p>

<h4>

Öffnungzeiten

</h4>

<table style="width:90%;margin-left:5%;font-size:0.9em;">

<tr>

<td>

<b>Montag</b>

</td>

<td> </td>

<td>

#=User_montag#

</td>

</tr>

<tr>

<td>

<b>Dienstag</b>

</td>

<td> </td>

<td>

#=User_dienstag#

</td>

</tr>

<tr>

<td>

<b>Mittwoch</b>

</td>

<td> </td>

<td>

#=User_mittwoch#

</td>

</tr>

<tr>

<td>

<b>Donnerstag</b>

</td>

<td> </td>

<td>

#=User_donnerstag#

</td>

</tr>

<tr>

<td>

<b>Freitag</b>

</td>

<td> </td>

<td>

#=User_freitag#

</td>

</tr>

<tr>

<td>

<b>Samstag</b>

</td>

<td> </td>

<td>

#=User_samstag#

</td>

</tr>

<tr>

<td>

<b>Sonntag</b>

</td>

<td> </td>

<td>

#=User_sonntag#

</td>

</tr>

</table>

<p>

<span id='User_text1'>#=User_text1#</span>

</p>

</script>

</div>

What I basicly want is to spread the content of

firmen-details-template

on 4 views.

--------------

Hope someone can understand what I am trying to do :-)

Markus

General Discussions

answered on 20 Dec 2013

5 answers

117 views

iPad: tabstrip moving with the keyboard, visible even if display: none

My tabstrip should be fixed to the bottom of the screen and stay behind the keyboard when the keyboard opens up, instead it moves up with the keyboard. As a workaround, I tried doing this when the keyboard opens:

$('#tabstrip-tablet').css('display', 'none');

Then showing it again when the keyboard closes. This works in the icenium simulator but does not work on the ipad itself. Why the inconstancy and what is the correct way to handle this?

TabStrip (Mobile)

answered on 20 Dec 2013

0 answers

150 views

bootstrap theme & PanelBar preselected

Hy

-----
Looks like an issue with my Internet Explorer. I've testet it on several other computers with the same configuration and it's working fine!
-----

We generate the html for the panel bar on the server side. For preselecting the right item, we set the k-state-active style on the selected li element.
This works fine in all browsers except when the bootstrap theme is used in combination with internet explorer (I have tested it with ie11, win8, It works with ie11 and win7!)

If you open the following jsfiddle Bootstrap theme in firefox, or chrome, the page renders correctly (panel bar with preselected item Submenu 2/Item2 and the table with borders). If you open the same jsfiddle in internet explorer, then the table will lack the borders (you can hover the table and the borders will appear).

If you change the kendo ui theme to something different then bootstrap (e.g silver, jsfiddle With Silver Theme) then the table renders correctly in all browser (including ie!).

When you remove the preselecting in the panel bar using the css-classes (k-state-active), the table renders correclty, too!

Could you please investigate this behavior?

Kind Regards

PanelBar

asked on 20 Dec 2013

1 answer

71 views

Tabstrip Stays Visible when Keyboard Opened

This did not use to happen and has just started with the new releases of Kendo UI Mobile.

Even after implementing the fix described here:
http://docs.icenium.com/troubleshooting/known-issues
[NEW] When you build and deploy the Kendo UI Mobile or Kendo UI DataViz project templates on iOS devices, you might experience the following issues.When you rotate the device, the tabstrip disappears.When you tap an input box, the keyboard might overlay input box even if the Keyboard plugin is enabled.Workaround: Use the following code.

document.addEventListener("orientationchange", fixViewResize);

document.addEventListener('deviceready', function () {
navigator.splashscreen.hide();
fixViewResize();
}, false);

function fixViewResize() {
if (device.platform === "iOS") {
setTimeout(function() {
$(document.body).height(window.innerHeight);
}, 10);
}
}

Here's a link to another customer having the same problem:
http://www.kendoui.com/forums/kendo-ui-mobile/tabstrip/ipad-tabstrip-moving-with-the-keyboard-visible-even-if-display-none.aspx

And this link really describes the hack needed to keep the Tabstrip from floating up:
http://www.icenium.com/resources/forums/icenium-general-discussion/click-on-input-levels-up-the-footer-on-the-keyboard-whitout-change-the-view-!-

Please see attached screenshot.

TabStrip (Mobile)

answered on 20 Dec 2013

0 answers

45 views

Test

General Discussions

asked on 19 Dec 2013

5 answers

93 views

Where to start...?

I have an existing .net web application for my customers. I would like to make some of the functionality available to them on their smart devices. I've looked at a few of the kendo ui mobile demos and don't see how to add mobile capability to my existing web. It appears that the demos are creating new applications, not modifying existing ones. Can someone point me in the right direction? Thanks

General Discussions

answered on 19 Dec 2013

5 answers

629 views

Too Much Recursion

When I bind to a remote data source that returns this data:

[{"Id":1,"Name":"N0014E0","Devices":null},{"Id":2,"Name":"N0014E1","Devices":null}]

I receive a Too Much Recursion Error.

Modified code from the demo:

var serviceRoot = "http://localhost:8211";

homogeneous = new kendo.data.DataSource({

transport: {

read: {

url: serviceRoot + "/reporting/JsonControllers",

dataType: "jsonp"

}

},

schema: {

model: {

id: "Id",

name: "Name",

}

});

$("#treeview").kendoTreeView({

dataSource: homogeneous,

dataTextField: "Name"

});

TreeView

answered on 19 Dec 2013

1 answer

131 views

Bug: ComboBox with contains filter on select element

Hy

I have created a small example (sorry for coping your source):
http://jsfiddle.net/jT4tv/

Enter in the combobox an arbitary value that does not exists as an option. Then use the tab control to change the focus (or click somewhere else on the page). Now set the focus in the tab control again and delete all content with the backspace key. The combobox will then reopen and your arbitary value (in my case abababa) is set in the text field again! Now the user has to delete the value again. Sometimes the value even appears multiple times, even much later!

I could not reproduce the issue with server filtering (for small data sets we use inline selects to reduce the number of requests) or when no filter is set.

I would appreciate it when you could investigate this issue.

Kind Regards

ComboBox

answered on 19 Dec 2013

6 answers

698 views

Marker colour

Hi,
How do you change the colour of markers on the Map widget? They seem to be generated as images from the markers.png file included in the selected KendoUI theme.
Is there a way to include additional marker symbols (with different colours) or to override the map widget methods used to add markers so that different custom images can be used?

Regards, Ian

Map

answered on 19 Dec 2013