This is a migrated thread and some comments may be shown as answers.

Problem with loading data do grid from remote url

2 Answers 207 Views

Data Source

This is a migrated thread and some comments may be shown as answers.

Arkadiusz asked on 29 Jan 2012, 02:06 PM

Hello everybody,
i have problem with load json data to grid from url.

index.html

<!DOCTYPE html>

<html>

<head>

<title>Test</title>

<script src="source/jquery.min.js"></script>

<script src="source/kendo.all.js"></script>

<script src="scripts.js"></script>

<link href="styles/kendo.common.min.css" rel="stylesheet" />

<link href="styles/kendo.default.min.css" rel="stylesheet" />

</head>

<body>

<div class="main">

<div class="header">

<img src="styles/image/kendo-logo-big.png" class="logo" />

<h1>Kendo UI Grid</h1>

</div>

<div id="grid">

<table id="weapons">

<tr>

<th data-field="name">Name</th>

<th data-field="desc">Description</th>

</tr>

</table>

</div>

</body>

</html>

scripts.js

$(document).ready(function() {

dataSource = new kendo.data.DataSource({

transport: {

read: {

url: "http://dhpl.comuf.com/json.php",

dataType: "json"

}

},

schema: {

data: "results"

}

});

$("#weapons").kendoGrid({

dataSource: dataSource

});

json.php

<?php

header("Content-type: application/json");

print('{ "results" : [{ "name" : "Name1", "desc" : "Desc1" }, { "name" : "Name2", "desc" : "Desc2" }] } ');

?>



Url http://dhpl.comuf.com/json.php it's working if you want to check.

Could anybody help me
Thanks

2 Answers, 1 is accepted

answered on 03 Feb 2012, 06:08 PM

This works just fine for me in my environment:

<!DOCTYPE html>
<html>
<head>
<title>Grid Test</title>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="js/kendo/kendo.all.min.js"></script>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />

<script>
$(document).ready(function() {
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "services/jsontest.php",
dataType: "json"
}
},
schema: {
data: "results"
}
});

$("#weapons").kendoGrid({
dataSource: dataSource
});
});
</script>

</head>
<body>
<div class="main">
<div class="header">
<h1>Kendo UI Grid</h1>
</div>

<div id="grid">
<table id="weapons">
<tr>
<th data-field="name">Name</th>
<th data-field="desc">Description</th>
</tr>
</table>
</div>
</div>
</body>
</html>