Telerik Forums
Kendo UI for jQuery Forum
1 answer
163 views
I am trying to use kendoui datasource to pull list of post into a listview with Hierarchical data binding from a Wordpress site using json. Please point me to the right direction in doing this, i have tried using kendoui datasource but no luck on this.

Below is  the code  i am  working with so far.

01.var dataSource = new kendo.data.DataSource({
02.  transport: {
03.    read: {
05.      contentType: "application/json; charset=utf-8",
06.      dataType: "jsonp", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
07.    }
08.  },
09. schema: {
10.    data: function(response) {
11.      return response.posts; // twitter's response is { "results": [ /* results */ ] }
12.    }}
13.});
14.dataSource.fetch(function(){
15.  var data = this.data();
16.  console.log(data.length);
17.  console.log(data[0].title);
18.  dataSource.sync();
19.});

Steve
Telerik team
 answered on 27 Aug 2013
2 answers
392 views
Is it possible to add a customer css class to the events? We have a circumstance where we're building out some custom filtering on the scheduler and we need to be able to dynamically it in the colors of the events with a legend for the filters. Also, in the future we may need to dynamically extend those filters; so, being able to apply a custom CSS class to the events based on a type would be extremely helpful.

Is there any way to pull this off currently?
Dominick
Top achievements
Rank 1
 answered on 27 Aug 2013
6 answers
1.3K+ views
Hi,

Is there a way to fresh the calendar? I fill the dates from a datasource and I don't want to get all the events from a whole year.

Thanks,
Martin
John
Top achievements
Rank 1
 answered on 27 Aug 2013
1 answer
180 views
Hello. 
I try to use following code:
<html lang="en" class="no-js k-webkit k-webkit28">
<head>
    <meta charset="utf-8">
    <title>TEST page</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="kendo.common.min.css" media="screen" />
<link rel="stylesheet" type="text/css" href="kendo.metro.min.css" media="screen" />
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/JavaScript" src="kendo.web.js"></script>
<script>
    $( document ).ready(function() {
        var emailBody = new kendo.ui.Editor(
            document.getElementById('emailBodyNew'),
            {
                tools: [
                    "bold",
                    "italic",
                    "underline",
                    "strikethrough",
                    "fontName",
                    "fontSize",
                    "foreColor"],
            }
        );

var fileUpload = new kendo.ui.Upload($("#attachmentUpload"), {
                async: {
                    saveUrl: "Email/UploadAttachment",
                    autoUpload: true
                },
                multiple: true,
                showFileList: false,
                success: function (model)
                {
                    finshAttachmentLoading(model.response);
                },
                error: function (error)
                {
                    console.log(error);
                },
                upload: function(e)
                {
                    console.log(e);
                },
                localization:
                    {
                        dropFilesHere: "Put files here"
                    }
            });

$("#testbutton").on("click", function () { 
$("attachmentUpload").click();});
});
    </script>
</head>
<body>
<div class="email-body">
<textarea id="emailBodyNew"></textarea>
<div class="upload-attachments-wrapper">
<input type="file" id="attachmentUpload" name="fileUpload" />
<button id="testbutton">Click me</button>
</div>
</div>
</body>
</html>

But IE9 showed me always  Access Denied error on line with following code: form[0].submit(); (method performUpload).
What should I need to change to fix this problem?
T. Tsonev
Telerik team
 answered on 27 Aug 2013
2 answers
230 views
Hi,

I am currently trying out some activities using the Kendo Grid and have an issue where the grids change event is being fired every time the a custom command is clicked. This happens in IE 10 and i would greatly appreciate if Kendo UI experts can help me figure out a possible solution. I've gone through quite a number of threads but found no avail.

A sample can be found at this location at http://jsfiddle.net/praneethw/eudVd/4/

The steps are as follows,
Click on the 'Remove' command.
Notice the browser console where the Grid Changed and Removed Item is being printed. This means that the gridChange() function and removeItem() function are both being invoked.

