title: Getting the Autocomplete to work on paste event in jQuery
body: <p>I have this function which initializes an autocomplete which is called on the .ready:</p>
  
  <pre><code>function InitStudentsAutoComplete() {
      $("#acStudent").autocomplete({
          delay: 250,
          focus: function (event, ui) {
              $("#acStudent").val(ui.item.name);
              return false;
          },
          select: function (event, ui) {
              $("#acStudent").val(ui.item.name);
              $("#acStudent-id").val(ui.item.id);
              SetCurrentStudentInfo(ui.item);
              $("#acStudentShowDetails").addClass("linkShow").removeClass("linkNoShow");
              return false;
          },
          source: function (request, response) {
              var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
              var matchList = $.grep(studentList, function (value) {
                  var studentName = value.name;
                  return matcher.test(studentName) || matcher.test(normalize(studentName));
              });
              response(matchList);
          }
      }).autocomplete("instance")._renderItem = function (ul, item) {
          return $("&lt;li&gt;").append(item.name).appendTo(ul);
      };
  }
  </code></pre>
  
  <p>studentList is the array on which the search is performed.</p>
  
  <p>So when the user starts typing, let's say the letter 'a', the autocomplete will list all the entries in the studentList array which have that letter.
  User selects one and the SetCurrentStudentInfo() method will set the required object with the properties.
  There is a 'Details' link next to the autocomplete text box:</p>
  
  <pre><code> &lt;a id="acStudentShowDetails" href="javascript:ShowStudentDetails();"&gt;Details...&lt;/a&gt;
  </code></pre>
  
  <p>When clicked will open a pop-up with the details of the selected student:</p>
  
  <pre><code>function SetCurrentStudentInfo(student) {
      studentInfo = {
          studentname: student.name,
          address: student.contact.address,
          email: student.contact.email,
          studentId: student.id
      };
  }
  
  function ShowStudentDetails() {
      openDetailsPopup({
          "Student Name": studentInfo.studentname,
          "Address": studentInfo.address,
          "EMail": studentInfo.email,
          "Id": studentInfo.Id
      }, { title: "Student Details" });
  }
  
  function openDetailsPopup(object, option) {
  
      manageOption(option);
  
      var rowTemplate = '&lt;div class="row"&gt;' +
          '&lt;div class="col-xs-4 modal-field-label"&gt;{{$key}}&lt;/div&gt;' +
          '&lt;div class="col-xs-7"&gt;{{$value}}&lt;/div&gt;' +
          '&lt;/div&gt;';
  
      var html = '';
  
      for (var prop in object) {
          if (object.hasOwnProperty(prop)) {
              html += rowTemplate.replace("{{$key}}", prop).replace("{{$value}}", object[prop]);
          }
      }
  
      $("#modalPopup-content").empty();
      $(html).appendTo("#modalPopup-content");
  
      $('#modalPopup').modal('show');
  
      return;
  
      function manageOption(inputOptions) {
          if (!inputOptions) return;
          $("#modalPopup-title").html((!!inputOptions.title) ? inputOptions.title : "Details");
      }
  }
  </code></pre>
  
  <p>This all works fine when a user selects an entry from the suggestion list.
  When something is pasted and it's a valid entry and nothing is selected from the suggestions the object properties are not being set because that's happening only on the Select event.</p>
  
  <p>How do I make it work in this case where a user can paste a valid entry in the text box and does not select a value from the suggestion?</p>
  
  <p>I tried binding to the paste event but I don't know how to send the ui.item value to the SetCurrentStudentInfo()!</p>
  
  <p>Thanks in advance.</p>