Telerik Forums
Kendo UI for jQuery Forum
2 answers
2.2K+ views
We have data bound to a combox, all is working fine. When the user clicks the dropdown the list of items appears and is showing data assigned by the template  -> template: "#=FirstName # #=LastName #,  #=CompanyName #",
        
However, once the user selects something the datatextfield is shown, where as we want the same template shown. How can we do this?

Thanks - here is our code.


 $(this).kendoComboBox({
                placeholder: "Select A Client...",
                //dataTextField: 'LastName',
                dataValueField: 'ContactID',
                template: "#=FirstName # #=LastName #,  #=CompanyName #",
                filter: "contains",
                autoBind: false,
                minLength: 3,
                text: $(this).attr('data-text'),
                dataSource: {
                    type: "odata",
                    serverFiltering: true,
                    serverPaging: true,
                    page: 1,
                      pageSize: 50,                    
                    sort: { field: "Name", dir: "asc" },
                    filter: filter,
                    transport: {
                        read: {
                            url: "/ajax/comboContactFilter.json",
                        }
                    }
                }
            });
Eric
Top achievements
Rank 1
 answered on 27 Mar 2014
2 answers
249 views
Hello, I'm fairly new to Kendo & HTML5 so please bare with me. I'm looking for an example on how to actually use the values in the controller so that I can pass them to my BLL for processing but I can't seem to find anything where the values are being used in the controller. What am I missing?

Thanks!
Cool Breeze
Top achievements
Rank 1
 answered on 27 Mar 2014
1 answer
266 views
Im using the drawer to display a dynamic number of remote views. A PHP page is used to display the views:

data-views="['drawer-home', 'drawer-settings',  'item.php?id=1',  'item.php?id=2',  'item.php?id=3' ]

Loading the first view with Item 1 works fine, but then when switching to Item 2 the framework seems to think that it is the same page and displays the Item 1 view again.

How can I fix this?

And a second question, is it possible to force and update of a remote view? (Reload)
Petyo
Telerik team
 answered on 27 Mar 2014
2 answers
277 views
I have implemented custom rules for the Kendo Validator.  I would like to be able to use a format string for my error message and replace parameters in it with values from the validation.  For example, on the server side I am using a format string of: "{0} cannot contain two groups with the name '{1}'." and I replace {0} with a friendly name of the input and {1} with the duplicated group name (a value available as a result of the validation logic).  If I use this same string as the error message for the Kendo validation rule, the {0} is being replaced automatically by the value of the "name" attribute on the input being validated, and the {1} is being removed.

Is there a standard way for me to provide my own values to format the validation error message?

Thanks,
Brian
Brian
Top achievements
Rank 1
 answered on 27 Mar 2014
6 answers
312 views
I am using the MVVC pattern in my application.

On one view I am calling another view and passing a variable on "click" via  a dynamic ListView.  The datasource is being populated onShow.

It is working as expected on first usage but if 1) go BACK and choose another option OR 2) complete the first entry and try to create a new one - it blows trying to read the e.dataItem.{somevar}. Ideas why?

