Telerik Forums
Kendo UI for jQuery Forum
3 answers
175 views
Hi all,

Hope someone can point me in the right direction because this is driving me crazy...

I'm trying to bind a grid to an asp.net WCF service on another domain using jsonp.

The data returned by the WCF service is like localData in the code below. Databinding succeeds when binding the grid to the localData, but if i change to the raDataSource it gives an error. In firebug it says:  "invalid label {"d":[etc " . 
 
I found a number of posts on the forum saying to add schema { data: "d" } to the datasource but i keep getting the same error.
var localData = {"d":[{"__type":"type1","ClassNbr":"5","SiteName":"Name1","Train":"Train1"},{"__type":"type1","ClassNbr":"4","SiteName":"Name2","Train":"Train2"}]};
 
var raDataSource = new kendo.data.DataSource({
            type: "odata",
            transport: {
                read: {
                    type: "GET",
                    contentType: "application/json; chartset=utf-8",
                    url: dataUrl,
                    dataType: "jsonp",
                    jsonp: true,
                    jsonpCallback: 'callback'
                }
            },
            data: {
              siteID: si,
              cceMode: mode,
              endDate: encodeURIComponent(endDate),
              Accept: "application/json"
            },
            error: function (e) {
                alert("Error: " + e);
            },
            schema: {
                data: "d"
            },
            model: {
                    fields: {
                        SiteName: { type: "string" },
                        Train: { type: "string" }
                    }
            }
    });
 
     $("#grid").kendoGrid({
        dataSource: raDataSource  ,
        height: 360,
        columns: [
            {   field:"SiteName"    },
            {   field:"Train"   },
        ],
        dataBound: function() { alert('bound');},
    });

Any idea's?

Kind regards,
Tycho
Tycho
Top achievements
Rank 1
 answered on 27 Jun 2012
0 answers
205 views
Hi,

I have a prolem while assigning data to control which is generated from another page. While routing to another page, I am not able to assign the selcted value to a text box.

Please help me in this regard. Code is below here:

@{ 
    ViewBag.Title = "TaskDetailListView";
    Layout = "~/Views/Shared/_Layout.cshtml";
} 
    <div id="formcontainer">
        <div id="demo">
     Order ID: <input data-bind="value: OrderID" /><br />
     Shipment Name: <label data-bind="text: ShipName" ></label>  
 </div>

   </div>

    <script type="text/javascript">

        $(document).ready(function () {

 

            var productsSource = new kendo.data.DataSource({

                transport: {

                    read: {

                        contentType: "application/json; charset=utf-8",

                        type: "GET",

                        dataType: "json",

                        url: "http://localhost:23794/api/Task/TaskItem"

                    }

                },

                schema: {

                    total: function (result) {

                        alert(JSON.stringify(result));

                    },

                    model: {

                        id: "OrderID",

                        fields: {

                            OrderID: { type: "number" },

                            ShipName: { type: "string" }

                        }

                    }

                }

            });

 

            var viewModel = kendo.observable({

                dataSource: productsSource

 

            });

             productsSource.fetch();

 

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

          

        });                  

    </script>

 

Govindu
Top achievements
Rank 1
 asked on 27 Jun 2012
2 answers
189 views
Hi there,

Can i know, how to customize Radial Gauge Niddle color?

Thanks,
Rajesh.C
Iliana Dyankova
Telerik team
 answered on 27 Jun 2012
3 answers
127 views
Hello

i have an issue with the grid and the editable options.

this fiddle works fine http://jsfiddle.net/hansdampf10/nPXey/1/

In the config editable: true works fine.

I want to change the confirmation message on deletion so i changed config to this

editable: {
update: true, // puts the row in edit mode when it is clicked
destroy: true, 
        confirmation: "Custom message"
}

when i do this, the grid is not editable anymore and i can't add new entries. You can see the problem in this fiddle
http://jsfiddle.net/hansdampf10/JFnj6/1/

Timur
Top achievements
Rank 1
 answered on 27 Jun 2012
1 answer
252 views
Hello,

I try to use the ListView widget according to the documentation.
I created a list in my HTML as following:
<ul id="listView"></ul>

Then, I copy-pasted the example in the demo:

$("#listView").kendoListView({ 
         dataSource: {
          data: [{title: "Star Wars: A New Hope", year: "1977"}, {title: "Star Wars: The Empire Strikes Back", year: "1980"}]
 },
 template: "<li>${title} ${year}</li>"
});

But when I run it, the code in the browser looks like this: 
$("#listView").kendoListView({
dataSource: {
data: [{title: "Star Wars: A New Hope", year: "1977"}, {title: "Star Wars: The Empire Strikes Back", year: "1980"}]
},
template: "<li> </li>"
});

as You can see, the template is empty for some reason...

