Asked by:
Execute js function in another js file on click

Question
-
User1324715958 posted
I'm pretty newb to js. I need to execute a js function in another js file when a user clicks an item in my drop down list. Currently the user has to click an magnifying glass to start the search. They want to initiate the search after they clicked the auto complete item.
Here is the code for the magnifying glass:
<input class="button js-form-submit form-submit" id="edit-submit-aha-search" type="submit" value="Search">
Here is my auto complete :
$(document).ready(function () { var DataList = []; BuildDataList(); //$("input").on("keypress", function () $("#edit-search-api-fulltext").on("keypress", function () { populate(); }); $("select").on("change", function () { DataList = []; BuildDataList(); populate(); }); function populate() { $("#edit-search-api-fulltext").autocomplete({ source: DataList }); } function BuildDataList() { $.ajax({ type: "GET", async: false, url: "/eweb/include/xmlautocomplete.xml", cache: false, dataType: "xml", success: function (xml) { var Category = $('#filter :selected').text(); Category = "All";//MAH 2/26/2019 ER-83 switch (Category) { case "All": Category = "Planning and Strategy"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Leadership and Governance"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Marketing and Communications"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Workforce"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Coding and Billing"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Nursing Leadership"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Health Information Technology"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Environmental Services"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Materials Management"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Human Resources"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Facilities Management"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Data Products"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Health Forum eSource"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Risk Management"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Volunteers and Auxilians"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); Category = "Design and Construction"; $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Design and Construction": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Environmental Services": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Coding and Billing": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Data Products": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Facilities Management": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Health Forum eSource": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Health Information Technology": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Human Resources": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Leadership and Governance": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Learning Product": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Marketing and Communications": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Materials Management": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Nursing Leadership": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Planning and Strategy": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Risk Management": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Volunteers and Auxilians": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Workforce": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; //Added 8/28/2018 MAH case "Social Work": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Patient Safety Quality and Advocacy": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; case "Membership": $(xml).find('PRODUCT[Category="' + Category + '"]').each(function () { $(this).find("prd_name").each(function () { var name = $(this).text(); DataList.push(name); }); }); break; default: //alert("No Products Available Currently!");//MAH 2/26/2019 ER-83 break; } } }); } });
Tuesday, March 19, 2019 7:12 PM
All replies
-
User1724605321 posted
Hi UOKSoftware ,
I need to execute a js function in another js file when a user clicks an item in my drop down list. Currently the user has to click an magnifying glass to start the search. They want to initiate the search after they clicked the auto complete item.The search button submits all form values to server side , You can use ajax to call server side function after javascript auto complete function . Could you explain more about your problem if i misunderstand your issue .
Best Regards,
Nan Yu
Wednesday, March 20, 2019 2:48 AM -
User-2054057000 posted
What you are trying to achieve is to initiate the search after they clicked the auto complete item.
Here you have to create the click event of the autocomplete item and in that click event you call the search code.
This is one solution to do it.
a. You create a select html control where you display the autocomplete items.
<div id="myDiv">
<select id="autoComplete" size="5"> <option value="item1">Item 1</option> <option value="item2">Item 2</option> <option value="item3">Item 3</option> <option value="item4">Item 4</option> <option value="item5">Item 5</option> </select>
</div>b. You next create the click event for every autocomplete item using jQuery on method:
$("#myDiv").on("change", "#autoComplete", function () { //.. do your search now
});Inside this event you perform the search.
Look this tutorial on jQuery Autocomplete where the same thing has been done to get the desired results which you need.
Thursday, March 21, 2019 10:51 AM