Block enter if textarea is empty

Question

Block enter if textarea is empty

Navigation

#1 by (1 votes)
#2 by (0 votes)
#3 by (0 votes)

0

I am trying to check if a textarea has valid text. Checking the space was easy, but enter do not know how to verify.

enviar() {
    var num = 13; // 13 é o cód ascii do enter
    if (this.textoEmEdicao == '' || this.textoEmEdicao === " ") { // verifico se o texto é nulo ou tem espaço
      this.textoEmEdicao = '';// setar a textbox para nenhum texto
    } else {
      let mensagem = {
        texto: this.textoEmEdicao,
        data: new Date(),
        contato: this.emissor
      }
      this.adicionarMensagem(mensagem);
      this.textoEmEdicao = '';
    }
}

javascript

asked by anonymous 25.09.2018 / 18:37

3 answers

1

Use preventDefault

Definition and Usage

The preventDefault () method cancels the event if it is cancellable, which means that the default action that belongs to the event will not occur.

For example, this can be useful when:

By clicking a "Submit" button, prevent it from submitting a form
Clicking a link prevents the link from following the URL

Note: Not all events can be canceled. Use the cancelable property to find out if an event is cancellable.

Note : The preventDefault () method does not prevent further propagation of   an event through the DOM. Use the stopPropagation () method to deal with   thereby.

Font : W3schools

Example :

function blockEvent(e) {
  var code = (e.keyCode ? e.keyCode : e.which);
  if (code == 13 && document.getElementById("txt").value === "") {
    e.preventDefault();
  }
}

<textarea id="txt" cols="40" rows="5" onkeypress="blockEvent(event, this)"></textarea>

25.09.2018 / 19:02

0

If you want to know if textarea contains only spaces, it's best to only use the String.trim and check if it is not empty.

The trim removes any whitespace at the beginning and end of a string, whether it breaks lines, tabs, spaces, etc.

let text = document.getElementById('teste');
let feedback = document.getElementById('feedback');

text.addEventListener('keyup', function (event) {
  // retira todos os espaços do início e do fim
  let trimmed = this.value.trim();
  
  // se for vazio mostra erro e apaga o conteúdo.
  if (!trimmed) {
    this.value = '';
    feedback.innerHTML = "textarea vazio";
  } else {
    // se estiver OK remove o erro
    feedback.innerHTML = "";
  }
});

#teste {
  width: 100%;
  height: 100px;
  resize: vertical;
}

<textarea id="teste"></textarea>
<span id="feedback"></span>

25.09.2018 / 19:21

File sent to firebase has 0Bytes How to disable modal closing using the modal ESC key in UI-Bootstrap?

score 0 · Accepted Answer

To check you can use regex /\S/.test(textarea)

To block you can use @fernandosavio's answer

1 - empty

var textarea=document.getElementById("demo").value;

if(/\S/.test(textarea)) {
   console.log('valido');
}else{
   console.log('não válido');
}

<textarea id='demo'></textarea>

2 - with space

    var textarea=document.getElementById("demo").value;

    if(/\S/.test(textarea)) {
       console.log('valido');
    }else{
       console.log('não válido');
    }

<textarea id='demo'> </textarea>

3 - with line break

     var textarea=document.getElementById("demo").value;

     if(/\S/.test(textarea)) {
        console.log('valido');
     }else{
        console.log('não válido');
     }

<textarea id='demo'> 


</textarea>

4- with some content

     var textarea=document.getElementById("demo").value;

     if(/\S/.test(textarea)) {
        console.log('valido');
     }else{
        console.log('não válido');
     }

        <textarea id='demo'>
        
        x 


        </textarea>

/\S/.test(textarea) returns true if and only if there is a non-space character