Dynamic input returns Undefined

Question

I’m trying to create a dynamic search field. The problem is that when I type something, I can’t get the value of the Javascript field. It only returns me undefined.

My code:

$('.search').focus( function () {
  var timer = 0;
  var input = $('.search');
  input.keyup(function (e) {
      var code = e.keyCode ? e.keyCode : e.which;
      if (code > 45 || code === 32 || code === 8 || code === 13) {
          clearTimeout(timer);
          timer = setTimeout(function () {
              input = input.val()
              alert('neste momento coloca a chamada AJAX '.input)
          }, 200);
      }
  });
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form">
<label for=""></label>
    <div class="form-group">
    <input type="text" class="search" placeholder="Buscar anime..">
    <button type="submit"><i class="fas fa-search"></i></button>
    </div>
</div>

What is wrong?

Answer 1

The error is in the concatenation.

You put .input.

The right thing is +input:

alert('neste momento coloca a chamada AJAX ' + input)