Hello, I'm using a textbox to search and load the datasource of the Kendo grid. However the way we set up the project, to edit a record it is necessary to select a Grid item and edit in the fields above it (when the data is populated in the fields, we call it recover). When I load the Grid without using the search, everything happens fine, but when I use the search it does not perform the editing, giving an error in the following function (this function is the one that makes the whole process of checking what is being done - update, insert, delete, select):
function criaViewModel() {
return new kendo.observable({
registros: dados,
selecionado: new modelo(),
salvar: function () {
$(".clMsg").text("");
if (this.selecionado.Id < 1) {
this.registros.add(this.selecionado);
} else {
if (recuperado) { //Neste IF que ocorre o erro
var indice = this.registros.indexOf(this.registros.get(this.selecionado.Id)); //this.selecionado.Id vem com o valor correto.
var registro = this.registros.data()[indice];
for (var _propriedade in modelo.fields) {
registro.set(_propriedade, this.selecionado[_propriedade]); // aqui ele para a execução e diz que "set" não está definido. Isso ocorre porque o índice é = -1 nesse ponto
}
}
}
this.registros.sync();
},
cancelar: function () {
$(".clMsg").text("");
this.registros.cancelChanges();
this.set("selecionado", new modelo());
},
excluir: function () {
if (this.selecionado != null && this.selecionado.Id > 0) {
MsgPergunta(null,"Confirma a exclusão do registro?", Excluir);
}
},
});
}
Let's look at the rest of the sample code.
SQL that generates the information:
public function Listar($aPesq) {
$this->Lista = array ();
$sql = "SELECT VEHICLES.ID,
INTEGRATORS.NAME AS INTEGRADOR,
CUSTOMERS.NAME AS CLIENTE,
VEHICLES_TYPES.DESCRIPTION AS TIPOVEICULO,
VEHICLES.PLATE AS PLACA,
DRIVERS.NAME
FROM VEHICLES
INNER JOIN CUSTOMERS ON VEHICLES.Customer = CUSTOMERS.ID
INNER JOIN dbo.VehiclesByUserId(1492) ON (Vehicles.Id = dbo.VehiclesByUserId.VehicleId)
LEFT JOIN DRIVERS ON (VEHICLES.DRIVERID=DRIVERS.DRIVERID)
LEFT JOIN INTEGRATORS ON VEHICLES.INTEGRATORID = INTEGRATORS.INTEGRATORID
LEFT JOIN VEHICLES_TYPES ON VEHICLES.VEHICLETYPEID = VEHICLES_TYPES.ID
WHERE Integrators.Name LIKE '{$aPesq}' OR Customers.Name LIKE '{$aPesq}' OR Description LIKE '{$aPesq}' OR Plate LIKE '{$aPesq}' OR Drivers.Name LIKE '{$aPesq}'
ORDER BY CUSTOMERS.NAME,VEHICLES.PLATE";
$this->bd->Clear ();
$this->bd->setSQL ( $sql );
if ($this->bd->Executar ()) {
foreach ( $this->bd->Registro as $registro ) {
$tmp = new Veiculo ();
$tmp->Id = $registro->Campo ["ID"];
$tmp->Integrador = ($registro->Campo ["INTEGRADOR"]);
$tmp->Cliente = ($registro->Campo ["CLIENTE"]);
$tmp->TipoVeiculo = ($registro->Campo ["TIPOVEICULO"]);
$tmp->Placa = $registro->Campo ["PLACA"];
$tmp->Motorista = $registro->Campo ["NAME"];
$this->Lista [] = $tmp;
}
} else {
$this->Lista [] = new Veiculo ();
}
return true;
}
public function Recuperar($aIdVeiculo) {
$this->Id = $aIdVeiculo;
$sql = "SELECT TOP 1 VEHICLES.ID,
INTEGRATORS.INTEGRATORID AS IDINTEGRADOR,
INTEGRATORS.NAME AS INTEGRADOR,
FreightBrokers_Shippers.ShipperId AS IDEMBARCADOR,
Cooperatives_FreightBrokers.FreightBrokerId AS IDUNIDADE,
Carriers_Cooperatives.CooperativeId AS IDCOOPERATIVA,
CUSTOMERS.ID AS IDTRANSPORTADORA,
CUSTOMERS.NAME AS CLIENTE,
VEHICLES.VEHICLETYPEID AS IDTIPOVEICULO,
VEHICLES_TYPES.DESCRIPTION AS TIPOVEICULO,
VEHICLES.VEHICLESBRANDID AS IDMARCAVEICULO,
VEHICLES.PLATE AS PLACA,
VEHICLES.MODEL AS MODELO,
VEHICLES.FABRICATIONYEAR AS ANOFABRICACAO,
VEHICLES.MODELYEAR AS ANOMODELO,
VEHICLES.FLEET AS FROTA,
VEHICLES.COLOR AS COR,
VEHICLES.TARA AS TARA,
VEHICLES.CAPTUREXMLDATA AS CAPTURAPACOTES,
VEHICLES.VISIBLEONGRIDS AS VISIVELNOSGRIDS,
VEHICLES.OBSERVATIONS AS OBSERVACOES,
VEHICLES.DRIVERID AS IDMOTORISTA,
VEHICLES.STOLENVEHICLE AS ROUBADO
FROM VEHICLES
INNER JOIN INTEGRATORS ON VEHICLES.INTEGRATORID = INTEGRATORS.INTEGRATORID
INNER JOIN CUSTOMERS ON VEHICLES.Customer = CUSTOMERS.ID
INNER JOIN Carriers_Cooperatives ON ( Customers.Id = Carriers_Cooperatives.CarrierId)
INNER JOIN Cooperatives_FreightBrokers ON ( Carriers_Cooperatives.CooperativeId = Cooperatives_FreightBrokers.CooperativeId)
INNER JOIN FreightBrokers_Shippers ON ( Cooperatives_FreightBrokers.FreightBrokerId = FreightBrokers_Shippers.FreightBrokerId)
LEFT JOIN VEHICLES_TYPES ON VEHICLES.VEHICLETYPEID = VEHICLES_TYPES.ID
WHERE VEHICLES.ID ={$this->Id} AND Customers.Status = 0
ORDER BY FreightBrokers_Shippers.ShipperId, Cooperatives_FreightBrokers.FreightBrokerId, Carriers_Cooperatives.CooperativeId, Vehicles.Customer";
$this->bd->Clear ();
$this->bd->setSQL ( $sql );
if ($this->bd->Executar ()) {
$this->Id = $this->bd->Registro [0]->Campo ["ID"];
$this->IdIntegrador = $this->bd->Registro [0]->Campo ["IDINTEGRADOR"];
$this->IdEmbarcador = $this->bd->Registro [0]->Campo ["IDEMBARCADOR"];
$this->IdUnidade = $this->bd->Registro [0]->Campo ["IDUNIDADE"];
$this->IdCooperativa = $this->bd->Registro [0]->Campo ["IDCOOPERATIVA"];
$this->IdTransportadora = $this->bd->Registro [0]->Campo ["IDTRANSPORTADORA"];
$this->IdTipoVeiculo = $this->bd->Registro [0]->Campo ["IDTIPOVEICULO"];
$this->IdMarcaVeiculo = $this->bd->Registro [0]->Campo ["IDMARCAVEICULO"];
$this->Placa = $this->bd->Registro [0]->Campo ["PLACA"];
$this->Modelo = ($this->bd->Registro [0]->Campo ["MODELO"]);
$this->AnoFabricacao = $this->bd->Registro [0]->Campo ["ANOFABRICACAO"];
$this->AnoModelo = $this->bd->Registro [0]->Campo ["ANOMODELO"];
$this->Frota = ($this->bd->Registro [0]->Campo ["FROTA"]);
$this->Cor = $this->bd->Registro [0]->Campo ["COR"];
$this->Tara = $this->bd->Registro [0]->Campo ["TARA"];
$this->CapturaPacotes = ($this->bd->Registro [0]->Campo ["CAPTURAPACOTES"] == 1);
$this->VisivelNosGrids = ($this->bd->Registro [0]->Campo ["VISIVELNOSGRIDS"] == 1);
$this->Roubado = ($this->bd->Registro [0]->Campo ["ROUBADO"] == 1);
$this->Observacoes = ($this->bd->Registro [0]->Campo ["OBSERVACOES"]);
$this->IdMotorista = $this->bd->Registro [0]->Campo ["IDMOTORISTA"];
return true;
} else {
return false;
}
}
Screen HTML
<div>
<table class="tbForm">
<tr>
<td colspan="2" class="clMsg"></td>
</tr>
<!-- Combos -->
<tr>
<td class="clLegenda">
<span class="cpoObrigatorio">*</span>
Embarcador:
<br/>
<select class="k-combobox" id="cboEmbarcador" data-bind="value: selecionado.IdEmbarcador" ></select>
</td>
<td class="clLegenda">
<span class="cpoObrigatorio">*</span>
Unidade:
<br/>
<select class="k-combobox" id="cboUnidade" data-bind="value: selecionado.IdUnidade" ></select>
</td>
<td class="clLegenda">
<span class="cpoObrigatorio">*</span>
Cooperativa:
<br/>
<select class="k-combobox" id="cboCooperativa" data-bind="value: selecionado.IdCooperativa" ></select>
</td>
</tr>
<tr>
<td class="clLegenda">
<span class="cpoObrigatorio">*</span>
Transportadora:
<br/>
<select class="k-combobox" id="cboTransportadora" data-bind="value: selecionado.IdTransportadora" ></select>
</td>
<td class="clLegenda">
<span class="cpoObrigatorio">*</span>
Integrador:
<br/>
<select class="k-combobox" id="cboIntegrador" data-bind="value: selecionado.IdIntegrador" ></select>
</td>
<td class="clLegenda">
Motorista:
<br/>
<select class="k-combobox" id="cboMotorista" data-bind="value: selecionado.IdMotorista" ></select>
</td>
</tr>
<tr>
<td class="clLegenda">
Tipo de Veículo:
<br/>
<select class="k-combobox" id="cboTipoVeiculo" data-bind="value: selecionado.IdTipoVeiculo" ></select>
</td>
<td class="clLegenda">
Marca:
<br/>
<select class="k-combobox" id="cboMarcaVeiculo" data-bind="value: selecionado.IdMarcaVeiculo" ></select>
</td>
<td class="clLegenda">
Cor do Veículo:
<br/>
<select class="k-combobox" id="cboCor" data-bind="value: selecionado.Cor" ></select>
</td>
</tr>
<tr>
<td class="clLegenda">
Modelo:
<br/>
<input name="edtCliente" id="edtCliente" data-bind="value:selecionado.Modelo" class="k-textbox"/>
</td>
<td class="clLegenda">
<span class="cpoObrigatorio">*</span>
Placa:
<br/>
<input name="edtCliente" id="edtCliente" data-bind="value:selecionado.Placa" class="k-textbox" data-mask="LLL-0000" data-role="maskedtextbox"/>
</td>
<td class="clLegenda">
Frota:
<br/>
<input name="edtCliente" id="edtCliente" data-bind="value:selecionado.Frota" class="k-textbox"/>
</td>
</tr>
<tr>
<td class="clLegenda">
Ano Modelo:
<br/>
<input id="edtAnoModelo" name="edtAnoModelo" data-role="numerictextbox" data-bind="value: selecionado.AnoModelo" data-format="####" />
</td>
<td class="clLegenda">
Ano Fabricação:
<br/>
<input id="edtAnoFabricacao" name="edtAnoFabricacao" data-role="numerictextbox" data-bind="value: selecionado.AnoFabricacao" data-format="####" />
</td>
<td class="clLegenda">
Tara:
<br/>
<input id="edtTara" name="edtTara" data-role="numerictextbox" data-bind="value: selecionado.Tara" data-format="n0" />
</td>
</tr>
<tr>
<td class="clLegenda"><input type="checkbox" id="chkCapturaPacotes" name="chkCapturaPacotes" class="k-checkbox" data-bind="checked: selecionado.CapturaPacotes" />Captura Pacotes</td>
<td class="clLegenda"><input type="checkbox" id="chkVisivelGrid" name="chkVisivelGrid" class="k-checkbox" data-bind="checked: selecionado.VisivelNosGrids" />Visível nos Grids</td>
<td class="clLegenda"><input type="checkbox" id="chkVeiculoRoubado" name="chkVisivelGrid" class="k-checkbox" data-bind="checked: selecionado.Roubado" />Veículo Roubado</td>
</tr>
<tr>
<td class="clLegenda" colspan="3">
Observações:
<br/>
<textarea name="edtObservacoes" id="edtObservacoes" data-bind="value:selecionado.Observacoes" rows="5" class="k-textbox" style="width: 99%;"></textarea>
</td>
</tr>
<td colspan="3" class="clBotoes" align="right">
<table style="width: 100%">
<tr>
<td style="text-align: left;">
<input type="text" id="edtPesquisa" name="edtPesquisa" placeholder="Pesquisar..." class="k-textbox" onkeypress="PesquisarENTER(event)" />
<input type="button" class="k-button" id="btnPesquisar" value="Pesquisar" />
<img src="Imagens/gmapa-icones/media/help.png" id="dvInformacao" style="width: 20px; vertical-align: middle;" onclick="Ajuda()"/>
</td>
<td>
<?php if (ValidaPermissaoFuncionaliade($_dados,"salvar")) echo '<input type="button" value="Salvar" id="btnSalvar" data-bind="click: validar" class="k-button" /> '; ?>
<input type="button" value="Cancelar" id="btnCancelar" data-bind="click: cancelar" class="k-button" />
</td>
</tr>
</table>
</td>
</tr>
</table>
<hr />
<div id="dvLista">
<span class="clSubTitulo">Veículos já cadastrados</span><br />
<div id="grdDados" class="grdDados"></div>
</div>
<br><br>
</div
Screen Javascript
/* Definição do modelo */
modelo = kendo.data.Model.define({
id: "Id",
fields: {
Id: { editable: false, nullable: false, type: "number", defaultValue: 0 },
IdIntegrador: { editable: true },
IdEmbarcador: { editable: true },
IdUnidade: { editable: true },
IdCooperativa: { editable: true },
IdTransportadora: { editable: true },
IdTipoVeiculo: { editable: true },
IdMarcaVeiculo: { editable: true },
IdMotorista: { editable: true },
Motorista: { type: "string"},
Placa: { type: "string"},
Modelo: { type: "string"},
AnoFabricacao: { type: "number"},
AnoModelo: { type: "number"},
Frota: { type: "string"},
Cor: { type: "string"},
Tara: { type: "number"},
CapturaPacotes: { type: "boolean", defaultValue: true},
VisivelNosGrids: { type: "boolean", defaultValue: true},
Observacoes: { type: "string"},
Roubado: { type: "boolean"},
}
});
/* Definição do datasource */
dados = criaDataSource(modelo);
// assim que carregar a página
$(document).ready(function () {
kendo.culture("pt-BR");
vmObjeto = criaViewModel(); // instancia o vm
$("#btnPesquisar").click(function () {
listaVeiculos = new kendo.data.DataSource({
transport: {
read: {
url: urlBase + "/principal.php?ACAO=Listar",
dataType: "json",
type: "POST",
data: {
MODULO: "<?=$_POST["MODULO"]?>",
TELA:"<?=$_POST["TELA"]?>",
Pesq: $("#edtPesquisa").val()
}
}
},
batch: false,
schema: {
model: modelo
},
requestStart: function (e){
$(".clCarregando").show();
},
requestEnd: function (e){
$(".clCarregando").hide();
}
});
var grdVeiculos = $("#grdDados").data("kendoGrid");
grdVeiculos.setDataSource(listaVeiculos);
$("#edtPesquisa").val('');
}
$("#grdDados").kendoGrid({
columns: [
{field:"Integrador", title:"Integrador" },
{field:"Cliente", title:"Cliente" },
{field:"TipoVeiculo", title:"Tipo" },
{field:"Placa", title:"Placa" },
{field:"Motorista", title:"Motorista" }
],
groupable: true,
sortable: true,
editable: false,
filterable: true,
pageable: true,
selectable: "row",
height: 420,
dataSource: dados,
change: function (e) {
recuperarRegistro(this.dataItem(this.select()).Id, modelo); // Passa o Id selecionado para o SQL de Recuperar
}
});
});