diff --git a/typo3/sysext/tstemplate/Classes/Controller/TypoScriptTemplateObjectBrowserModuleFunctionController.php b/typo3/sysext/tstemplate/Classes/Controller/TypoScriptTemplateObjectBrowserModuleFunctionController.php
index a6d460c37804e0e14a51b3bc852361285b6e1aed..abf59d840c02155bde403694ce6b0744e7f025a9 100644
--- a/typo3/sysext/tstemplate/Classes/Controller/TypoScriptTemplateObjectBrowserModuleFunctionController.php
+++ b/typo3/sysext/tstemplate/Classes/Controller/TypoScriptTemplateObjectBrowserModuleFunctionController.php
@@ -403,24 +403,27 @@ class TypoScriptTemplateObjectBrowserModuleFunctionController extends AbstractFu
 			$theOutput .= '
 				<div class="tsob-menu">
 					<div class="form-inline">';
-			if(is_array($this->pObj->MOD_MENU['ts_browser_type']) && count($this->pObj->MOD_MENU['ts_browser_type']) > 1){
+			if (is_array($this->pObj->MOD_MENU['ts_browser_type']) && count($this->pObj->MOD_MENU['ts_browser_type']) > 1) {
 				$theOutput .= '
 						<div class="form-group">
 							<label class="control-label">' . $lang->getLL('browse') . '</label>'
 							. BackendUtility::getDropdownMenu($this->pObj->id, 'SET[ts_browser_type]', $bType, $this->pObj->MOD_MENU['ts_browser_type']). '
 						</div>';
 			}
-			if(is_array($this->pObj->MOD_MENU['ts_browser_toplevel_' . $bType]) && count($this->pObj->MOD_MENU['ts_browser_toplevel_' . $bType]) > 1){
+			if (is_array($this->pObj->MOD_MENU['ts_browser_toplevel_' . $bType]) && count($this->pObj->MOD_MENU['ts_browser_toplevel_' . $bType]) > 1) {
 				$theOutput .= '
 						<div class="form-group">
 							<label class="control-label" for="ts_browser_toplevel_' . $bType . '">' . $lang->getLL('objectList') . '</label> '
 							. BackendUtility::getDropdownMenu($this->pObj->id, 'SET[ts_browser_toplevel_' . $bType . ']', $this->pObj->MOD_SETTINGS['ts_browser_toplevel_' . $bType], $this->pObj->MOD_MENU['ts_browser_toplevel_' . $bType]) . '
 						</div>';
 			}
+
+			$this->getPageRenderer()->loadRequireJsModule('TYPO3/CMS/Tstemplate/TypoScriptObjectBrowser');
+
 			$theOutput .= '
 						<div class="form-group">
 							<label class="control-label" for="search_field">' . $lang->getLL('search') . '</label>
-							<input class="form-control" type="search" name="search_field" id="search_field" value="' . htmlspecialchars($POST['search_field']) . '"' . $documentTemplate->formWidth(20) . '/>
+							<div class="form-group"><input class="form-control" type="search" name="search_field" id="search_field" value="' . htmlspecialchars($POST['search_field']) . '" /></div>
 						</div>
 						<input class="btn btn-default tsob-search-submit" type="submit" name="search" value="' . $lang->sL('LLL:EXT:lang/locallang_common.xlf:search') . '" />
 					</div>
diff --git a/typo3/sysext/tstemplate/Resources/Public/JavaScript/TypoScriptObjectBrowser.js b/typo3/sysext/tstemplate/Resources/Public/JavaScript/TypoScriptObjectBrowser.js
new file mode 100644
index 0000000000000000000000000000000000000000..497b1591ad52b90c7ce17b94cadd17c8126b06ea
--- /dev/null
+++ b/typo3/sysext/tstemplate/Resources/Public/JavaScript/TypoScriptObjectBrowser.js
@@ -0,0 +1,31 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+/**
+ * JavaScript for TypoScript Object Browser
+ */
+define('TYPO3/CMS/Tstemplate/TypoScriptObjectBrowser', ['jquery', 'TYPO3/CMS/Backend/jquery.clearable'], function($) {
+
+	var $searchFields = $('input[name="search_field"]');
+	var searchResultShown = ('' !== $searchFields.first().val());
+
+	// make search field clearable
+	$searchFields.clearable({
+		onClear: function() {
+			if (searchResultShown) {
+				$(this).closest('form').submit();
+			}
+		}
+	});
+
+});
\ No newline at end of file