Usar valor da célula clicada para atualizar outra Grid

Olá!

Estou desenvolvendo um Formulário onde uma ação deve ser executada quando o usuário clicar em qualquer Célula da Grid. Nesta ação, preciso do valor da célula que foi clicada, para utilizar como parâmetro na atualização da Grid de baixo.

Estou buscando o valor da posição da coluna através do javascript e jogando para uma variável para atualização de outra grid, porém o comando do javascript é executado depois do evento RowSelected, ou seja, se eu coloco para atualizar a grid abaixo com o evento RowSelected da grid de cima, o latromi executa o update da grid abaixo e depois popula a variável com o valor encontrado pelo javascript e a linha continua marcada, para contornar o problema, foi criado um link na consulta, que ao ser pressionado executa um comando simbólico e realiza o rebinded da grid de cima, com isso, utilizo o evento do rebinded da grid de cima para atualizar a grid de baixo com a varíavel buscada pelo javascript, pois, o javascript já foi executado ao clicar na coluna da grid.

A grid abaixo atualiza um campo ao lado com os dados, nessa grid seria apenas necessário a linha não ficar marcada após ser pressionada para resolver o problema.

O que precisamos seria pressionar o item da grid de cima e atualizar a grid abaixo sem a necessidade do uso do rebinded.

Fico no aguardo de alguma sugestão.

Utilizando o código abaixo, consegui atribuir o valor obtido via JavaScript à uma variável do Formulário ao invés de um Input como estávamos fazendo anteriormente, e assim consegui ajustar para atualizar as Grids sem o uso do evento Rebinded e do link na Consulta.

Usei apenas o evento RowSelected, e o processo ficou mais rápido e limpo.

Valeu!

latromi.formManager.getFormInstance().setVariableValue('Nome_Da_Variavel', 'valor');

Olá @Anderson.Schneider!

Seja bem vindo à comunidade!

Que bom que conseguiu resolver o problema.

Vou mostrar uma outra solução, também usando JavaScript, partindo do cenário que você apresentou inicialmente.

A implementação consiste em disparar o evento Click de um botão oculto toda a vez que a célula for clicada, e passar por argumento o valor da célula.

Você pode encontrar um exemplo funcional neste link.

Siga os passos abaixo:

  1. Nas Consultas, remova todos os links “simbólicos” e desabilite o realce de linha.

  2. No Formulário, remova os eventos Rebinded e RowSelected das Consultas.

  3. Adicione um botão oculto no Formulário com evento Click. Este evento será chamado sempre uma célula for clicada pelo usuário.

  4. No procedimento vinculado ao evento Click do botão, adicione um argumento chamado “cellValue”. Neste argumento, será recebido o valor da célula clicada pelo usuário.

  5. Adicione um arquivo JavaScript ao Formulário. Neste arquivo será adicionado todo o código que manipula o evento Click das células (ver código logo abaixo).

Código JavaScript

O código JavaScript abaixo deve ser adicionado no Formulário, conforme passo 5. Explicações sobre o funcionamento do mesmo estão nos comentários do código.

OBS.: Neste exemplo, a grid se chama “qryGridLetras” e o botão se chama “btnHiddenButton”.

// Adiciona callback para ser executado quando cada Grid for criada 
// e quando elas sofrerem qualquer atualização.
latromi.gridManager.setOnCreateCallBack(configureGridCellClick);
latromi.gridManager.setOnAfterCommandCallBack(configureGridCellClick);

// Função que configura o evento Click nas células da Grid
function configureGridCellClick(arg) {

	// Um pouco de código interno do Latromi....
	let gridElement = document.getElementById(arg.clientID);
	let consultaElement = gridElement.closest('.QueryObjectDisambig');
	let consultaObject = $find(consultaElement.id);
	let upgradeCode = consultaObject._upgradeCode;
	
	// Filtre aqui, através do Código de Atualização, 
	// quais consultas devem adicionar o evento Click as celulas
	if (['CST00000016600002420201014170222010305',
		 'CST...................................',
		 'CST...................................'
		].indexOf(upgradeCode) === -1) {
		return;
	}
	
	// Localiza o elemento correspondente ao campo do fomulário.
	let fieldElement = gridElement.closest('.fieldWrapper').children[0];
	
	// Percorre todas as células da Grid para manipular o evento Click.
	let cells = gridElement.querySelectorAll('.rgRow td, .rgAltRow td');
	cells.forEach(function(cell) {
		cell.style.cursor = 'pointer';
		cell.addEventListener('click', function(fieldClientId) {
			return function(e) {
				gridCellClick(e, fieldClientId);
			}
		} (fieldElement.id));
	});
}

