input text search template - refs #2681

main/auth/courses_categories.php

@@ -78,11 +78,10 @@ $message = null;
 
         $term = empty($_POST['search_term']) ? '': api_htmlentities($searchTerm);
         $urlAction = CourseCategory::getCourseCategoryUrl(1, $pageLength, 'ALL', 0, 'subscribe');
-        $formSearch = new FormValidator('search_catalog', 'post', $urlAction, null, [], 'inline');
+        $formSearch = new FormValidator('search_catalog', 'post', $urlAction, null, [], 'box-search');
         $formSearch->addHidden('sec_token', $stok);
         $formSearch->addHidden('search_course', 1);
-        $formSearch->addText('search_term', get_lang('Search'), false,['value'=>$term]);
-        $formSearch->addButtonSearch(get_lang('Search'), 'submit');
+        $formSearch->addText('search_term', get_lang('Search'), false,['value'=>$term, 'icon' => 'search'])->setButton(true);
         //$formSearch->defaultRenderer()->setElementTemplate($formSearch->getDefaultElementTemplate(),'search_term');
         $search = $formSearch->returnForm();
 
@@ -92,6 +91,7 @@ $message = null;
         $formSelect->addHidden('pageCurrent',$pageCurrent);
         $formSelect->addHidden('pageLength', $pageLength);
         $options = [];
+
         foreach ($browse_course_categories[0] as $category){
 
             $categoryCode = $category['code'];

main/inc/lib/formvalidator/FormValidator.class.php

@@ -11,6 +11,7 @@ class FormValidator extends HTML_QuickForm
     public const LAYOUT_INLINE = 'inline';
     public const LAYOUT_BOX = 'box';
     public const LAYOUT_BOX_NO_LABEL = 'box-no-label';
+    public const LAYOUT_BOX_SEARCH = 'box-search';
 
     public $with_progress_bar = false;
     private $layout;

main/inc/lib/pear/HTML/QuickForm/element.php

@@ -38,6 +38,7 @@ class HTML_QuickForm_element extends HTML_Common
     private $layout;
     private $icon;
     private $template;
+    private $button;
     private $customFrozenTemplate = '';
 
     /**
@@ -109,6 +110,23 @@ class HTML_QuickForm_element extends HTML_Common
         }
     }
 
+    /**
+     * @return boolean
+     */
+    public function getButton()
+    {
+        return $this->button;
+    }
+
+    /**
+     * @param boolean $button
+     */
+    public function setButton($button): void
+    {
+        $this->button = $button;
+    }
+
+
      /**
      * @return null
      */

main/inc/lib/pear/HTML/QuickForm/text.php

@@ -84,13 +84,21 @@ class HTML_QuickForm_text extends HTML_QuickForm_input
     public function getIconToHtml()
     {
         $icon = $this->getIcon();
+        $isButton = $this->getButton();
 
         if (empty($icon)) {
             return '';
         }
+        $element = '<span class="input-group-text"><em class="fa fa-' . $icon . '"></em></span>';
 
-        return '<div class="input-group-addon">
-                <em class="fa fa-'.$icon.'"></em>
+        if ($isButton) {
+            $element = '<button class="btn btn-outline-secondary" type="submit">
+                            <em class="fa fa-' . $icon . '"></em>
+                        </button>';
+        }
+
+        return '<div class="input-group-append">
+                    ' . $element . '
                 </div>';
     }
 
@@ -164,12 +172,24 @@ class HTML_QuickForm_text extends HTML_QuickForm_input
             case FormValidator::LAYOUT_BOX_NO_LABEL:
                 return '
                         <label {label-for}>{label}</label>
-                        <div class="input-group">
-                            
+                        <div class="input-group mb-3">
                             {icon}
                             {element}
                         </div>';
                 break;
+            case FormValidator::LAYOUT_BOX_SEARCH:
+                return '
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label" {label-for}>{label}</label>
+                            <div class="col-sm-8">
+                                <div class="input-group mb-3">
+                                    {element}
+                                    {icon}
+                                </div>
+                            </div>
+                            <div class="col-sm-2"></div>
+                        </div>';
+                break;
         }
     }