{"record":{"id":"7d1f775c7dc51071","repo":"Semantic-Org/Semantic-UI","slug":"there-was-an-error-contacting-the-server","errorCode":null,"errorMessage":"There was an error contacting the server","messagePattern":"There was an error contacting the server","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/definitions/modules/dropdown.js","lineNumber":3789,"sourceCode":"  onRemove      : function(value, text, $selected){},\n\n  onLabelSelect : function($selectedLabels){},\n  onLabelCreate : function(value, text) { return $(this); },\n  onLabelRemove : function(value) { return true; },\n  onNoResults   : function(searchTerm) { return true; },\n  onShow        : function(){},\n  onHide        : function(){},\n\n  /* 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","sourceCodeStart":3771,"sourceCodeEnd":3807,"githubUrl":"https://github.com/Semantic-Org/Semantic-UI/blob/597843ab84d565cccfd8fd7719416350ae73e734/src/definitions/modules/dropdown.js#L3771-L3807","documentation":"Unlike the other entries this is a UI message shown inside the dropdown menu to the end user, not a console error. It fires from the API module's onError/onFailure callbacks inside queryRemote() when a dropdown configured with apiSettings gets an error or failure response from the server.","triggerScenarios":"$('.ui.dropdown').dropdown({apiSettings:{url:'/search?q={query}'}}) when /search returns HTTP 4xx/5xx, times out, or the network drops; the message 'There was an error contacting the server' appears in the open menu.","commonSituations":"Backend endpoint down or route changed; CORS blocking the cross-origin response; apiSettings.url template with a wrong {query} placeholder; slow backend exceeding the API module throttle/timeout.","solutions":["Open DevTools Network and inspect the failed request (status, body, CORS headers)","Fix the endpoint or the apiSettings.url template so {query} matches the server contract","Add CORS headers server-side or proxy cross-origin requests","Override message.serverError or handle apiSettings.onError/onFailure to show a friendlier message or retry"],"exampleFix":"// before\n$('.ui.dropdown').dropdown({ apiSettings: { url: '/api/missing?q={query}' } });\n// after\n$('.ui.dropdown').dropdown({\n  apiSettings: {\n    url: '/api/search?q={query}',\n    onError: function() { /* show retry UI */ }\n  },\n  message: { serverError: 'Search is unavailable. Try again.' }\n});","handlingStrategy":"fallback","validationCode":null,"typeGuard":null,"tryCatchPattern":"// Handle remote failures at the apiSettings boundary rather than letting the\n// default serverError message confuse users.\n$('.ui.dropdown').dropdown({\n  apiSettings: {\n    url: '/api/search?q={query}',\n    onError: function () {\n      // show cached results or a retry control instead of the raw message\n      showCachedResults();\n    },\n    onFailure: function (resp) {\n      if (window.navigator.onLine) {\n        scheduleRetry();\n      } else {\n        showOfflineNotice();\n      }\n    }\n  }\n});","preventionTips":["Always provide apiSettings.onError/onFailure handlers so the default serverError message is replaced with a recoverable UI","Verify the apiSettings.url template placeholder matches your server contract before deploy","Ensure CORS is configured server-side for cross-origin dropdown endpoints","Set a sensible apiSettings.throttle/timeout so transient slowness does not surface as a hard failure"],"tags":["dropdown","semantic-ui","network","remote-data","user-facing"],"backgroundTag":null,"analyzedSha":"597843ab84d565cccfd8fd7719416350ae73e734","analyzedAt":"2026-08-13T01:44:23.827Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}