Telerik Forums
Kendo UI for jQuery Forum
1 answer
89 views
I have a chart that has a datasource bound to remote data. I allow users to filter the data on the client side by selecting a date range using dropdownlists.

I understand that the chart rolls up based on the values specified in baseUnit, baseUnitStep and maxDateGroups. I would like to know if there is a way to always display the first and last datapoint and have all the values in between be rolled up. It can skew the visualization of the data if the very last datapoint is not included.
Alexander Popov
Telerik team
 answered on 23 Jan 2014
2 answers
590 views
I am using the cursoroffset to position the pointer below and to the left of what is being dragged.

While this works great the cursor changes to a standard pointer is there anyway to have it change to something else(preferably cross hair) while dragging and then revert to default after drop.

thanks
dco
David Ocasio
Top achievements
Rank 2
Iron
Veteran
Iron
 answered on 23 Jan 2014
1 answer
246 views
We are a company there have a huge web application running. The system is coded in Oracle, JSP, Java, JavaScript using Backbase, where the transport for data and function calls to Oracle is done using xml.
 
We are thinking about changing the interface framework and that's why I'm looking at Kendo UI.
 
I'm managed to make extended dataSources (connected to Oracle by using the existing xml interface) in JavaScript executed from JSP (Not using libtagging) by using "new kendo.data.DataSource". I have build custom observes, grids, forms and other controls with data binding in a MVVM environment.
That all works very well. Have made all the code in js files and is using jQuery Ajax to loads interface parts.
 
Now to my question.
 
I can see in examples when running JSP in a MVVM environment, kendo UI are talking about doing the widget extension in java, making a bean and libtag it in jsp.
 
What benefits do I get by coding the widgets in java instead simply directly in JavaScript?
 
Please advice :-)
Sebastian
Telerik team
 answered on 23 Jan 2014
1 answer
54 views
When I click the navigation button on a drawer, I get the drawer to the left as intended.

However, the header (which also includes the button) slides to the right as well.
How can I have only the contents below the header slided.

There is no way to insert pictures in this forum so the screenshots are here:

http://dl.dropboxusercontent.com/u/23963309/unslided.png
http://dl.dropboxusercontent.com/u/23963309/actual.png
http://dl.dropboxusercontent.com/u/23963309/desired.png
Kiril Nikolov
Telerik team
 answered on 23 Jan 2014
3 answers
1.4K+ views
Hi,

I am new to Kendo, I am facing few issues in fulfilling requirement w.r.t to Kendo UI multiselect.

1.       I am using Kendo UI Multiselect. I want the multiselect widget to act only as a drop down i.e., on click on the widget, it has to show the list of options in the dropdown and the user should not be able to enter text in the multiselect text field. User can only select the option from the dropdown.
Is this possible?

2.       Should the dataValueField be unique?
- If I have dataTextField as {'test1','test2'} and dataValueField as {'test','test'}
- The multiselect gets populated with test1 twice.

Thanks,
Bharath
Kiril Nikolov
Telerik team
 answered on 23 Jan 2014
1 answer
108 views
Hi,
i have try to use kendo ui mobile listview with jquery plugin (rateit - it is a star rating). when i data-init my view it will show. but when i manually insert data into listview it disappear.  below is my code.

template
<script id="tmp" type="text/x-kendo-template">
        
            
            <img  src="#:banner#" class="Banner" />
            <div class="listitem-tab km-listview-link" data-role="content">
                <a data-role="listview-link" href="#:link#" style="text-decoration:none;" class="GoToNearBySub1" >
                    <div>
                        <img class="pullImage" src="#:url#" />
                        <h3 class="MerchantName">#:title#</h3>
                        <p class="MerchantDetail">#:description#</p>
                        <span class="MerchantDetail2">Rate:</span><div class="rateit" data-rateit-value="2.5" styles="margin:0;"></div><span class="MerchantDetail2">#:rate#</span>
                        
                    </div>
                </a>
                <a  data-role="detailbutton"  data-rel="popover" href="#:popup#" class="GetGPSDetail" id="#:gpslatlng#" >...</a>
                
            </div>

    </script>

my view

<div  data-role="view" data-title="Near By" id="listview_home" data-layout="mobile-tabstrip" data-init="CallJs" data-after-show="showstar" data-transition="slide">
    <header data-role="header">
    <link href='myStyles/rateit.css' type="text/css" rel="stylesheet"/>
        <div data-role="navbar">
            <span data-role="view-title"></span>
            <a href="#SearchList" data-align="right" data-icon="search" data-role="button" data-click="ResetScrollBar"></a>
           
        </div>
    </header>
    <!--
    <ul id="NearbyList" data-role="listview" data-source="dataSource" data-template="tmp"></ul>
    -->
    <ul id="NearbyList"  data-role="listview"></ul>
    <ul id="AddBtnDiv" data-role="listview"><a data-role="button" id="PressLoad" class="btn">Load More</a></ul> (press thius button to load data from listlist function)
    

    <div id="GetDirection" data-role="popover">
                <div data-role="view" data-title="Direction">
                    <div data-role="header">
                        <div data-role="navbar">
                            <span data-role="view-title"></span>
                        </div>
                    </div>
                    <span data-role="view-title"></span>
                    <ul data-role="listview" data-style="inset" >
                        <li>
                                <i></i><a data-role="button"  class="btn" id="DetailBtn" data-bind="value: title">Get Direction</a>
                        </li>
                    </ul>
                </div>
            </div>

</div>


