If input has only blanks, do nothing

Question

If input has only blanks, do nothing

Navigation

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

3

I'm doing a chat application with WebSocket .

I used contenteditable="true" in <div/> , because I needed to put it like this to make it easier on other functions.

In the part of input that sends the message to other users I have a problem, when the user types only whitespaces and clicks send, the message is sent, but I want it when it just enter blanks do not send the message.

Can anyone please help me to make this code in JavaScript or with Jquery anyway?

HTML

<div id="message" contenteditable="true">Digite sua mensagem</div>

jQuery

// ENVIA COM O ENTER
$('#message').on('keydown', function(e) {

    var mymessage = $('#message').text(); //get message text
    var myname = $('.myname').text(); //get user name
    var mensagem = 'mensagem='+mymessage;
    var to = $(this).attr('id');
    var code = e.which || e.keyCode;

    if (e.which == 13 && e.shiftKey == false) {
        if (code == 13) {
            if (mensagem != '') {
                //$(".mensagens-unitarias").animate({"scrollTop": $('.mensagens-unitarias')[0].scrollHeight}, "fast");
                $.ajax({
                    type: 'POST',
                    url : 'sys/teste.php',
                    data: 'nome='+myname+'&mensagem='+mymessage,
                    success: function(html){}
                });

                if (mymessage == "") { return false; }

                //prepare json data
                var msg = {
                    message: mymessage,
                    name: myname,
                    color : '<?php echo $colours[$user_colour]; ?>'
                };

                //convert and send data to server
                websocket.send(JSON.stringify(msg));        
            }
        }

        return false;   
    }
})

javascript jquery

asked by anonymous 15.04.2015 / 06:10

2 answers

1

Test change

if(mensagem != ''){

for

if(!mensagem.match(/^(\s)+$/)){

This regular expression will test this text to ensure that at the beginning of the text ( ^ ) there is white space ( \s ) in the amount of 1 or more ( + ) and after that the text ends (% w / w). And then I deny the match with $ at the beginning of this condition, ie to guarantee that this if only true if there is no match.

I think this solves your problem.

15.04.2015 / 06:22

How can I upgrade C ++ to C11 on Ubuntu 14.10? Development Problem in Unity 3D

score 3 · Accepted Answer

One solution involves two things:

If the string size is strictly equal to anything making use of the .length :
```
string.length === 0
```
If after removing white space the string is empty, using the trim() :
```
!string.trim()
```

Example

Example also available on JSFiddle .

$(function() {

  var $target = $('#message');

  $target.on("keyup", function() {

    var value = $target.text();

    if (value.length === 0 || !value.trim())
      return false;

    // continuar...
    alert(value);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script><divid="message" contenteditable="true">Digite sua mensagem</div>

In the example above, a browser alert will appear with the value entered if this value has something other than white space. If you enter 1 or more blanks, nothing will happen.

Note: I use the event keyup to trigger the code after the keystroke and not when we are going to type a new one, getting more coherence between what is written on the screen and what the code is using to work.