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

connecting grid to mysql database

3 Answers 1242 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Benjamin
Top achievements
Rank 1
Benjamin asked on 14 Jan 2014, 04:45 PM
Hi all.
My name is Benjamin and I am very new to Kendo UI. 
I am creating an editable grid like the one on this page http://demos.kendoui.com/web/grid/editing-popup.html to a localhost mysql database.
Please can someone show me the steps, 

I was trying to follow the php code on the page but I can't see the lib folder in my download version and i can't see the following files too.
require_once '../../lib/DataSourceResult.php';
require_once '../../lib/Kendo/Autoload.php';

then I don't know how to connect the datasource to my mysql database too. There is no documentation in there.
thank you in advance.



3 Answers, 1 is accepted

Sort by
0
Petur Subev
Telerik team
answered on 16 Jan 2014, 10:40 AM
Hello Benjamin,

The documentation to get started with editing with the PHP wrappers is available here:

http://docs.kendoui.com/getting-started/using-kendo-with/php/widgets/grid/editing

Previously you should have covered the introduction topic and see where the lib folder is actually contained.

http://docs.kendoui.com/getting-started/using-kendo-with/php/introduction

If you have followed the instructions there then you should have faced no problems.

I hope this helps.

Kind Regards,
Petur Subev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Benjamin
Top achievements
Rank 1
answered on 17 Jan 2014, 01:03 AM
Thank you Petur Subev

Your information was very helpful.
I have been able to populate the grid with the data from the mysql database. but I can not edit the record. It only happens in the grid and the dialogue does not close after you click the edit button. When you click cancel, it then reverses to the original information. My code is as follows

<?php
require_once 'assets/lib/DataSourceResult.php';
require_once 'assets/lib/Kendo/Autoload.php';


$transport = new \Kendo\Data\DataSourceTransport();


$read = new \Kendo\Data\DataSourceTransportRead();

// Specify the url of the PHP page which will act as the remote service
$read->url('data/bankconnection.php')
->contentType('application/json')
->type('GET');
 
$update = new \Kendo\Data\DataSourceTransportUpdate();

// Specify the url of the PHP page which will update the bank table
$update->url('data/bankconnection.php')
  ->contentType('application/json')
  ->type('POST');


// Configure the transport to send the data source parameters as JSON.
// This is required by the DataSourceResult helper.
$transport->read($read)
 ->update($update)
 ->parameterMap('function(data) {
 return kendo.stringify(data);
 }');


// Configure the model
$model = new \Kendo\Data\DataSourceSchemaModel();

$bankIDField = new \Kendo\Data\DataSourceSchemaModelField('BankID');
$bankIDField->type('string');


$bankNameField = new \Kendo\Data\DataSourceSchemaModelField('BankName');
$bankNameField->type('string');


$model->id('BankID')
 ->addField($bankIDField)
 ->addField($bankNameField);


$schema = new \Kendo\Data\DataSourceSchema();
// Configure the schema to accept the format returned by DataSourceResult
$schema->model($model)
  ->data('data')
  ->errors('errors')
  ->aggregates('aggregates')
  ->total('total');


$dataSource = new \Kendo\Data\DataSource();


// Configure data source and enable server operations - paging, sorting etc.
$dataSource->transport($transport)
  ->pageSize(10)
  ->schema($schema)
  ->serverFiltering(true)
  ->serverSorting(true)
  ->serverGrouping(true)
  ->serverPaging(true);

  
// =========== code for the grid starts here.

$grid = new \Kendo\UI\Grid('grid');


$bankIDColumn = new \Kendo\UI\GridColumn();
$bankIDColumn->field('BankID')
->title('BANK ID');


$bankNameColumn = new \Kendo\UI\GridColumn();
$bankNameColumn->field('BankName')
  ->title('BANK NAME');
  
$command = new \Kendo\UI\GridColumn();
$command->addCommandItem('edit')
->title('&nbsp;')
->width(80);


// Configure columns, enable paging, filtering, sorting and grouping
$grid->addColumn($bankIDColumn, $bankNameColumn, $command)
->dataSource($dataSource)
->addToolbarItem(new \Kendo\UI\GridToolbarItem('create'))
->height(430)
->editable('popup')
->pageable(true);

echo $grid->render();
?> 

then this is the code for the connection file

<?php
$link = mysql_pconnect("localhost", "root", "xxdntcpy55") or die("Unable To Connect To Database Server");

mysql_select_db("bbsalesdat") or die("Unable To Connect To Northwind");

// add the header line to specify that the content type is JSON
header("Content-type: application/json");

// determine the request type
$verb = $_SERVER["REQUEST_METHOD"];

// handle a GET
if ($verb == "GET") {
$arr = array();
$rs = mysql_query("SELECT BankID, BankName, Branch, TownCity, PhoneNumber, AccName, AccNumber, AccBalance FROM banks");
while($obj = mysql_fetch_object($rs)) {
$arr[] = $obj;
}

echo "{\"data\":" .json_encode($arr). "}";
}

// handle a POST
if ($verb == "POST") {

$myBankID = mysql_real_escape_string($_POST["BankID"]);
$myBankName = mysql_real_escape_string($_POST["BankName"]);

$rs = mysql_query($link,"UPDATE banks SET BankName = '" .$myBankName ."' WHERE BankID = " .$myBankID);

if ($rs) {
echo json_encode($rs);
}
else {
header("HTTP/1.1 500 Internal Server Error");
echo "Update failed for Bank ID: " .$myBankID;
}
}
?>

Please I hope you can help me with the code for the add and the delete commands too.
I am counting on your usual cooperation. 
Thank you

0
Petur Subev
Telerik team
answered on 20 Jan 2014, 03:40 PM
Hello Benjamin,

Are you sure that what you return from the Update method is the the same structure as for the Read operation, with the difference that the collection inside is just a single record (the one that you just updated)?

Here is how you can achieve this through the DataSourceResult helper.

$data = $result->update('Products', array('ProductID', 'ProductName', 'UnitPrice', 'UnitsInStock', 'Discontinued'), $request->models, 'ProductID');
header('Content-Type: application/json'); echo json_encode($data);
echo json_encode($data);


Kind Regards,
Petur Subev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Benjamin
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Benjamin
Top achievements
Rank 1
Share this question
or