Questions on Kendo UI for jQuery Forum

3 answers

226 views

Dear all,

I have been trying for a cuple of days to get data from the database into the KendoUI GRID. For some reason the data doesn't show, so I ran a test and as far as I can see it is working as it is supposed to.

My test.php file looks like this:

<?php

$sRootDir = "../..";

require_once ($sRootDir.'/lib/Kendo/DataSourceResult.php');

require_once ($sRootDir.'/lib/Kendo/Autoload.php');

require_once ($sRootDir."/include/includeDomain.php");

require_once ($sRootDir."/include/includeLib.php");

if ($_SERVER['REQUEST_METHOD'] == 'POST') {

header('Content-Type: application/json');

$sType = $_GET["type"];

$sRequest = json_decode(file_get_contents('php://input'));

//Password data removed

$pResult = new DataSourceResult(**dns**, **user**, **password**);

$aColumns = array('CLIENTEMEA', 'CLIENTNAME', 'CLIENTKVK');

switch($sType) {

case 'create':

$sResult = $pResult->create('RULES_CLIENTS', $aColumns, $sRequest->models, 'CLIENTEMEA');

break;

case 'read':

$sResult = $pResult->read('RULES_CLIENTS', $aColumns, $sRequest);

break;

case 'update':

$sResult = $pResult->update('RULES_CLIENTS', $aColumns, $sRequest->models, 'CLIENTEMEA');

break;

case 'destroy':

$sResult = $pResult->destroy('RULES_CLIENTS', $sRequest->models, 'CLIENTEMEA');

break;

}

echo json_encode($sResult, JSON_NUMERIC_CHECK);

$FileName = "testFile.txt";

$FileHandle = fopen($FileName, 'w') or die("can't open file");

fwrite($FileHandle, json_encode($sResult, JSON_NUMERIC_CHECK));

fclose($FileHandle);

exit;

}

require_once($sRootDir."/html/tpbilling/client/index2.html");

?>

And my index2 file looks like this:

<div id="grid"></div>

<script>jQuery(function(){

jQuery("#grid").kendoGrid(

{"columns":[

{"field":"CLIENTEMEA","width":100,"title":"Client EMEA"},

{"field":"CLIENTNAME","width":400,"title":"Client Name"},

{"field":"CLIENTKVK","width":100,"title":"KVK Number"}],

"dataSource":

{"transport":{

"create":{"url":"../../tpbilling/client/test.php?type=create","contentType":"application\/json","type":"POST"},

"read":{"url":"../../tpbilling/client/test.php?type=read","contentType":"application\/json","type":"POST"},

"update":{"url":"../../tpbilling/client/test.php?type=update","contentType":"application\/json","type":"POST"},

"destroy":{"url":"../../tpbilling/client/test.php?type=destroy","contentType":"application\/json","type":"POST"},

"parameterMap":function(data) {

return kendo.stringify(data);

}},"batch":true,"pageSize":20,

"schema":{

"data":"data","errors":"errors","model":{

"id":"CLIENTEMEA","fields":[

{"field":"CLIENTEMEA","type":"number","validation":{"required":true}},

{"field":"CLIENTNAME","type":"string","validation":{"required":true}},

{"field":"CLIENTKVK","type":"number","validation":{"required":true}}

]},

"total":"total"}},

"toolbar":[{"name":"create"}],"height":430,"editable":"popup","pageable":true});});

</script>

Now you can see in the php-file I created a text file to check which data is echo-ed. That data looks like this:

{"total":2,"data":[{"CLIENTEMEA":127,"CLIENTNAME":"Telenet","CLIENTKVK":123456789},{"CLIENTEMEA":129,"CLIENTNAME":"Tele2","CLIENTKVK":987654321}]}

Which is correct. I made 2 test entries to see what's what.

Now when I start the page, the GRID always shows up empty. It's also not possible to add new records. When I do the submit button doesn't submit the data, so all I can do is cancel.

Can anyone see anything wrong with the code? Are there other tests I could do to find out the problem?

Any help would be appreciated.

Thanks in advance,

Dennis Biemans.

Grid

answered on 03 Sep 2013

1 answer

115 views

Kendo UI Mobile search box formatted like default?

I have a Kendo UI app with a search box. My problem is, it's formatted just like the browser would normally format it, which I do NOT want. I would expect Kendo UI to do this for me. Here is my HTML:<div data-role="view" data-layout="app" data-title="Search" id="index">

<header data-role="header">

<div data-role="navbar">Search</div>

<form id="searchForm">
<input type="search" id="search" />
</form>

</header>
</div>
..........
Am I going to have to style this myself?

General Discussions

answered on 03 Sep 2013

1 answer

634 views

Grouped column initially sorted descending

