Dear, I can not correctly develop a treeview with Kendo UI and Vuejs in laravel. To unravel the problem, I will describe what I am using.
This is what the url of the laravel driver (index) returns, which I will then use with kendoUi to create the TreeView based on json data (it returns this data from Mysql):
The problem is that all the data is repeated in the TreeView.
But if I use the URL that KendoUI brings me, it works correctly:
callback([{"EmployeeId":2,"FullName":"Andrew Fuller","HasEmployees":true,"ReportsTo":null}])
Step to describe the code of:
KendoUI in Vuejs:
<kendo-hierarchicaldatasource ref="remoteDataSourceComponent"
:transport-read-url="'http://software.local/rubrosjson'"
:transport-read-data-type="'json'"
:schema-model-id="'EmployeeId'"
:schema-model-has-children="'HasEmployees'">
</kendo-hierarchicaldatasource>
<kendo-treeview data-source-ref="remoteDataSourceComponent"
:data-text-field="'FullName'"
:checkboxes="true"
:drag-and-drop="true"
@change="onChange"
@check="onCheck"
@collapse="onCollapse"
@dataBound="onDataBound"
@drag="onDrag"
@dragStart="onDragStart"
@dragEnd="onDragEnd"
@drop="onDrop"
@expand="onExpand"
@navigate="onNavigate"
@select="onSelect">
</kendo-treeview>
Laravel driver:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Rubros;
use Response;
use Illuminate\Support\Facades\Input;
class RubrosJson extends Controller
{
/**
* Create a new controller instance.
*
* @return void
*/
public function __construct()
{
$this->middleware('auth');
}
/**
* Show the application dashboard.
*
* @return \Illuminate\Http\Response
*/
public function index(Request $request)
{
// return Rubros::all();
$rubros = Rubros::all();
$resultado = Response::json($rubros)->withCallback($request->input('callback'));;
return $resultado;
}
}