diff --git a/web-ui/src/main/resources/catalog/components/edit/onlinesrc/OnlineSrcDirective.js b/web-ui/src/main/resources/catalog/components/edit/onlinesrc/OnlineSrcDirective.js
index 976fb71f4ac..dbee09baf5a 100644
--- a/web-ui/src/main/resources/catalog/components/edit/onlinesrc/OnlineSrcDirective.js
+++ b/web-ui/src/main/resources/catalog/components/edit/onlinesrc/OnlineSrcDirective.js
@@ -2502,88 +2502,145 @@
 
             scope.$on("resetSearch", scope.clearSearch);
 
-            var searchDatacite = function () {
-              var searchQuery =
-                scope.queryValue !== ""
-                  ? scope.doiQueryPattern.replaceAll("{query}", scope.queryValue)
-                  : "";
-              scope.isSearching = true;
-              gnDoiSearchService.search(scope.doiUrl, scope.doiPrefix, searchQuery).then(
-                function (response) {
-                  scope.isSearching = false;
-                  var results = [];
-
-                  angular.forEach(response.data.data, function (r) {
-                    results.push({
-                      uuid: r.id,
-                      remoteUrl: r.attributes.url,
-                      resourceTitle:
-                        r.attributes.titles.length > 0
-                          ? r.attributes.titles[0].title
-                          : r.url,
-                      title:
-                        r.attributes.titles.length > 0
-                          ? r.attributes.titles[0].title
-                          : r.url,
-                      description:
-                        r.attributes.descriptions.length > 0
-                          ? r.attributes.descriptions[0].descriptions
-                          : ""
-                    });
-                  });
+            var processResultsDatacite = function (resultsDatacite) {
+              var results = [];
+
+              angular.forEach(resultsDatacite, function (r) {
+                results.push({
+                  uuid: r.id,
+                  remoteUrl: r.attributes.url,
+                  resourceTitle:
+                    r.attributes.titles.length > 0 ? r.attributes.titles[0].title : r.url,
+                  title:
+                    r.attributes.titles.length > 0 ? r.attributes.titles[0].title : r.url,
+                  description:
+                    r.attributes.descriptions.length > 0
+                      ? r.attributes.descriptions[0].descriptions
+                      : ""
+                });
+              });
 
-                  scope.results = results;
-                },
-                function (response) {
-                  scope.isSearching = false;
+              return results;
+            };
+
+            var processResultsCrossref = function (resultsCrossref) {
+              var results = [];
+
+              angular.forEach(resultsCrossref, function (r) {
+                results.push({
+                  uuid: r.DOI,
+                  remoteUrl: r.URL,
+                  resourceTitle: r.title && r.title.length > 0 ? r.title[0] : "",
+                  title: r.title && r.title.length > 0 ? r.title[0] : "",
+                  description: r.abstract && r.abstract.length > 0 ? r.abstract[0] : ""
+                });
+              });
+
+              return results;
+            };
+
+            var sortResults = function () {
+              scope.results.sort(function (a, b) {
+                if (a.resourceTitle < b.resourceTitle) {
+                  return -1;
                 }
-              );
+                if (a.resourceTitle > b.resourceTitle) {
+                  return 1;
+                }
+                return 0;
+              });
+            };
+            var dataciteQuery = function () {
+              return scope.queryValue !== ""
+                ? scope.doiQueryPattern.replaceAll("{query}", scope.queryValue)
+                : "";
             };
 
-            var searchCrossref = function () {
-              var searchQuery =
-                scope.crossrefQueryValue !== ""
-                  ? scope.doiCrossrefQueryPattern
-                      .replaceAll("{query}", scope.queryValue)
-                      .replaceAll("{prefix}", scope.doiPrefix)
-                  : "";
-              scope.isSearchingCrossref = true;
-              gnDoiSearchService
-                .searchCrossref(scope.doiCrossrefUrl, scope.doiPrefix, searchQuery)
-                .then(
-                  function (response) {
-                    scope.isSearchingCrossref = false;
-                    var results = [];
-
-                    angular.forEach(response.data.message.items, function (r) {
-                      results.push({
-                        uuid: r.DOI,
-                        remoteUrl: r.URL,
-                        resourceTitle: r.title && r.title.length > 0 ? r.title[0] : "",
-                        title: r.title && r.title.length > 0 ? r.title[0] : "",
-                        description:
-                          r.abstract && r.abstract.length > 0 ? r.abstract[0] : ""
-                      });
-                    });
+            var crossrefQuery = function () {
+              return scope.crossrefQueryValue !== ""
+                ? scope.doiCrossrefQueryPattern
+                    .replaceAll("{query}", scope.queryValue)
+                    .replaceAll("{prefix}", scope.doiPrefix)
+                : "";
+            };
 
-                    scope.resultsCrossref = results;
-                  },
-                  function (response) {
-                    scope.isSearchingCrossref = false;
-                  }
-                );
+            var internalSearch = function (doDataciteSearch, doCrossrefSearch) {
+              scope.isSearching = true;
+              var results = [];
+
+              if (doDataciteSearch && doCrossrefSearch) {
+                // Search Datacite
+                gnDoiSearchService
+                  .search(scope.doiUrl, scope.doiPrefix, dataciteQuery())
+                  .then(
+                    function (response) {
+                      results = processResultsDatacite(response.data.data);
+
+                      // Search Crossref
+                      gnDoiSearchService
+                        .searchCrossref(
+                          scope.doiCrossrefUrl,
+                          scope.doiPrefix,
+                          crossrefQuery()
+                        )
+                        .then(
+                          function (response) {
+                            scope.isSearching = false;
+
+                            results = results.concat(
+                              processResultsCrossref(response.data.message.items)
+                            );
+
+                            scope.results = results;
+                            sortResults();
+                          },
+                          function (response) {
+                            scope.isSearching = false;
+                          }
+                        );
+                    },
+                    function (response) {
+                      scope.isSearching = false;
+                    }
+                  );
+              } else if (doDataciteSearch) {
+                gnDoiSearchService
+                  .search(scope.doiUrl, scope.doiPrefix, dataciteQuery())
+                  .then(
+                    function (response) {
+                      scope.isSearching = false;
+                      scope.results = processResultsDatacite(response.data.data);
+                      sortResults();
+                    },
+                    function (response) {
+                      scope.isSearching = false;
+                    }
+                  );
+              } else if (doCrossrefSearch) {
+                gnDoiSearchService
+                  .searchCrossref(scope.doiCrossrefUrl, scope.doiPrefix, crossrefQuery())
+                  .then(
+                    function (response) {
+                      scope.isSearching = false;
+                      scope.results = processResultsCrossref(response.data.message.items);
+                      sortResults();
+                    },
+                    function (response) {
+                      scope.isSearching = false;
+                    }
+                  );
+              } else {
+                scope.isSearching = false;
+              }
             };
 
             scope.search = function () {
               scope.searchedValue = true;
 
-              if (scope.doiUrl) {
-                searchDatacite();
-              }
+              var doDataciteSearch = scope.doiUrl !== "";
+              var doCrossrefSearch = scope.doiCrossrefUrl !== "";
 
-              if (scope.doiCrossrefUrl) {
-                searchCrossref();
-              }
+              internalSearch(doDataciteSearch, doCrossrefSearch);
             };
           }
         };
diff --git a/web-ui/src/main/resources/catalog/components/edit/onlinesrc/partials/doisearchpanel.html b/web-ui/src/main/resources/catalog/components/edit/onlinesrc/partials/doisearchpanel.html
index 5500b940223..2277e59d9a4 100644
--- a/web-ui/src/main/resources/catalog/components/edit/onlinesrc/partials/doisearchpanel.html
+++ b/web-ui/src/main/resources/catalog/components/edit/onlinesrc/partials/doisearchpanel.html
@@ -29,25 +29,15 @@
         </span>
       </div>
 
-      <i
-        data-ng-show="isSearching || isSearchingCrossref"
-        class="fa fa-spinner fa-spin gn-margin-top-sm"
-      ></i>
-      <!--<p
+      <i data-ng-show="isSearching" class="fa fa-spinner fa-spin gn-margin-top-sm"></i>
+      <p
         class="gn-margin-top-sm"
-        data-ng-show="(doiUrl && !isSearching && results.length == 0 && !doiCrossrefUrl) || (doiCrossrefUrl && !isSearchingCrossref && resultsCrossref.length == 0)"
+        data-ng-show="(searchedValue && !isSearching && results.length == 0 )"
       >
         {{ 'zarooResult' | translate }}
-      </p>-->
-
-      <!-- Datacite results -->
-      <div data-ng-if="doiUrl && searchedValue && !isSearching">
-        <h4 data-ng-show="doiUrl && doiCrossrefUrl">Datacite results</h4>
-
-        <p class="gn-margin-top-sm" data-ng-show="results.length == 0">
-          {{ 'zarooResult' | translate }}
-        </p>
+      </p>
 
+      <div>
         <ul class="list-group gn-nopadding-left gn-nopadding-right">
           <li
             data-ng-repeat="md in results"
@@ -72,39 +62,6 @@ <h4 data-ng-show="doiUrl && doiCrossrefUrl">Datacite results</h4>
           </li>
         </ul>
       </div>
-
-      <!-- Crossref results -->
-      <div data-ng-if="doiCrossrefUrl && searchedValue && !isSearchingCrossref">
-        <h4 data-ng-show="doiUrl && doiCrossrefUrl">Crossref results</h4>
-
-        <p class="gn-margin-top-sm" data-ng-show="resultsCrossref.length == 0">
-          {{ 'zarooResult' | translate }}
-        </p>
-
-        <ul class="list-group gn-nopadding-left gn-nopadding-right">
-          <li
-            data-ng-repeat="md in resultsCrossref"
-            class="list-group-item"
-            data-ng-class="(mode == 'select' && isSelected(md)) ? 'active' : ''"
-          >
-            <div class="d-inline pull-right gn-margin-left-sm">
-              <a target="_blank" href="{{md.remoteUrl}}" rel="noopener noreferrer">
-                <span class="fa fa-eye"></span
-              ></a>
-            </div>
-            <div
-              class="d-inline"
-              style="cursor: pointer"
-              data-ng-click="updateSelection(md, associationType, initiativeType)"
-            >
-              {{md.resourceTitle}}
-              <div data-ng-if="mode == 'add'" class="pull-right">
-                <span class="fa fa-plus"></span>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
     </div>
   </div>
 </div>