Questions on Kendo UI for jQuery Forum

2 answers

433 views

Hi,

I am building an app, with a mobile switch, but i can not reset it to default state.
The value is resetted, but the graphic shows it still on "J", the onlabel.
How can I reset this switch completely without removing it from DOM??
Like if it is off for default, it should be off after reset, for it is on for default, it should reset to on, independed on what state it actually is.
<label for="bb" id="ms">Bla or blub?
<input type="checkbox" data-role="switch" id="BB-switch" name="bb" data-change="switchChange" class="rrform" data-off-label="N" data-on-label="J" value="false"/>
</label>
// reset whole formular to default settings
function reset(){
var $res = $("#rrform").get(0);
$res.reset();
$("#MWST-switch").removeAttr('checked');
}
reset();

Switch (Mobile)

answered on 09 Sep 2013

1 answer

136 views

Panel Bar for Kendo Mobile?

Is there a panel bar coming on new Kendo Version?

I have been trying to built my own with grouped datasource and template header and http://code.anotherwebstorm.com/apps/awsaccordion/

But in this case (and others) the accordion needs clean html to works fine. The ouput should be like below, but listviews generate more html.

<div id="accordion1">
<ul>
<li>
<h1>Heading 1</h1>
<div>
<span>one
</span>
</div>
</li>
<li>
<h1>Heading 2</h1>
<div>
<span>two
</span>
</div>
</li>
<li>
<h1>Heading 3</h1>
<div>
<span>tree
</span>
</div>
</li>
</ul>
</div>
Any suggestions?

General Discussions

answered on 09 Sep 2013

2 answers

114 views

All I get is a blank calendar when using both datetimepicker and datetime

I'm doing MVC4 with razor. I have tried using the datetimepicker with a grid and without and I get the same result. I suspect it is my CSS but I'm not very proficient at doing CSS. I use the kendo.common.min.css and kendo.default.min.css. I've changed the theme slightly for width and fonts on the grid.

My editor template is as follows, though I have the same problem when I use datetimepicker outside of grid.

@model DateTime?

@(Html.Kendo().DateTimePickerFor(m => m)
.Min(new DateTime(2010, 1, 1, 10, 0, 0)) //Set min time of the datetimepicker
.Max(new DateTime(2010, 1, 1, 20, 0, 0)) //Set min date of the datetimepicker
.Value(DateTime.Now) //Set the value of the datetimepicker

)

To use without the grid, i just included:
    <div id='to-do'>
@(Html.Kendo().DateTimePicker()
        .Name("datetimepicker")
        .Value(DateTime.Now)
)
</div>

My datetimepicker shows up with the month on top, nothing as far as the days, and then a bunch of gray space to the right. I'm at a loss as to what to try or what to furnish you.

DatePicker

answered on 09 Sep 2013

1 answer

178 views

Grid Calendar Language

Hello.

I have a question regarding language change. I was able to upload my language pack and change language for example for calendar in date picker. Is such a functionality available for grids calendar ?

Grid

answered on 09 Sep 2013

1 answer

121 views

Displaying a chart inside a Grid using the detail template

Hi I was just wondering if this is possible. When I try to do it I get an Invalid template error. Thanks

Grid

answered on 09 Sep 2013

3 answers

202 views

Hex Code Color Selection not user-friendly

Hello,

I tried the Color Picker and to select a color using the HexCode. However the preview doesn't update to show the right color. It only takes the color when you press enter. If you double click, the Hex Code is not applied. If you press the "Apply" button, it's also not applied. I'm using Safari on Mac. I find it difficult for a user to understand how to use the Hex Code. Is there a way that the preview color updates in real-time when you enter the Hex Code and to apply it in an easier manner?

Philip

ColorPicker

answered on 09 Sep 2013

1 answer

61 views

Android Text Inputs Scroll at seperate speeds compared to rest of the view.

On the latest build v2013.2.716 we are experiencing the same issues we previously mentioned in this post:

http://www.kendoui.com/forums/mobile/listview/android-use-native-scrolling-display-issue-on-list-view---android-4-1-2.aspx

However this isn't in relation to a particular listview, just a regular view with a google map, some inputs and buttons. When you scroll the inputs scroll at half speed while the rest of the view scroll at full speed, sort of like an unwanted parallax effect.

This does not happen when use native scrolling is disabled. I am sensing the problem is a similar css hack as the previously mentions forum answer solved our issues with a css fix for a similar natured problem.

This is happening on all versions of android we have tested: 4.1.2 and 4.2.2

Maybe instead of

.km-listview-wrapper {
-webkit-transform: none !important;
}

something like....

.km-tview-wrapper {
-webkit-transform: none !important;
}

General Discussions

answered on 09 Sep 2013

3 answers

304 views

Latest online resources for KendoUI Mobile

Displaying validation summary in Mobile Application
This sample project demonstrates how to display validation messages in KendoUI mobile applications.

