Question

In the code below, I have the same function on three different events (focus, select, change). This seems redundant but I can’t figure out how to combine the three into one. Thanks in advance for any ideas!

$("input[name^='addSchool']").autocomplete({
    source: function (request, response) {
        var temp = $("input[name^='addSchool']").attr("name");
        var tempteacherID = temp.split(":");
        var teacherID;
        teacherID = tempteacherID[1]
        $.ajax({
            url: "JSONschools.asp",
            dataType: "json",
            data: { term: request.term, teacherID: teacherID },
            success: function (data) {
                response(data);
            }
        });
    },
    focus: function (event, ui) {
        //if the value of the textbox does not match a suggestion, clear its value
        if (!ui.item) {
            $(this).val('');
            $(this).parent("li").next().html("Please select only from the list shown").effect("pulsate", { times: 3 }, "slow");
        }
        else {
            $(this).next().val(ui.item.id);
        }
    },
    select: function (event, ui) {
        //if the value of the textbox does not match a suggestion, clear its value
        if (!ui.item) {
            $(this).val('');
            $(this).parent("li").next().html("Please select only from the list shown").effect("pulsate", { times: 3 }, "slow");
        }
        else {
            $(this).next().val(ui.item.id);
        }
    },
    change: function (event, ui) {
        //if the value of the textbox does not match a suggestion, clear its value
        if (!ui.item) {
            $(this).val('');
            $(this).parent("li").next().html("Please select only from the list shown").effect("pulsate", { times: 3 }, "slow");
        }
        else {
            $(this).next().val(ui.item.id);
        }
    },
    minLength: 2
});

Answer 1

You can declare it once as named function, like this:

function CheckSuggestion(event, ui) {
  //if the value of the textbox does not match a suggestion, clear its value
  if (!ui.item) {
      $(this).val('');
      $(this).parent("li").next().html("Please select only from the list shown")
                          .effect("pulsate", { times: 3 }, "slow");
  }
  else {
      $(this).next().val(ui.item.id);
  }
}

Then reference that function instead of an anonymous one, like this:

$("input[name^='addSchool']").autocomplete({
    source: function (request, response) {
        var temp = $("input[name^='addSchool']").attr("name");
        var tempteacherID = temp.split(":");
        var teacherID;
        teacherID = tempteacherID[1]
        $.ajax({
            url: "JSONschools.asp",
            dataType: "json",
            data: { term: request.term, teacherID: teacherID },
            success: function (data) {
                response(data);
            }
        });
    },
    focus: CheckSuggestion,
    select: CheckSuggestion,
    change: CheckSuggestion,
    minLength: 2
});