Как проверить поле на заполненность перед вызовом модального окна?
 

Здравствуйте. Подскажите, как сделать, чтобы при незаполненном поле модальное окно не открывалось, а вместо этого, поле выделялось красной рамкой и внизу появлялось сообщение, что необходимо заполнить данное поле?

<input class="name" autocomplete="name" name="name" placeholder="Ваше имя" required />
 
 
    <button onclick="show('block')">Отправить</button>
 
    <div id="window9">  
        <p>Содержимое окна</p>
        <button onclick="show('none')" id="closewindow9">X</button>
    </div>

function move() {
  slides[index].style.opacity = "";
  slides[index].style.zIndex = "";
  index = (index + dir + len) % len;
  slides[index].style.opacity = 1;
  slides[index].style.zIndex = 1;
  var article = slides[index].getElementsByTagName('article')[0];
  document.getElementById('window9').style.width = article.offsetWidth+'px';
  document.getElementById('window9').style.height = article.offsetHeight+'px';
  index < len - 1 && (timer = window.setTimeout(move, 1000));
}
 
function show(state) {
  if (state === "block") {
    timer = window.setTimeout(move, 0);
  } else {
    clearTimeout(timer);
  }
  document.getElementById('window9').style.display = state;
  document.getElementById('wrap9').style.display = state;
  
}