Questions on Kendo UI for jQuery Forum

2 answers

129 views

Hi,

I'm using a customized data source (no transport) with server side paging, and I can't seem to override the total on the datasource. It always seems to be set to the length of the data (the page size). Everything else is working fine but I removed the filtering and sorting to simplify this example.

Here's a js bin that shows my issue: (edit - fixed link)
http://jsbin.com/obuGeHE/2/edit

I expected the total showing on the grid to be twenty and for the grid to show 4 pages (even though in this simplified example I would always return the same 5 rows).

Can someone help me with what I'm missing?

Thanks in advance!

Nathan

Data Source

answered on 22 Jan 2014

2 answers

190 views

[Solved] Distance shown

Is there a way to find out the scale of the map? For instance how many miles across the map as shown.

Thanks.

Map

answered on 22 Jan 2014

1 answer

202 views

How can I share one validation message between two controls?

I'm using MVC.

I have two fields - both IntegerTextBoxes (Html.Kendo().IntegerTextBoxFor....)

These two values are to be validated so that the value in field 1 has to be <= the value in field 2. I've got a custom validator for this.

So supposing I specify 5 in both fields.
I then change field 1 to equal the value 6 and tab off. The error is shown against field 1.
I then enter field 2 and tab off. The error is also shown against field 2 now. So both fields are showing the error.
If I adjust field 1 to equal 5 again and tab off, the error message disappears against field 1 but it remains against field 2 until I tab in and out of that too.

Is there an easy way to link these into one validation with one validation message?

Validation

answered on 22 Jan 2014

3 answers

332 views

How to set type on fields in XML datasource?

I have a grid that is getting its data from XML. I want to define types (numeric, date, etc.) on the fields. How do I do this? I've tried defining my model fields like CARD: { value: 'CARD/text()', type: 'number' } but that doesn't seem to work.

var xml = '<ROWS><ROW id="1"><CARD>1</CARD><LLINE>1</LLINE></ROW><ROW id="2"><CARD>1</CARD><LLINE>2</LLINE></ROW></ROWS>';