function listlist(LoadStartNo,LoadEndNo) {

    
   
    var Cat3 = {};
    NextStartNo = LoadStartNo;
    NextEndNo = LoadEndNo;

    if (NextEndNo == 0)
    {
        return;
    }

    var dataSource3 = new kendo.data.DataSource({

        transport: {
            read: {
                type: "Post",
                url: "http://localhost:57613/api/merchant/PostPagingMerchant",
                data: { "StartPoint": NextStartNo, "EndPoint": NextEndNo },
            }
        },
        schema: {

            parse: function (response) {
                Cat3 = JSON.stringify(response);
                var obj = eval("(" + Cat3 + ")");
                //alert(obj.Table.length);
                for (var i = 0; i < obj.Table.length; i++) {
                    var product = {
                        title: obj.Table[i].title,
                        url: obj.Table[i].url,
                        description: obj.Table[i].description,
                        rate: obj.Table[i].rate,
                        popup: obj.Table[i].popup,
                        banner: obj.Table[i].banner,
                        gpslatlng: "3.01181,101.63124",
                        link: obj.Table[i].link
                    };
                    PressLoadProduct.push(product);
                }
                return PressLoadProduct;
            },
            total: function () { return PressLoadProduct.length; }
        },
        serverPaging: true,
        pageSize: 18,
        serverSorting: true
    });

    var listview2 = $("#NearbyList").kendoMobileListView({
        dataSource: dataSource3,
        template: $("#tmp").html()
        //endlessScroll: true
    });

    NextStartNo = NextEndNo + 1;
    NextEndNo = NextEndNo + 5;
    
}
Kiril Nikolov
Telerik team
 answered on 23 Jan 2014
1 answer
453 views
I have been developing traditional aspx pages without the aid of MVC. (I just never drank the MVC cool-aid). I would like to find an example of using Kendo UI within an aspx page including a form running at the server with traditional aspx controls.

I guess the best way of asking for what I am looking for is; how to replace a Telerik data grid or htmlchart with the kendo equivalent.

I find myself in the spot because the Telerik HTML Chart does not support stackable area or stackable lines.  It seems that the Kendo.Dataviz does.

Any non MVC examples with aspx forms would be helpful.

Sebastian
Telerik team
 answered on 23 Jan 2014
1 answer
127 views
We have a requirement in which we need to automate the URL using Coded UI having Kendo controls. This URL is only accessible in Chrome browser and not in IE. Currently Coded UI is supporting Chrome and other URL having only Html controls. Coded UI is not recognizing the Kendo controls present in Chrome browser.
We had tried recording the controls from IE and playing on chrome, but this is also not working  I wanted to know, whether Chrome browser + coded UI + kendo control combination is possible.
Atanas Georgiev
Telerik team
 answered on 23 Jan 2014
5 answers
226 views
I believe there is a bug in remote filtering dates.  The value doesn't appear to show up anywhere in the querystring.  Here is my grid:

<div id="grid"></div>
 
<script type="text/javascript">
 
    var dateRegExp = /^\/Date\((.*?)\)\/$/;
 
    function toDate(value) {
        var date = dateRegExp.exec(value);
        return new Date(parseInt(date[1]));
    }
 
    $(document).ready(function() {
        var url = '@Url.Action("Grid")';
 
        var dataSource = new kendo.data.DataSource({
            serverPaging: true,
            serverSorting: true,
            serverFiltering: true,
            pageSize: 200,
            transport: {
                read: {
                    type: 'post',
                    dataType: 'json',
                    url: url
                }
            },
            schema: {
                data: 'data',
                total: 'total',
                model: {
                    id: 'EmployeeId',
                    fields: {
                        Name: { type: 'string' },
                        Email: { type: 'string' },
                        EmployeeNumber: { type: 'number' },
                        HireDate: { type: 'date' },
                        Active: { type: 'boolean' }
                    }
                }
            }
        });
 
        $('#grid').kendoGrid({
            dataSource: dataSource,
            height: 400,
            columns: [
            { field: 'Name', title: 'Name' },
            { field: 'Email' },
            { field: 'EmployeeNumber', title: 'Emplyee #' },
            { field: 'HireDate', title: 'Hire Date', template: '#= kendo.toString(toDate(HireDate), "MM/dd/yyyy")#' },
            { field: 'Active' }
        ],
            filterable: true,
            sortable: {
                mode: 'multiple'
            },
            scrollable: {
                virtual: true
            }
        });
    });
     
 
</script>

and attached is a picture of the request in fiddler.  The operator, field, and logic show up.  Where is the value at?
Atanas Korchev
Telerik team
 answered on 23 Jan 2014
1 answer
52 views

I want to draw a chart has one scatter series and one scatter line
series from remote json data,For example,I define the model like this:

public class Point{
public double XPoint{get;set;}
public double YPoint{get;set;}
}
public class ChartDataSource{
//the datasource to draw a line
public List<Point> LineSeriesDataSource{get;set;}
//the datasource to draw some points
public List<Point> PointSeriesDataSource{get;set;}
//the chart title
public string ChartTitle{get;set;}
}


In the view,How to show the chart?I write like this,but it do not work.
//use ajax to get datasource
var datasource=GetDataSource();
$("#samplechart").kendoChart({
title: { text: dataSource.ChartTitle},
dataSource:dataSource,
series: [{
type: "ScatterLine",
field: "LineSeriesDataSource.YPoint"
//groupNameTemplate: "Line Temple "
},
{
type: "Scatter",
field: "PointSeriesDataSource.YPoint"
//groupNameTemplate: "Scatter Temple"
}],
legend: {
position: "bottom"
},

categoryAxis: {
field: "XPoint",
majorGridLines: {
visible: false
}},
tooltip: {
visible: true,
template: "#= series.name # : #= value #"
},
autoBind: true
});
Iliana Dyankova
Telerik team
 answered on 23 Jan 2014
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?