ListView - Hierarchy
This sample project demonstrates how to configure ListView hierarchy using the filter method of the DataSource. Both local and remote data versions are included.

General Discussions

answered on 09 Sep 2013

5 answers

868 views

Multiple viewmodels sharing data

I am attempting to create wizard like view in which each page contains it's own viewmodel

I started out doing something like this to get the templates right:

<div id="example" data-template="template" data-bind="source: locales"></div>

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

<div>

<label data-bind="text: target"></label>

<select data-text-field="Filename" data-value-field="Path" data-bind="value: Path, source:parent().parent().uploadedFiles" data-role="dropdownlist"></select>

</div>

</script>

var viewModel = kendo.observable({

uploadedFiles : [{Filename:"...", Path:""}, {Filename:"1", Path:""}, {Filename:"2", Path:""}],

locales: [{ target: 'German'}, { target: 'French'}, { target: 'Italian'}, { target: 'Japanese'}, { target: 'Chinese (Simplified)'}]

});

kendo.bind($("#example"), viewModel);

Everything works fine: http://jsfiddle.net/RyD54/

However, the subsequent pages need to have knowledge of the previous pages viewmodel's data in order to properly display options.

I have tried directly accessing the second viewmodel like this:

<div id="example" data-template="template" data-bind="source: locales"></div>

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

<div>

<label data-bind="text: value"></label>

<select data-text-field="Filename" data-value-field="Path" data-bind="value: Path, source:uploadedFiles" data-role="dropdownlist"></select>

</div>

</script>

var viewModel2 = kendo.observable({

selectedLocales: ['German', 'French', 'Italian', 'Japanese', 'Chinese (Simplified)']

});

var viewModel = kendo.observable({

uploadedFiles : [{Filename:"...", Path:""}, {Filename:"1", Path:""}, {Filename:"2", Path:""}],

locales: viewModel2.selectedLocales

});

kendo.bind($("#example"), viewModel);

Which ends up producing garbage in the drop down lists. http://jsfiddle.net/LvyB3/

I have tried modifying the locales value to be a dependent observable, thinking that accessing the second viewmodel directly changes the scope:

var viewModel2 = kendo.observable({

selectedLocales: ['German', 'French', 'Italian', 'Japanese', 'Chinese (Simplified)']

});

var viewModel = kendo.observable({

uploadedFiles : [{Filename:"...", Path:""}, {Filename:"1", Path:""}, {Filename:"2", Path:""}],

locales: function() {

return viewModel2.get("selectedLocales");

}

});

kendo.bind($("#example"), viewModel);

But that produces the same garbage data. http://jsfiddle.net/yarut/

I'm not sure what I am doing wrong to access the uploadedFiles list properly.

Any help would be appreciated.

EDIT

The issue has become a bit more complicated: In production the list of source languages is going to be coming from a multi-select in the other viewmodel. My idea is to create a calculated field that builds a observableobject that contains the selectedLanguages, an instance of the uploadedFiles array and a selectedFile variable to hold the selection:

aspx:

<div id="example2">

<h5>Target</h5>

<select multiple="multiple" data-value-field="id" data-text-field="name" data-bind="source: availableLocales, value: selectedLocales"></select>

</div>

<div id="example">

<div data-template="template" data-bind="source: locales"></div>

</div>

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

<div>

<label data-bind="text: target"></label>

<select data-text-field="Filename" data-value-field="Path" data-bind="value: selectedFile, source:files" data-role="dropdownlist"></select>

</div>

</script>

javascript:

var viewModel2 = kendo.observable({

selectedLocales: [],

availableLocales: [{id:1, name:'German'}, {id:2, name:'French'}, {id:3, name:'Italian'}, {id:4, name:'Japanese'}, {id:5, name:'Chinese (Simplified)'}]

});

var viewModel = kendo.observable({

uploadedFiles : [{Filename:"...", Path:""}, {Filename:"1", Path:""}, {Filename:"2", Path:""}],

locales: function() {

var selected = viewModel2.get("selectedLocales");

var availableFiles = this.get("uploadedFiles");

var processedLocales = [];

for (var i = 0; i < selected.length ; i++) {

processedLocales.push({ target: selected[i].get("name"), files: availableFiles, selectedFile: null });

}

return processedLocales;

}

});

kendo.bind($("#example2"), viewModel2);

kendo.bind($("#example"), viewModel);

fiddle: http://jsfiddle.net/fHrVK/

Of course this doesn't work either...

MVVM

answered on 09 Sep 2013

1 answer

137 views

Can the Schedular work with a MySQL database?

The existing datasource seems to want to connect via PDO constructor with a direct path to a database file. As I do not know the direct path to my database file, how would I connect to a database using a MySQL connection string instead with a predefined server, username, password and database where the equivalent mysqli constructor would be:

new mysqli($server, $username, $password, $myDB);

Paul

Scheduler

answered on 09 Sep 2013