$(document).ready(function() {

$('#gridDiv').kendoGrid({

columns: [

{

field: 'CARD',

title: 'Card',

width: 60

},{

field: 'LLINE',

title: 'Line',

width: 60

}

],

dataSource: new kendo.data.DataSource({

type: 'xml',

data: xml,

schema: {

type: 'xml',

data: '/ROWS/ROW',

model: {

id: 'id',

fields: {

id: '@id',

CARD: 'CARD/text()',

LLINE: 'LLINE/text()'

}

})

});

Data Source

answered on 22 Jan 2014

1 answer

81 views

Style issues on a local MVC application

Does anyone have Grid style issues?
I'm running a local MVC application using IIS express (VS 2012)

Once in a while (seems random) when I refresh the page the grid comes up with no styles (see screenshots)
I'm using the inline editing example with minor changes... not loading any other javascripts...

Grid

answered on 22 Jan 2014

1 answer

101 views

Create grid using kendoUI mobile

Hi All,

I wanted to create a grid in my mobile project. Let me know the procedure to create a grid in Kendoui mobile. There is no direct example for this , please guide me on this.

Thanks

Gaja Naik

General Discussions

answered on 22 Jan 2014

4 answers

174 views

[Solved] drag from external panel bar to google maps

I am looking to drag a panelbar item and drop it on a google map. a marker would then be created at that position.

See screenshot

I have the drag working fine but I need the pageX, and pageY coordinates where the item is dropped .

Currently I just create a marker at the center of the page after the drop.

Any info would be appreciated.

thanks
dco

Drag and Drop

answered on 22 Jan 2014

1 answer

144 views

Grouped Column rather than Group Header

The viewmodel my grid is bound to has 3 levels of hierarchy, so I end up with 2 nested grids. In the middle level, I have grouping in place. I need to display 3 different links for the group. Currently, I am taking advantage of the grouping header option. However, I would rather have an additional column in that grid with a rowspan to cover the group rather than the header. Is there any way to accomplish this without overriding multiple aspects of the kendo framework or completely moving away from kendo?
jsfiddle: http://jsfiddle.net/jJRsr/2/

Grid

answered on 22 Jan 2014

2 answers

259 views

Chart not showing data

Hello everyone!

So I have a mysql database. From here I get my json.php file. This will echo this:

{"cols":[{"label":"Weekly Task","type":"string"},{"label":"Percentage","type":"number"}],"rows":[{"c":[{"v":"SLEEP"},{"v":30}]},{"c":[{"v":"Watching Movie"},{"v":10}]},{"c":[{"v":"job"},{"v":40}]},{"c":[{"v":"Exercise"},{"v":20}]}]}

My main php code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.dataviz.min.css">

</head>
<body>
<header>

</header>

<div role="main">

<div id="chart">
</div>
</div>
<footer>

</footer>

<script src="jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.dataviz.min.js"></script>

<script>

jQuery(document).ready(function($) {
$("#chart").kendoChart({
theme: "metro",
dataSource: {
transport: {
read: {
url: 'json.php',
dataType: 'json'
}
}
},
series: [{ name: "Name", type: "Age"}],

categoryAxis: [{ field: "OptionTitles" }],
line: { visible: true }

});
});
</script>

</body>
</html>

But no data is loading on the chart! Any help will be much appreciated!

Thank in advance!

Charts

answered on 22 Jan 2014

2 answers

133 views

data-views prevents drawer from opening

So this code is identical to code I have on my other views. The only thing I can't figure out, is why inlcuding data-views PREVENTS the window from opening up on in this view. The data-views path is correct. I can even copy paste code that works perfects with other views I have that also uses data-views, include the view I want to open on and it still won't work.

Why would data-views prevent the drawer from opening on a page that has been added to data-views? And more so, why does it not work here, but work everywhere else I use it.

<div id="drawerAccounts"
     data-role="drawer"
     data-views='[
    "/View/Account/AccountDefaultView.htm" //This is the correct file path and this is the view where the drawer is located.
    ]'
     data-show="accountListDrawerController.showEvent"
     data-model="accountListDrawerController.dataModel">
    <ul data-role="listview" data-type="group" data-click="clk">
        <li>
            [Person Name]
            <ul>
                <li><a href="#" data-link="/view/editPerson/editPersonDefaultView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Back to Person</a></li>
            </ul>
        </li>
        <li>
            Other
            <ul>
                <li><a onclick="crmMobile.showThemeModal(); HideDrawer('drawerAccounts');">Change UI Theme</a></li>
                <li><a href="#" data-link="/view/Misc/MiscAboutVA.htm" data-transition="none">About Virtual Advisor</a></li>
                <li><a href="/view/Misc/MiscLoggingOut.htm" onclick="logOut();" data-transition="none">Logout</a></li>
            </ul>
        </li>
    </ul>
</div>

Here is a sample of my code from a view that works correctly.
Snippet<div id="drawerEditPerson"
     data-role="drawer"
     data-views='[
    "/view/editPerson/editPersonDefaultView.htm",
    "/view/editPerson/widget/editPersonStatusView.htm",
    "/view/editPerson/widget/editPersonDetailsView.htm",
    "/view/editPerson/widget/editPersonNameView.htm",
    "/view/editPerson/widget/editPersonDisciplinesView.htm",
    "/view/editPerson/widget/viewPersonDisciplinesView.htm",
    "/view/editPerson/widget/viewPersonElectronicContactView.htm",
    "/view/editPerson/widget/viewPersonContactNumbersView.htm",
    "/view/editPerson/widget/viewPersonAddressesView.htm",
    "/view/editPerson/widget/EditPersonRemarksView.htm",
    "/view/editPerson/widget/ViewPersonCompaniesView.htm",
    "/view/editPerson/widget/ViewPersonGroupsView.htm",
    "/view/editPerson/widget/viewPersonNotesView.htm",
    "/view/editPerson/widget/viewPersonRelationshipsView.htm",
    "/view/editPerson/widget/viewPersonCampaignsView.htm",
    "/view/editPerson/widget/viewPersonDocumentsView.htm",
    "/view/editPerson/widget/viewPersonActivitiesView.htm"
    ]'
     data-show="peopleEditDrawerController.showEvent"
     data-model="peopleEditDrawerController.dataModel">
    <ul data-role="listview" data-type="group" data-click="clk">
        <li>
            Contact Info
            <ul>
                <li><a href="#" data-link="/view/editPerson/editPersonDefaultView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Preview</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/editPersonNameView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Name</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/editPersonStatusView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Status</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/editPersonDetailsView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Details</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/editPersonDisciplinesView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Disciplines</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/viewPersonElectronicContactView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Electronic Contact</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/viewPersonContactNumbersView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Contact Numbers</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/viewPersonAddressesView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Address</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/EditPersonRemarksView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Remarks</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/ViewPersonGroupsView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Groups</a></li>
                <li><a href="#" data-link="/view/editPerson/widget/viewPersonNotesView.htm?id=#id#&includeGeneral=true&includeActivity=false&includeDocument=false&includeGroup=false&includeAccount=false" data-bind="idLink: id" data-transition="none">Notes</a></li>
                <li><a href="#" data-link="/view/Account/AccountDefaultView.htm?id=#id#" data-bind="idLink: id" data-transition="none">Accounts</a></li>
            </ul>
        </li>
        <li>
            Other
            <ul>
                <li><a onclick="crmMobile.showThemeModal(); HideDrawer('drawerEditPerson');">Change UI Theme</a></li>
                <li><a href="#" data-link="/view/Misc/MiscAboutVA.htm?id=#id#" data-bind="idLink: id" data-transition="none">About Virtual Advisor</a></li>
                <li><a href="/view/Misc/MiscLoggingOut.htm" onclick="logOut();" data-transition="none">Logout</a></li>
            </ul>
        </li>
    </ul>
</div>

Drawer (Mobile)

answered on 22 Jan 2014