Questions on Kendo UI for jQuery Forum

1 answer

134 views

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

108 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.

Date/Time Pickers

answered on 09 Sep 2013

1 answer

175 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

115 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

194 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

54 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

297 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

847 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

133 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

7 answers

1.0K+ views

Add items afer databind

After my DS rebinds the combo boxes I need to add a couple items at index 0 on the combos.

...so now I'm pretty sure I could just jQuery them in there...is that the proper way??

**EDIT** I'm sorry, this should be in the DropDownList area!...same question though :)

Steve

ComboBox

answered on 09 Sep 2013