[Dúvida] Erro Focus() | JavaScript: conhecendo o Browser e padrões de projeto

Solucionado (ver solução)

Solucionado
(ver solução)

2
respostas

por Daniel do Prado Rocha

| 133k xp | 22 posts

Olá Prof Flávio,

O método _limpaFormulario() retorna um erro quanto tento retornar o foco para o campo Data do formulario.

Uncaught TypeError: this._inputData.focus is not a function

 constructor() {

        let $ = document.querySelector.bind(document); /* macete */

        this._inputData = $(`#data`);
        this._inputQuantidade = $(`#quantidade`);
        this._inputValor = $(`#valor`);
        this._listaNegociacoes = new ListaNegociacoes();

    }

 _limpaFormulario() {
        this._inputData = ``;
        this._inputQuantidade = 1;
        this._inputValor = 0.0;

        this._inputData.focus();
    }

Tentei buscar informações sobre o erro e acredito que possa ser relacionado ao modo que fizemos o bind no constructor (perdoe se meu chute for errado).

document.getElementById("myAnchor").focus();

2 respostas

solução!

por Rafael Rocha

| 1798.9k xp | 4028 posts

Alura Scuba Team Apoio Educacional | Moderador

13/03/2023

Olá Daniel, tudo bem com você?

Peço desculpas pela demora em lhe responder.

O erro, Uncaught TypeError: this._inputData.focus is not a function , está sendo levantado devido à atribuição de uma string vazia ao atributo _inputData no método _limpaFormulario. Fazendo com que o atributo perca a referência para o elemento HTML que corresponde ao campo do formulário. No método _limpaFormulario devemos atribuir novos valores para o campo do formulário, utilizando a propriedade .value do atributo ._inputData.

Peço que abra o arquivo NegociacaoController.js, localize o método _limpaFormulario da classe NegociacaoController. Modifique o método deixando-o como apresentado abaixo.

_limpaFormulario() {
    this._inputData.value = ``;
    this._inputQuantidade.value = 1;
    this._inputValor.value = 0.0;

    this._inputData.focus();
}

Note que na atribuição de valores, estamos utilizando o atributo value, da seguinte forma: this._inputQuantidade.value = 1;.

Após a mudança apresentada acima, salve o arquivo NegociacaoController.js. Abra o arquivo index.html no navegador e adicione uma nova negociação. Verifique no painel de desenvolvedor (pressione ) se o erro é apresentado.

Espero ter lhe ajudado. Em caso de dúvidas estou à disposição.

Não hesite em voltar ao fórum para continuar aprendendo e interagindo com a comunidade.

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!

por Daniel do Prado Rocha

| 133k xp | 22 posts

13/03/2023

Olá Felippe,

Obrigado por sua resposta.

Tinha revisado varias vezes sem encontrar o erro.

Meu muito obrigado mais uma vez!

Daniel