3
Good night. I’m studying and I really need three things, but if you can help with just one, that’s good, I tried to search and applied many tips from various websites but I was not successful. I need the button "Enter (arrow) inside Android"call the specific function inside the button "search". if I set the button to "input button" enter does nothing and if I just set it to "button" enter gives error page. Summarizing the javascript code searches inside the object array by the cancel number of the list and prints in a table. Note. the code works but here I could not run.
1 - centralize H1 - could not get on the screen of Android 9 2 - bring Section left - 3 - question = make the android enter button call the function
<script type = "text/javascript">
const lista = [
{loja:100,cancelamento:123,atendimento:'Autorização Nº1077229',data: '01/01/2020',
status:'Resolvido'
},
{loja:200,cancelamento:456,atendimento:'Enviado para Administradora',data: '02/02/2020',
status:'Resolvido'
},
{loja:300,cancelamento:789,atendimento:'Não é permitido cancelamento parcial',data: '03/03/2020',
status:'Aguardando Filial'
}
]
/*
cancelamento.addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode === 13) {
buscar();
}
}); */
function handleEnterKeyPress() {
console.log('Enter key pressed')
}
window.addEventListener('keyup', event => {
console.log(event.code, event.key);
if (event.code === 'NumpadEnter' || event.code === 'Enter')
buscar();
});
function buscar() {
var cancelamento = document.getElementById('cancelamento')
let buscar = Number(cancelamento.value)
let result = document.getElementById('res')
let listagem = document.getElementById('listagem')
let table = document.getElementById('table')
const procurar = lista.find( obj => obj.cancelamento === buscar )//buscar
console.log( procurar )
console.log(`lista ${lista}`)
console.log(buscar)
console.log(lista[0].atendimento)
console.log("testando" + typeof(procurar))
console.log("testando" + typeof(lista))
if(procurar != undefined){
document.getElementById('loja').innerText = "Loja"
document.getElementById('cancelamentoTabela').innerText = "Cancelamento"
document.getElementById('atendimento').innerText = "Atendimento"
document.getElementById('data').innerText = "Data"
document.getElementById('status').innerText = "Status"
var lojaRes = document.getElementById("lojaRes")
var cancelamentoRes = document.getElementById('cancelamentoRes')
var atendimentoRes = document.getElementById("atendimentoRes")
var dataRes = document.getElementById("dataRes")
var statusRes = document.getElementById("statusRes")
document.getElementById('lojaRes').innerText = procurar.loja
document.getElementById('cancelamentoRes').innerText = procurar.cancelamento
document.getElementById('atendimentoRes').innerText = procurar.atendimento
document.getElementById('dataRes').innerText = procurar.data
document.getElementById('statusRes').innerText = procurar.status
console.log("testando" + typeof(procurar.status))
if (procurar.status == "Aguardando Filial")
{ statusRes.style.backgroundColor = '#FF0000';}
else
{ statusRes.style.backgroundColor = '#32CD32';}
listagem.innerText = " "
var div = document.getElementById('div')
div.style.display = 'block';
cancelamento.focus()
document.getElementById('cancelamento').Number = ""
}if (procurar == undefined) {
listagem.innerText = "Cancelamento não localizado!"
var div = document.getElementById('div')
div.style.display = 'none';
cancelamento.focus()
document.getElementById('cancelamento').Number = ""
}
}
var button = document.getElementById('button')
button.addEventListener('click',mudaBackground);
function mudaBackground() {
thead.style.backgroundColor = "rgb(85, 167, 221)";
thead.style.border = "2px solid black";
lojaRes.style.border = "2px solid black";
cancelamentoRes.style.border = "2px solid black";
atendimentoRes.style.border = "2px solid black";
dataRes.style.border = "2px solid black";
statusRes.style.border = "2px solid black";
document.getElementById('loja').style.border = "2px solid black";
document.getElementById('cancelamentoTabela').style.border = "2px solid black";
document.getElementById('atendimento').style.border = "2px solid black";
document.getElementById('data').style.border = "2px solid black";
document.getElementById('status').style.border = "2px solid black";
console.log(procurar)
if (procurar.status = "Aguardando Filial") {
{ statusRes.style.backgroundColor = '#FF0000';
}
}else { statusRes.style.backgroundColor = '#32CD32';}
}
</script>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Cancelamento</title>
<link rel="stylesheet" href="https://sites.google.com/site/cancelamentocreddvol/estilo.consulta.css">
</head>
<header>
<h1 class="h1" id="h1">Consulta Cancelamento</h1><br>
</header>
<body>
<section class="section" id="section">
<div>
<input type="number" class="cancelamento" name="cancelamento" id="cancelamento" autofocus="cancelamento"><input type="button" class="buscar" value="buscar" onclick="buscar();mudaBackground();" id="button">
</div>
<div id="res" class="res">
<strong> <p id="listagem"></p> </strong>
</div>
<div id="div">
<p id="listagem2">
<table class="table" id="table">
<thead class="thead" id="thead">
<th id="loja" class="th"></th>
<th id="cancelamentoTabela" class="th"></th>
<th id="atendimento" class="th"></th>
<th id="data" class="th"></th>
<th id="status" class="th"></th>
</thead>
<tbody class="tbody">
<td id="lojaRes" class="td"></td>
<td id="cancelamentoRes" class="td"></td>
<td id="atendimentoRes" class="td"></td>
<td id="dataRes" class="td"></td>
<td id="statusRes" class="td"></td>
</tbody>
</table>
</p>
</div>
</section>
</body>
</html>
Thanks for the answer. I tried to implement your code and also could not make work on Android Enter. I even found another code, but to no avail. cancellation.addeventlistener("keyup", Function(Event) { Event.preventDefault(); if (Event.keycode === 13) { fetch(); } })
– Thiago Faria
The estate
event.keyCode
is obsolete, beware of using. Try running this code through the desktop browser using the emulated mobile keyboard and look on the console at which code will appear. Or change theconsole.log
by aalert
and test on the same cell– Costamilam
Thanks for the tip. Unfortunately I could not implement the friend code maybe I did not explain right: what I need is for the function to be called by the button ( working ok) or by "enter on android keyboard". The way I test is to move the.html file to your phone and open it in the browser. I even linked the original script https://sites.google.com/site/cancelamentocreddvol/stack.js
– Thiago Faria
Using the code below I was able to search with Enter but it is not printed on the screen, shows and clears the screen. <script type="text/javascript"> Document.getElementById("cancel"). onkeypress = Function(Event){ if (Event.keycode == 13 || Event.which == 13){ fetch(); } }; >
– Thiago Faria
It seems that the problem is different, if it is the case, open another question. Don’t ask too many questions together, if you solved this problem, mark the best answer as correct
– Costamilam
But not solved , I’m still trying to call the function with the keyboard enter on android and also with the button ( that already works ).
– Thiago Faria