Hi.

Is there a way to force descending order on a grouped column in Kendo Grid?

When I open the grid, I've got a list of operations grouped by operation data, but I want group ordered from most recent date.

I read that if I want to group and sort for the same field, the instruction is

group: [{ field: "OperationDate", dir: "desc" }]

Right?

What's the instruction for Razor Engine? Something like:

.Group(groups => groups.Add(p => p.OperationDate, ListSortDirection.Descending ) ?

Thanks.

Grid

answered on 03 Sep 2013

1 answer

244 views

Problems with inline editing

I've been struggling to get inline grid editing to work.

My first attempt was to take the MVVM demo (modified a little), and changing data-editable='true' to data-editable='inline'. When I did that, it behaves erratically: it updates the underlying data immediately (before saving or cancelling), the "update" button does nothing, and the "cancel" button clears the entire grid. Here's a demo: http://jsbin.com/EHIYuDE/3/edit?html,output. What's going wrong here?

Next I tried doing it in a non-MVVM way, which I also could not get to work: http://jsbin.com/EHIYuDE/6/edit?html,output. What am I doing wrong here?

Any example of how to get inline editing to work with local data, preferably in an MVVM style, would be much appreciated.

Grid

answered on 02 Sep 2013

1 answer

130 views

Keyboard navigation in IE does not work when tabs created after init

Keyboard shortcuts aren't working in IE if you create new tabs via tabstrip.append(). I've created an example to demonstrate. http://jsfiddle.net/jABKT/

TabStrip

answered on 02 Sep 2013

1 answer

285 views

Setting height of schedular?

I know there is a height variable with the scheduler control? I want to find out if there is a way to auto-set to the height of the browser? Mind you, I do have it loaded up within a tabstrip, so anyway to make the tabstrip adjust to the browser height and the schedule control auto-adjust to the content height?

Paul

Scheduler

answered on 02 Sep 2013

0 answers

148 views

IndexedDB OR WebSQL

Here is my requirement,
1. I need unlimited local storage, because my application should work offline for different valid reasons. I deal with complex grids (I am using Kendo UI here) having data returned from multiple DB tables, so in order to work my app offline I need to have a mechanism to maintain the similar relation between the DB objects or at least some work around to deal with it.
2. My users will use Desk top , IOS devices like Ipad, Iphone , and Androd devices.so I need all latest browsers support.

so, Please suggest me an option to choose from the technologies around HTML5.

General Discussions

asked on 02 Sep 2013

3 answers

86 views

[Solved] Categories in empty column chart

Hello,

I've got a question about the categories in an empty column chart.
They show up as if it was a linechart when the chart is empty.

Is their a way to show the categories in the correct way, even if the chart is empty?
For an example please see the attached image.

Charts

answered on 02 Sep 2013

1 answer

890 views

Window Border CSS Setting

I have a KendoUI Window which is not behaving itself when I am using it inside another JQuery framework.
I am trying to set the window title colour and the maximise and close icons to the top right, but I cannot figure out the CSS settings to do this.
I attach an image showing what I have now and what I am trying to achieve.
I was given these settings a few months ago but they appear to be having little effect:
/* Override our KendoUI popup window */
/*
.k-window-titlebar
{
    background-color: pink;
    color: red;
    font-weight: bold;
    padding: 0px;
}
*/

.k-header {
    margin-top: 0px;
    padding: 0px;
}

.k-window-title {
    background-color: #275CAB;
    color: white;
    font-weight: bold;
    padding: 3px;
}

/* Allow centering of the table content in the popup window */
.k-window-content > .km-scroll-container
{
   height:100%;
    padding: 30px;
}

.k-window-titlebar .k-window-action
{
    background: none;
    border-width: 200px;
    background-color: #275CAB;
}
Your help is most appreciated?

Kind Regards, Garry.

Window

answered on 02 Sep 2013

3 answers

136 views

Style for the .Formatting() option not applied when opened in window control

When an editor control is loaded in a window control, the .Formatting() component on the editor does not render the expected styles for each of the options in the drop down list.

This is occurring with the latest build 2013.2.823.

It seems to be adding the below inline style to each of the list items in the dropdown. This has been happening for the last few builds but i got around it by having a mismatch of different version JS files which was less than ideal as it breaks other things.

color: rgb(51,51,51); padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-color: rgb(51,51,51); border-right-color: rgb(51,51,51); border-bottom-color: rgb(51,51,51); border-left-color: rgb(51,51,51); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; display: block; background-image: none; background-attachment: scroll; background-repeat: repeat; background-position-x: 0%; background-position-y: 0%; background-color: transparent;

I have attached a screenshot to show this.

Editor

answered on 02 Sep 2013