// Esta função será executada sempre que ocorrer o Click na célula da Grid.
function gridCellClick(event, fieldClientId) {
	// Localiza os elementos TD e TR
	let cell = event.target;
	let row = cell.closest('.rgRow, .rgAltRow');
	
	let form = latromi.formManager.getFormInstance();
	let field;
	
	let fieldNames = Object.keys(form.fields);
	for(let n = 0; n < fieldNames.length; n++) {
		if (form.fields[fieldNames[n]].clientId === fieldClientId) {
			field = form.fields[fieldNames[n]];
		}
	}

	if (!field) return;
	
	// Aquie é usando um pouco de código interno do latromi para buscar os valores da linha clicada
	let gridElement = document.querySelector('#' + field.clientId + ' .GridConsulta');
	let gridObject = $find(gridElement.id);
	//
	let rowIndex = parseInt(row.getAttribute('data-rowindex'));
	let rowValues = gridObject.getRowValues(rowIndex); // {col1: "A", col2: "F", col3: "K", col4: "P", col5: "U", col6: "Z"}
	
	// Registra no console os valores da linha clicada
	console.log(rowValues);
	
	// Mostra mensagem com o valor da célula clicada, e outros valores da linha
	//alert('Valor da célula: ' + cell.innerHTML + '\n' +
	//	  'Valores da linha: \n' + JSON.stringify(rowValues, null, 2));

	// Dispara o evento "Click" de um botão que pode estar oculto
	// ou nem ter sido adicionado ao layout do Formulário. 
	// Neste exemplo o nome do botão é "btnHiddenButton"
	// 
	// O terceiro parâmetro da função "raiseFieldEvent" pode ser usado para passar qualquer valor.
	// Estes valores podem ser capurados através de argumentos do procedimento, se forem usados os mesmos nomes.
	form.raiseFieldEvent("btnHiddenButton", 'Click', 
		{ 
			cellValue: cell.innerHTML,
			segundoArgumento: 'Valor do argumento "segundoArgumento"',
			terceiroArgumento: 'Valor do argumento "terceiroArgumento"'
		});
}

@daniel.giacomelli, o processo estava funcionando pegando a posição da coluna de cada tabela através do ID da tabela, porém esse ID ao atualizar em outra base, acabou se modificando, tentei usar a classe da tabela, porém as duas tabelas possuem as classes com o mesmo nome, com isso não consigo identificar qual está sendo clicada, tentei utilizar o código fornecido, e ao atualizar a outra grid, ocorre o problema de “Processo abortado”, possivelmente por causa do RowSelected, não posso retirar o RowSelected, pois além do valor da célula clicada preciso do valor da primeira coluna da linha clicada para atualizar a outra grid.
O comando javascript que estava utilizando para pegar a posição da célula pressionada era o seguinte, o problema são as classes da tabela que são as mesmas e não encontrei nenhuma diferente para realizar este processo:

$(document).on('click', '.rgMasterTable td', function(){
   var coluna = $(this).index();
   latromi.formManager.getFormInstance().setVariableValue('cPosicao', coluna);
});

$(document).on('click', '.rgMasterTable td', function(){
   var coluna = $(this).index();
   latromi.formManager.getFormInstance().setVariableValue('cSubNivel', coluna);
});

@AndersonSchneiderm você pode adicionar uma classe CSS na Consulta e usar a mesma classe no selector do JQuery:

Mas você também pode utilizar a minha abordagem, e passar os valores da linha sem usar o evento RowSelected.

Basta mandar os valores no terceiro parâmetro da função raiseFieldEvent, e recebe-los no Formulário adicionando parâmetros / argumentos no procedimento com o mesmo nome.

Por exemplo, no exemplo abaixo, você precisaria adicionar os argumentos cellValue, col1 e col2 no procedimento btnHiddenButton_Click:

let rowValues = gridObject.getRowValues(rowIndex); // {col1: "A", col2: "F", col3: "K", col4: "P", col5: "U", col6: "Z"}

// Dispara o evento "Click" de um botão que pode estar oculto
// ou nem ter sido adicionado ao layout do Formulário. 
// Neste exemplo o nome do botão é "btnHiddenButton"
// 
// O terceiro parâmetro da função "raiseFieldEvent" pode ser usado para passar qualquer valor.
// Estes valores podem ser capurados através de argumentos do procedimento, se forem usados os mesmos nomes.
form.raiseFieldEvent("btnHiddenButton", 'Click', 
   { 
      cellValue: cell.innerHTML,
      col1: rowValues.col1, // passa o valor da coluna chamada "col1"
      col2: rowValues.col2 // passa o valor da coluna chamada "col2"
   });

Resolvido @daniel.giacomelli, valeu pela dica!