Запретить ввод пустого сообщения

[teplov]

Всем привет!Есть чат,по кнопке send в чат отправляется пустое сообщение как от этого избавиться?Вот код формы

<div class="input-group" >
<form target="myIFR" action="" name="order">
<input id="text" type="text" class="form-control message_input" onclick ="var self = this; setTimeout(function(){self.value=''}, 50)" placeholder="введите текст" name="goodss" autocomplete="off" >
<iframe name="myIFR" style="display: none"></iframe>
</form>   
<span class="input-group-btn" >
<button  class="btn btn-secondary send_message" type="button"><i class="fa fa-send"></i><span class="glyphicon glyphicon-send"></span></button>
</span>
</div>

[Malleys]

Есть чат,по кнопке send в чат отправляется пустое сообщение как от этого избавиться?

Добавьте к полю ввода атрибут required

<button  class="btn btn-secondary send_message" type="button">

Должно быть значение submit у атрибута type

<button  class="btn btn-secondary send_message" type="submit">

которое по-умолчанию можно пропустить. Кнопка должна находиться внутри формы. Таймер можно удалить.

Также вместо <i class="fa fa-send"></i><span class="glyphicon glyphicon-send"></span> можно указать просто текст. Тип текст можно не указывать.

<div class="input-group">
	<form target="myIFR" action="" name="order">
		<input id="text" class="form-control message_input" onclick="this.value='';" placeholder="введите текст" name="goodss" autocomplete="off" required>
		<iframe name="myIFR" style="display: none"></iframe>
		<span class="input-group-btn">
			<button class="btn btn-secondary send_message">Send</button>
		</span>
	</form>
</div>

[laimas]

Кнопка должна находиться внутри формы

Не обязательно, ее, и как любые поля формы, можно размещать вне тега form. С тегом формы поля связываются просто, посредством атрибута form.

[teplov]

Немного не так видимо изложил свою проблему ,у меня в чате появляется сообщение даже если проверку ввода в поле включить,то есть оставить одну кнопку сенд и по ней можно чат заспамить пустыми сообщениями...

[рони]

teplov,
а на сервере фильтровать пустые сообщения?

[Malleys]

laimas, 👌 👍

В примере атрибут form не использовался (и на самой форме нет атрибута id), поэтому я решил, что там неправильно закрыт элемент.

[laimas]

на сервере фильтровать пустые сообщения?

Даже без вопросов, без этого никакая проверка на клиенте не поможет. )

[Malleys]

Немного не так видимо изложил свою проблему ,у меня в чате появляется сообщение даже если проверку ввода в поле включить,то есть оставить одну кнопку сенд и по ней можно чат заспамить пустыми сообщениями...

Код, который обрабатывает отправку... там посмотрите, чтобы пустые сообщения не вставлялись.

Обычно то, что вы отправили вам не нужно сразу вставлять в чат. Нужно чтобы сервер всем прислал текст, включая вас. (Только у вас он будет отображаться как будто вы отправитель) Тогда вы точно будете уверены, что текст был отправлен, и соответственно только тогда можно очистить поле ввода (Поскольку вы получили ответ от сервера). А если сообщение не было отправлено, то и текстовое поле не нужно очищать (Поскольку его придётся вводить заново и ещё это создаёт ложное впечатление, будто бы текст был отправлен!)

а на сервере фильтровать пустые сообщения?

А зачем вообще пустые сообщения отправлять?

[teplov]

Вот я и не знаю как на сервере отфильтровать...чат на сокетах вот код скрипта чата

var getMessageText, sendMessage, Message;
Message = function (arg) {
    this.text = arg.text, this.message_side = arg.message_side;
    this.draw = function (_this) {
        return function () {
            var $message;
            var json = JSON.parse(_this.text);
            alertChat();
            return createMessage(json.text, json.name, json.photo, _this.message_side);
        };
    }(this);
    return this;
};
getMessageText = function () {
    var $message_input;
    $message_input = $('.message_input');
    return $message_input.val();
};
sendMessage = function (text, message_side) {
    var $messages, message;
    if (text.trim() === '') {
        return;
    }
    $messages = $('.messages');
    message = new Message({
        text: text,
        message_side: message_side
    });
    message.draw();
    return $messages.animate({scrollTop: $messages.prop('scrollHeight')}, 300);
};

function createMessage(text, name, photo, message_side){    
    $message = $($('.message_template').clone().html());    
    if(message_side==="left"){
        $message.find('.text_wrapper').removeClass("pull-left").addClass("pull-right");
        $message.find('.text_wrapper').removeClass("alert-info").addClass("alert-warning");
        $message.find('.name').removeClass("label-info").addClass("label-warning");
        $message.find('.avatar').removeClass("pull-right").addClass("pull-left");
    }
    $message.find('.text').html(text);
    $message.find('.name').html(name);
    $message.find('.photo').attr('src', photo);
    $('.messages').append($message);
    $message.addClass('appeared');
}

[teplov]

Вот именно что пустые сообщения не нужны,получается пользователь жмет Enter и в чат летят пустышки,а где и что зафильтровать я не пойму,все перепробовал,но видимо не хватает у меня на старости лет ума (((