2017-07-31 3 views
0

私は検索機能として使用しているmySQLデータベースを持っています。ユーザがクエリを入力し、検索結果がロードされる。クエリの結果が返されたときにmysqlクエリコードを含むdivにページをロード

<div class="col-md-2" style="text-align:left; background-color: #c6bcb9;"> 
      @using (Html.BeginForm()) 
      { 
       @Html.AntiForgeryToken() 

       <fieldset style="border:0;"> 
        <div class="name-field"> 
         <div class="form-group"><br /> 
          <div style="color: gray; font-size: 18px;">@Html.LabelFor(model => model.name, "Search Project Assistant:", htmlAttributes: new { @class = "control-label" }) </div><br /> 
          @*<div class="col-md-10">*@ 
           @Html.TextBoxFor(model => model.name, new { @class = "form-control" }) 
           @Html.ValidationMessageFor(model => model.name, "", new { @class = "text-danger" }) 
          @*</div>*@ 
         </div> 
        </div> 
        <input type="submit" value="Search Tool"/> 
       </fieldset><br /> 
      } 
      @*Following the structure of cipt*@ 
      @if (ViewBag.PROJ != null) 
      { 
       <h4 style="color:black;">Search Results</h4> 
       foreach (var item in ViewBag.PROJ) 
       { 
        <a href="@item.url"> @item.name</a><br /> 
       } 

私のコントローラは次のようになります: 私のHTMLは次のようになります

 [HttpPost] 
     [ValidateAntiForgeryToken] 
     public ActionResult Training([Bind(Include = "name")] searchlinks searchlinks) 
     { 
      var q = from obj in db.searchlinks 
        where obj.name.Contains(searchlinks.name) 
        orderby obj.name 
        select new SearchResultsViewModel() 
        { name = obj.name, url = obj.url }; 
      ViewBag.PROJ = q; 

      return View(); 

ときに私の結果負荷、ページの最上部にページがロードされます。ページの位置を維持したい、またはリロードする必要がある場合は、検索ツールが含まれているdivに移動してください。(そのカラムはidの "projectassistant 「 は、私がどれ洞察力は非常に高く評価されるだろう。そうすることについて移動する方法がわからないと思います。ありがとう!!!

+1

あなたが何を望んでいるかわからないので、例を説明する写真が役立つかもしれません。しかし、あなたのようなサウンドは、部分ビューをリフレッシュするためにajaxを使うべきです。このように[** example **](https://www.youtube.com/watch?v=9JJXZfVrBUs&index=93&list=PL6n9fhu94yhVm6S8I2xd6nYz2ZORd7X2v) –

+0

私はあなたがajaxソリューションで正しいかもしれないと思います。ありがとうございました!コメントではなくソリューションとしてソリューションを投稿すれば、必要に応じて答えとしてマークすることができます。 –

答えて

1

部分ビューを作成すると、このポーティングを部分ビデオにコピーします。 w

@if (ViewBag.PROJ != null) 
     { 
      <h4 style="color:black;">Search Results</h4> 
      foreach (var item in ViewBag.PROJ) 
      { 
       <a href="@item.url"> @item.name</a><br /> 
      } 
     } 

In(部分表示をロードする必要がある)。

<div id="loadpartialview"></div> 

コントローラは部分表示を返す必要があります。

return PartialView(data); 

今これは役立つ

$("#SearchBtn").click(function() { 
     path = "/controller/Actionmethod"; 
     $.ajax({ 
     type: "GET", 
     url: path, 
     success: function (dataval) { 
      $('#loadpartialview').html(dataval); 
     } 
    }); 
} else { 
    alert("Field Empty"); 
} 
}); 

希望AJAXを書きます。

1

ちょうどここexampleがあるpartial viewを作成し、

asynchronic変更をロードするためにAjaxを使用しています。 MVCに関連する他のトピックがあります。再生リストを見るだけです。)

関連する問題