Обновление таблицы Thymeleaf без перезагрузки страницы

Question

Я рендеринг данных с атрибутом тимьяна.Но я сейчас реализую кнопку «Поиск» и хочу сделать это без перезагрузки.

У меня есть атрибут depatments, который отображает List<Department> из базы данных. Я знаю, как это сделать с помощью ajax , но тогда мне нужно заменить атрибут RestController, который даст мне JSON.Возможно ли получить данные из атрибута без перезагрузки страницы?Ajax, или JS, или что-то еще?Спасибо

Answer 1

Да, вы можете достичь этого с помощью фрагмента и AJAX.В вашем контроллере

@GetMapping("/url")
public ModelAndView getResultBySearchKey()
    {
        List<depatments> areaList= new ArrayList<>();//results from db
        ModelAndView mv= new ModelAndView("search::search_list"); 
        mv.addObject("searchList",areaList);

        return mv;
    }

и в вашем search.html добавьте следующий код.И не забудьте использовать встроенный JavaScript.

function loadSearchResult()
    		{
    			
    		 $.ajax({
    			  type: 'get',
    			  url: /*[[ @{'/url'} ]]*/,
    			
    			  success: function(data){
    				
    				  /*<![CDATA[*/
    				  
    				  
    				  $('.search_list').html(data);
    				  
    				  
    				  /*]]>*/
    				},
    			  
    			})
    			
    		}

<button class="btn btn-primary btn-sm"
th:onclick="'loadSearchResult();'">Search</button>
    <div class="row">


      <div class="col-md-12 search_list">
       <div class="table-responsive" th:fragment="search_list">
         <table
         class="table  table-bordered ">
           <thead>
             <tr>
               <th>SL No.</th>
               <th>Actions</th>
               <th>Name</th>
             </tr>
           </thead>
        <tbody>
    <!-- your desired rows-->
        </tbody>