I used the following code block, to prevent the event from bubbling. However in IE 10 this does not seem to work properly. Could anyone help me out on this please.
// Prevent the grid command 'click' event from triggerring the grids 'change' event.
grid.tbody.on('mousedown', 'a', function (evnt) {
    evnt.stopImmediatePropagation();
});
Thanks and Regards,
Praneeth
Praneeth
Top achievements
Rank 1
 answered on 27 Aug 2013
1 answer
825 views

Im using the following code to read from a database, output to json and transfer to my Kendo UI Combobox.
It works great. BUT i can´t figure out how to do add a special item that is first in the list and is selectable.
I would like to add "No Project" and it should be selected as default. It should be on top of the list.

               var project = $("#project").kendoComboBox({
                        filter: "contains",
                        height: 300,
                        //text: "No Project",
                        //value: "",
                        autoBind: false,
                        suggest: true,
                        highLightFirst: false,
                        placeholder: "Select project...",
                        dataTextField: "DBText",
                        dataValueField: "DBValue",
                        template: '<span class=\"comboList\">${ data.DBText }</span>',
                        change: ProjectonChange,
                        dataSource: {
                            type: "json",
                            serverFiltering: false,
                           
                            transport: {
                                read: "ListCustomers.cshtml?list=project&uid=@QueryUserId"
                            }
                        }
                    }).data("kendoComboBox");
Kiril Nikolov
Telerik team
 answered on 27 Aug 2013
1 answer
139 views
Hi,

I am trying to apply a CSS class to some of the input fields inside the list view but noticed that if I specify the input type such as Date the CSS classes don't work inside the ListView. Below is an example. you can try the full example at jsbin.com/aSExaVu/1/edit

<form action="demo_form.asp">
 <ul data-role="listview" id="testListView">
  <li>
    Text: <input class="required">
  </li>
   <li>
    Date (class): <input type="date"  class="required">
  </li>
   <li>
    Date (style): <input type="date"  style="background:yellow">
  </li>
   <li>
    <input type="submit">
  </li>
 </ul>
</form>
</div>
 
<style scoped>
  .required
  {
    background:yellow
  }
</style>
In this example the "required" css class is applied on first 2 input elements. The Text input shows the yellow background but Date input doens't.
If I apply the yellow background style directly to Date input (3rd input) it works but ListView somehow blocks the CSS classes for Date input.
If I move the same Date input outside of the <UL> tag it also works.

Could you please let me know how can I apply CSS classes to input or select elements inside the ListView?

Regards
Ron Farko
Dimo
Telerik team
 answered on 27 Aug 2013
1 answer
339 views
I am using Kendo UI latest version in my application which is built on MVC3 framework , I have a requirement where I need to show a edit pop window which is working fine.But I have  a check box on page where clicking on check box I need to show a  warning message (I need to call a java script method)client side validation. So could you please help me out how to call a java script  function from edit pop up window of Kendo grid.

 

Vladimir Iliev
Telerik team
 answered on 27 Aug 2013
1 answer
90 views
Hi don't know if this is a bug, but it costed my a lot of frustration :D In the end I solved it but I just wanted to share and check.

Anyway I had a timepicker MVVM bound to a value. On a certain JS event i would assign that timpickers value, but not by going through the viewModel object, rather directly using the value method of the picker. That would cause the timepicker to lose sync with the MVVM model and its value would go to a null... I didn't realise what was the bug for a good 5 hours of frustration and trying to get it to work :D.  

I don't know if going like this is something I should do. I guess If I'm using MVVM I should alawys edit values through the model, but the situation was specific and the expected reaction was for it to work the other way around.

Georgi Krustev
Telerik team
 answered on 27 Aug 2013
1 answer
88 views
Hello,

1.
After adding the link in the reply UI is crashed in IE 10. Please check the below link for more info.

http://screencast.com/t/4gTQ77H46XZ


2.
In after adding the link is also not worked in IE 10 and FF latest.  Please check the below link for more info.

http://www.kendoui.com/forums/kendo-ui-web/grid/groupable-uncaught-typeerror-cannot-read-property-%27length%27-of-undefined-kendo-all-js.aspx#boHt9q6aG2OF1P8AAFTdxQ

Thanks,
Jayesh Goyani
Raya
Telerik team
 answered on 27 Aug 2013
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
Application
Map
Drag and Drop
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
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
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
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?