app.myService = {
        onShow: function (e) {
         ....
            $("#lvLevel2Options").kendoMobileListView({
                dataSource: kendo.data.DataSource.create({data: ds }),
                template: $("#templateCategoryLevel2").html(),
                click: app.myService.categoryClicked
            });
       }
 
        categoryClicked: function (e) {
 
            //It blows HERE but only on second pass
            var id= e.dataItem.id;
             ....
       }

Other info:  I checked the source of the List and see the data-uid values are changing each time i view the page as I would expect since the datasource is being refreshed onShow (it needs to be because it is dynamic filtered data).

Petyo
Telerik team
 answered on 27 Mar 2014
1 answer
103 views
I posted on StackOverflow http://stackoverflow.com/q/22665913/7850 but it's not getting much attention there, so here I am on these forums...
Sebastian
Telerik team
 answered on 27 Mar 2014
3 answers
387 views
Kendo UI version: 2013.3.1324
OS's:
- Windows 8.1 Pro
- Windows Server 2008 R2 Datacenter SP1
- Android 4.42 (Nexus 7 Build)
Browser versions:
- Internet Explorer 11.0.9600.16518 in emulation mode with user agent string Apple Safari (iPad)
- Google Chrome 33.0.1750.154m in emulation mode with devices "Apple iPad 3 / 4" and "Samsung Galaxy Tab 7.7, 8.9, 10.1"
- Google Chrome 33.0.1750.166 on Android 4.42 (Nexus 7 Build)
jQuery version: 2.1.0

On success of a jQuery post, we are setting the HTML contents of a Kendo UI Mobile View DIV with the content string below:
<form action="/Legend/Edit/89C29D66-7414-425F-89CD-3A580DFA8695" class="form-horizontal" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#AjaxReplace" id="form0" method="post" role="form">
<input data-val="true" data-val-number="The field Maximaal must be a number." data-val-required="The Maximaal field is required." id="ZoomMax" max="20" min="0" name="ZoomMax" type="range" value="20" />
<script>
jQuery(function(){jQuery("#ZoomMax").kendoSlider({"tickPlacement":"none","showButtons":true,"largeStep":5,"min":0,"max":20});});
</script>
<button class="btn btn-primary" type="submit">Submit</button>
</form>

As you can see, the ZoomMax value is 20, but the slider handle is positioned left and not draggable in the Mobile View. This is the case in IE and Chrome mobile emulation, as well on real mobile devices like the Asus/ Google Nexus 7. There are no errors in the browser console. See also the attached screenshot.

When setting an ASP.NET MVC view DIV with the same contents, the slider works normally.

Also, when setting Kendo Mobile View directly with the same contents, the slider works normally:
@(Html.Kendo().MobileView()
.Content(@<text>
<div id="legenditem-edit-container">
<form action="/Legend/Edit/89C29D66-7414-425F-89CD-3A580DFA8695" class="form-horizontal" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#AjaxReplace" id="form0" method="post" role="form">
<input data-val="true" data-val-number="The field Maximaal must be a number." data-val-required="The Maximaal field is required." id="ZoomMax" max="20" min="0" name="ZoomMax" type="range" value="20" />
<script>
jQuery(function(){jQuery("#ZoomMax").kendoSlider({"tickPlacement":"none","showButtons":true,"largeStep":5,"min":0,"max":20});});
</script>
<button class="btn btn-primary" type="submit">Submit</button>
</form>
</div>
</text>)
.Layout("MobileLayoutLegend")
.Name("LegendItemEdit")
.Title("Wijzig legenda-item")
)

How can we make a slider show the correct value and be draggable in a Mobile View which content is set using jQuery?
Ewoud
Top achievements
Rank 1
 answered on 27 Mar 2014
1 answer
194 views
Now, in importing products from Telerik Platforms there is only options : Kendoui Web, Kendoui Mobile, Kendoui Dataviz but there is no options Kendoui Complete ?

After downloading Kendoui Web, Kendoui Mobile, Kendoui Dataviz  Q1 2014  release, there is missing file "kendo.all.min.js" in Q1 2014  release.

Please help us in downloading completed version Kendoui Q1 2014 release.
Sebastian
Telerik team
 answered on 27 Mar 2014
1 answer
331 views
Hello,

We’re experiencing a problem on IE10 and 11 concerning the date picker calendar popup. The calendar popup immediately closes when the mouse moves out from the calendar button.
 
The date picker is part of a grid filter.

The kendo UI Grid is configured for Ajax Binding which generates the filter code.

The calendar popup behaves as expected when tested on IE9, Chrome and Firefox.

Calendar Popup Html Snippet
<div class="k-animation-container" style="left: 6.5px; top: 86.72px; width: 207px; height: 239px; overflow: hidden; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-left: 0px; display: none; position: absolute; z-index: 10002;"><br><br>        <div class="k-calendar-container<br>k-popup k-group k-reset" aria-hidden="true" style='line-height: normal; font-family: "Segoe UI", "Arial"; font-size: 13px; font-style: normal; font-weight: 400; display: none; position: absolute; font-stretch: normal; transform: translateY(-239px);' data-role="popup"><br><br>            <div class="k-widget k-calendar" id="7a220a39-81a2-4e85-a966-be5a672dcb3e" data-role="calendar"><br><br>                <div class="k-header"><a class="k-link k-nav-prev" role="button" aria-disabled="false" href="#"><span class="k-icon<br>k-i-arrow-w"></span></a><a class="k-link<br>k-nav-fast" role="button" aria-disabled="false" aria-live="assertive" aria-atomic="true" href="#">March 2014</a><a class="k-link k-nav-next" role="button" aria-disabled="false" href="#"><span class="k-icon<br>k-i-arrow-e"></span></a></div>

Date Picker HTML Snippet
<div class="k-column-menu k-popup<br>k-group k-reset k-state-border-up" style='line-height: normal; font-family: "Segoe UI", "Arial"; font-size: 13px; font-style: normal; font-weight: 400; display: block; position: absolute; font-stretch: normal; transform: translateY(0px);' data-role="popup"><br><br>        <ul tabindex="0" class="k-widget k-reset k-header<br>k-menu k-menu-vertical" role="menubar" data-role="menu"><br><br>            <li class="k-item k-columns-item<br>k-state-default k-first" role="menuitem" style="z-index: auto;"><br><br>                <span class="k-link"><span class="k-sprite<br>k-i-columns"></span>Display/Hide<span class="k-icon<br>k-i-arrow-e"></span></span><br><br>                <div class="k-animation-container" style="left: 173px; top: 0px; width: 221px; height: 200px; overflow: hidden; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-left: 0px; display: none; position: absolute; z-index: 10002;"><br><br>                    <ul class="k-group k-popup<br>k-reset" role="menu" style='line-height: normal; font-family: "Segoe UI", "Arial"; font-size: 13px; font-style: normal; font-weight: 400; display: none; position: absolute; font-stretch: normal; transform: translateX(-221px);' data-role="popup"><br><br>                        <li class="k-item k-state-default<br>k-first" role="menuitem"><span class="k-link"><input type="checkbox" data-field="BClassDescription" data-index="0">B Class</span></li><br><br>                        <li class="k-item<br>k-state-default" role="menuitem"><span class="k-link"><input type="checkbox" data-field="BLogicalName" data-index="1">Name</span></li>

Any help would be much appreciated. Thank you.
Alexander Valchev
Telerik team
 answered on 27 Mar 2014
1 answer
105 views
I just rendered a simple menu in a page both with grid, menu, charts. The menu took over 14 seconds to finish rendering. And all time was wasted on there 2 methods of kendoMenu: _initData  and _updateClasses. Is it a bug of menu?
Kamen Bundev
Telerik team
 answered on 27 Mar 2014
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Drag and Drop
Application
Map
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
DropDownTree
ListBox
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
LLM Kit
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?