Перенаправление на div с данными post

Question

Я ищу таблицу для определенных значений на основе пользовательского ввода, который запрашивает базу данных для условия LIKE. Это работает отлично, но мне нужно вручную прокрутить страницу до страницы, чтобы увидеть мою фильтрованную таблицу. Я действительно хочу перенаправить пользователя в div таблицы под страницей. Это форма с окном поиска:

<form method="post"> 
    <div class="col-lg-6 pull-right" style="margin-right:130px; width:30%;"> 
     <div class="input-group"> 
      <input required type="text" class="form-control" name="search" placeholder="Search Alerts for Today..."> 
      <span class="input-group-btn"> 
       <button class="btn btn-default" name="searchnow" type="submit" value="Submit">Go!</button> 
      </span> 
     </div> 
    </div> 
</form> 

Этот код ниже, а затем проверяет, если кнопка нажата, а затем устанавливает переменную, которая заполняет таблицу равно текущий результат поиска из базы данных.

var searchIP = ""; 
    if (Request.Form["searchnow"] != null & IsPost) 
    { 
     searchIP = Request.Form["search"]; 
     alertForTheDay = dbConnection.searchDashboardTable(searchIP); 
     // Response.Redirect("Dashboard.cshtml#search"); 
    } 

Использование Response.Redirect обновляет таблицу до ее исходного состояния. Комментируя перенаправление ответа, как показано выше, фильтр позволяет, но мне приходится вручную прокручивать страницу вниз. Я хочу, чтобы это перенаправлялось на id div в этом перенаправлении. Пожалуйста, что я могу сделать?

Answer 1

Я думаю, вы делаете полный сервер в оба конца. С моей точки зрения это не нужно. Я бы предложил сделать это через AJAX.

1. Изменение HTML, как это назвать операцию AJAX на кнопке мыши:

   <form method="post"> 
       <div class="col-lg-6 pull-right" style="margin-right:130px; width:30%;"> 
        <div class="input-group"> 
         <input required type="text" class="form-control" name="search" id="search" placeholder="Search Alerts for Today..."> 
         <span class="input-group-btn"> 
          <button class="btn btn-default" name="searchnow" id="theButton">Go!</button> 
         </span> 
        </div> 
       </div> 
   </form> 
   

2. Handle кнопку мыши и ссылку на якорь на успех. (Если предположить, что якорь к столу присутствует. В вашем случае что-то вроде Dashboard.cshtml#contact)

   $.fn.gotoAnchor = function(anchor) { 
       location.href = this.selector; 
   } 
   
   $(document).ready(function() { 
       // Add the page method call as an onclick handler for the div. 
       $("#theButton").click(function() { 
        $.ajax({ 
         type: "POST", 
         url: "<YOUR URL>", 
         data: { search: $('#search').val() }, 
         contentType: "application/json; charset=utf-8", 
         dataType: "json", 
         success: function(msg) { 
          // If everything is successful link to your anchor tag 
          $('#search').gotoAnchor(); 
         } 
        }); 
       }); 
   });