{"record":{"id":"718c7236409a7d07","repo":"Semantic-Org/Semantic-UI","slug":"the-api-module-is-required-to-load-resources-remot","errorCode":null,"errorMessage":"The API module is required to load resources remotely","messagePattern":"The API module is required to load resources remotely","errorType":"console","errorClass":null,"httpStatus":null,"severity":"error","filePath":"src/definitions/modules/dropdown.js","lineNumber":3798,"sourceCode":"  /* Component */\n  name           : 'Dropdown',\n  namespace      : 'dropdown',\n\n  message: {\n    addResult     : 'Add <b>{term}</b>',\n    count         : '{count} selected',\n    maxSelections : 'Max {maxCount} selections',\n    noResults     : 'No results found.',\n    serverError   : 'There was an error contacting the server'\n  },\n\n  error : {\n    action          : 'You called a dropdown action that was not defined',\n    alreadySetup    : 'Once a select has been initialized behaviors must be called on the created ui dropdown',\n    labels          : 'Allowing user additions currently requires the use of labels.',\n    missingMultiple : '<select> requires multiple property to be set to correctly preserve multiple values',\n    method          : 'The method you called is not defined.',\n    noAPI           : 'The API module is required to load resources remotely',\n    noStorage       : 'Saving remote data requires session storage',\n    noTransition    : 'This module requires ui transitions <https://github.com/Semantic-Org/UI-Transition>'\n  },\n\n  regExp : {\n    escape   : /[-[\\]{}()*+?.,\\\\^$|#\\s]/g,\n    quote    : /\"/g\n  },\n\n  metadata : {\n    defaultText     : 'defaultText',\n    defaultValue    : 'defaultValue',\n    placeholderText : 'placeholder',\n    text            : 'text',\n    value           : 'value'\n  },\n\n  // property names for remote query","sourceCodeStart":3780,"sourceCodeEnd":3816,"githubUrl":"https://github.com/Semantic-Org/Semantic-UI/blob/597843ab84d565cccfd8fd7719416350ae73e734/src/definitions/modules/dropdown.js#L3780-L3816","documentation":"When apiSettings is configured, the remote query path requires the separate Semantic UI API module ($.fn.api). can.useAPI() returns $.fn.api !== undefined; if the API JS is not loaded, module.error(error.noAPI) fires and remote loading is skipped, so the dropdown never fetches results.","triggerScenarios":"Including { apiSettings: { url: '/search?q={query}' } } but loading only dropdown.js — semantic-ui-api.js (the api component) is absent.","commonSituations":"A trimmed/custom build of Semantic UI that omits api.js; wrong script load order; using dropdown.min without api.min.","solutions":["Include the API module before/with dropdown: add semantic-ui-api.js (the 'api' component)","If you don't need remote data, remove the apiSettings option entirely"],"exampleFix":"<!-- before -->\n<script src=\"dropdown.js\"></script>\n<!-- after -->\n<script src=\"api.js\"></script>\n<script src=\"dropdown.js\"></script>","handlingStrategy":"validation","validationCode":"// If you want remote data, make sure the API module is present first.\nfunction canUseRemoteDropdown() {\n  return typeof $.fn.api === 'function';\n}\nif (canUseRemoteDropdown()) {\n  $('.ui.dropdown').dropdown({ apiSettings: { url: '/search?q={query}' } });\n} else {\n  console.error('Load semantic-ui-api.js before enabling dropdown apiSettings');\n}","typeGuard":"function hasApiModule() {\n  return typeof $.fn !== 'undefined' && typeof $.fn.api === 'function';\n}","tryCatchPattern":null,"preventionTips":["Include semantic-ui-api.js whenever apiSettings is used","Use a build manifest / bundler entry that lists api as a dependency of dropdown","Feature-detect $.fn.api before enabling remote dropdowns in environments you don't control"],"tags":["dropdown","semantic-ui","api-module","remote-data","dependency"],"backgroundTag":null,"analyzedSha":"597843ab84d565cccfd8fd7719416350ae73e734","analyzedAt":"2026-08-13T01:44:23.827Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}