I also noticed that in the examples the template is sometimes inside the dataSource property, like this:
dataSource: {
         data: [{title: "Star Wars: A New Hope", year: "1977"}, {title: "Star Wars: The Empire Strikes Back", yearI : "1980"}],
template: "<li>${title} ${year}</li>"
}

And sometimes like in my first code example, I wonder what is the correct syntax?.. (I tried both.. Same result with the template)

I wonder what am I doing wrong?

Any help would be appreciated.
Thanks,
Irit.
Iliana Dyankova
Telerik team
 answered on 27 Jun 2012
5 answers
2.0K+ views
there is a number field name "SiteHits". For this field ,I define validation as below:
validation:{
required:true,
min:1,
digits:true
}

I also include jquery(version 1.7.1) and jquery-validate(version 1.9.0).
it seems "digits" is not useful.

Does the problem cause by jquery ?
OR
Does KendoUI not support "digits" validation?

Hope the solution for it, thanks!
Nick Wu
Top achievements
Rank 1
 answered on 27 Jun 2012
1 answer
228 views
I'm evaluating the use of kendoUI for a new project. i've placed an asp.net dropdownlist on a blank page and wired up the databind and postback event on the aspx.cs code behind. 

    <asp:DropDownList ID="comboBox" runat="server" 
    DataTextField="monthfullname" DataValueField="mthid" CssClass="k-combobox" 
    AutoPostBack="true" onselectedindexchanged="comboBox_SelectedIndexChanged">
    </asp:DropDownList>

and the js on document ready

    <script type="text/javascript">
        $(document).ready(function () {
            $(".k-combobox").kendoComboBox();
        });
    </script>

i've tried it on IE8 and it works fine, but on chrome the postback is giving me the "Aw, Snap!" page. what could be the issue?

i've disabled all extensions on chrome already but to no effect.

PS: i'm developing on localhost
Justin
Top achievements
Rank 1
 answered on 27 Jun 2012
2 answers
233 views
Hi,

WCF Service returning JSON string for hierarchical grid. While binding to grid, I am getting following error. In examples I found two different services calling for Parent and Child. My requirement is one JSON string with hierarchical gird.

Invalid template:'<tr data-uid="#=uid#"><td>${All}</td><td>${sample name}</td></tr>' Generated code:'var o,e=kendo.htmlEncode;with(data){o='<tr data-uid="'+(uid)+'"><td>'+(e(All))+'</td><td>'+(e(sample name))+'</td></tr>';}return o;'


  <div id="example" class="k-content">
        <div id="grid">
        </div>
        <script type="text/javascript">
            $(function () {
                dataSource = new kendo.data.DataSource({
                    schema: {
                        model: {
                            id: "_grdData"
                        }
                    },
                    pageSize: 10,
                    transport: {
                        read: { url: "/Service.svc/GetData", datatype: "json", type: "GET" },
                        parameterMap: function (data, operation) {
                            if (operation != "read") {
                                return JSON.stringify({ Service : data })
                            }
                        }
                    }
                }),


                $("#grid").kendoGrid({
                    dataSource: dataSource,
                    pageable: true,
                    scrollable: {
                        virtual: false //false
                    },
                    detailInit: detailInit,
                    dataBound: function () {
                        this.expandRow(this.tbody.find("tr.k-master-row").first());
                    },
                    toolbar: ["create"],
                    editable: "popup",
                    columns: [
                            { field: "name", title: "Name", width: "150px" }


                     ]


                });
            });

            function detailInit(e) {
console.log("Name: " + e.data.child[0].name );
                console.log("Name1:" + e.data.child[0].name1 );
                $("<div/>").appendTo(e.detailCell).kendoGrid({
                    dataSource: dataSource,
                    filter: { field: "id", operator: "eq", value: e.data.id},
                    columns: [
                        { field: e.data.child[0].name, title: "Name", width: "150px" },
{ field: e.data.child[0].name1, title: "Name 1", width: "150px" } 
              ]
                });
            }
        </script>
    </div>

JSon Data from service :
[{"name":"All","id":5369,"child":[{"name":"All","id":5369,"child":null,"name1":"sample name"}],"name1":null}]
Krish
Top achievements
Rank 1
 answered on 26 Jun 2012
1 answer
2.5K+ views
Sorry, new in the KendoUI..
How do I add tooltip to the button?
this does not work

 

<span id="search" data-tooltip="Hello World" class="k-button">Search</span>

 

 

 

Iliana Dyankova
Telerik team
 answered on 26 Jun 2012
0 answers
145 views
Any plans to support this?
http://demos.telerik.com/aspnet-ajax/treeview/examples/functionality/checkboxes/defaultcs.aspx

(Select a parent and the children inherit)
sitefinitysteve
Top achievements
Rank 2
Iron
Iron
Veteran
 asked on 26 Jun 2012
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
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
ScrollView
Switch
TextArea
BulletChart
Licensing
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
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
ContextMenu
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
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?