Как сделать валидацию на ajax без формы?

Question

[hollanditkzn]

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

<div id="myDisign">
								<div class="HeadConsBox">
									<div class="HeadCons">
										<h2><div>Сделай свой дизайн</div></h2><div id="HeadText2">за <span class="text1">минуту</span> и скачай!</div>
										<div class="phoneBox1">
											<label for="phoneSubmot" class="phoneLabel"><div class="phoneText"><span class="phoneText1">Телефон:</span></label>
											<input type="phone" name="phone" id="phoneSubmot" value="sendPhone1" placeholder="7(9__) ___-__-__"></div>
										</div>
										<div class="HeadCons">
											<button type="submit" name="interpreter" id="interpreter" class="design"><span id="textButton1">Попробовать</span> бесплатно!</button><br>
											<div id="konstructor">.</div>
											<!-- <button class="design" id="konstructor" type="button">Конструктор</button> -->
										</div>
									</div>
									<div class="phoneSpecify">
										УКАЖИТЕ, ПОЖАЛУЙСТА, ВАШ НОМЕР ТЕЛЕФОНА <br>ЧТОБЫ МЫ МОГЛИ СВЯЗАТЬСЯ С ВАМИ
									</div>
									<script>
										$(document).ready(function(){
											$("#konstructor").click(function(){
												$.ajax({
													url: "konstruktor.html",
													type: "GET",
													data: {},
													success: function(data){
														$("#konst").html(data);
													}
												});
											});
										});
									</script>
								</div>
							</div>

Обрабатывает на ajax запрос

$("#interpreter").click(function(){
		var callPhone1 = $("#phoneSubmot").val();
		$.ajax({
			url: "sendEmail.php",
			type: "POST",
			data: {call1: callPhone1},
			beforeSend: function(data){
		    		$("#interpreter").text("Ожидайте...")
		    	},
			success: function(data){
				$("#myDisign").html(data);
			} 
		});
	});

И уже на php

$error="
<div id='myDisign'>
	<div class='HeadConsBox'>
		<div class='HeadCons'>
			<h2><div>Сделай свой дизайн</div></h2><div id='HeadText2'>за <span class='text1'>минуту</span> и скачай!</div>
			<div class='phoneBox1'>
			<div>Введите поле с телефоном</div>
				<label for='phoneSubmot' class='phoneLabel'><div class='phoneText'><span class='phoneText1'>Телефон:</span></label>
				<input type='phone' name='phone' id='phoneSubmot' placeholder='7(9__) ___-__-__'></div>
			</div>
			<div class='HeadCons'>
				<button type='submit' name='interpreter' id='interpreter' class='design'><span id='textButton1'>Попробовать</span> бесплатно!</button><br>
				<div id='konstructor'>.</div>
				<!-- <button class='design' id='konstructor' type='button'>Конструктор</button> -->
			</div>
		</div>
		<div class='phoneSpecify'>
			УКАЖИТЕ, ПОЖАЛУЙСТА, ВАШ НОМЕР ТЕЛЕФОНА <br>ЧТОБЫ МЫ МОГЛИ СВЯЗАТЬСЯ С ВАМИ
		</div>
		<script>
			$(document).ready(function(){
				$('#konstructor').click(function(){
					$.ajax({
						url: 'konstruktor.html',
						type: 'GET',
						data: {},
						success: function(data){
							$('#konst').html(data);
						}
					});
				});
			});
		</script>
	</div>
</div>";
if(isset($_POST["call1"]))
{
	if ($_POST["call1"] == "") {
		echo $error;
	} else {
	$tel = htmlspecialchars($_POST["call1"]);
	$to="[e-mail]";
	$subject="Заказ звонка с сайта Печать  на футболках";
	$message = "Нажал на попробовать бесплатно. Телефон ".$tel;

	sendSMTP($to, $subject, $message, $attach);
	}

Там получается, что когда не заполнил input, выходит правильная форма, но повторно нельзя отправить

Answer 1

[hollanditkzn]

Решил проблему, в bedoreSend я вставил валидацию

var  send = true;
$('form#orderForm input[type="text"]').each(function(){
    if(!$(this).val() || $(this).val() == ''){
       $(this).css('border-color','red');//Сделаем бордер красным
       send = false;
    }
});

if(!send) return false;