2017-01-11 5 views
0
<script> 
$(function() { 

    var ajaxSubmit = function() { 
     var $form = $(this); 
     var settings = { 
      data: $(this).serialize(), 
      url: $(this).attr("action"), 
      type: $(this).attr("method") 
     }; 
     $.ajax(settings).done(function (result) { 
      var $targetElement = $($form.data("ajax-target")); 
      var $newContent = $(result); 
      $($targetElement).replaceWith($newContent); 
      $newContent.effect("slide"); 

     }); 
     return false; 
    }; 

    $("#search-form").submit(ajaxSubmit); 
}); 
</script> 

Ok、このスクリプトはdatabseからいくつかのコンテンツを検索します。それは素晴らしいですが、一度しか動作しません。私のfromからもう一度submitをしようとすると、再び働かない。私はページを更新するときだけ。 誰かが私を助けることができますか?同じindex.cshtmlファイル内からMVC 5、Ajax、Jqueryスクリプトは一度だけ動作します

マイ:

<div> 
<form id="search-form" method="get" data-ajax="true" data-ajax-target="#zawartosc" data-ajax-update="#zawartosc"> 
    <input id="search-filter" type="search" name="searchQuery" 
      data-autocomplete-source="@Url.Action("MiejscaPodpowiedzi", "Miejsce")" 
      placeholder="Wprowadź tekst, aby filtrować..." /> 
    <input type="submit" id="send" value="Send" /> 
</form> 


<div id="zawartosc"> 
    @Html.Partial("_ListaMiejsc") 
</div> 

マイコントローラ:

public class HomeController : Controller 
{ 
    private DaneKontekst db = new DaneKontekst(); 

    public ActionResult Index(string searchQuery = null) 
    { 
     var miejscaNaSwiecie = db.MiejscaNaSwiecie.Where(o => (searchQuery == null || 
     o.NazwaMiejscaNaSwiecie.ToLower().Contains(searchQuery.ToLower()) || 
     o.KrajMiejscaNaSwiecie.ToLower().Contains(searchQuery.ToLower()) || 
     o.OpisMiejscaNaSwiecie.ToLower().Contains(searchQuery.ToLower()))).ToList(); 

     var ViewModel = new HomeIndexViewModel() 
     { 
      MiejscaNaSwiecie = miejscaNaSwiecie 
     }; 

     if (Request.IsAjaxRequest()) 
     { 
      return PartialView("_ListaMiejsc", ViewModel); 
     } 

     return View(ViewModel); 
    } 

編集。

答えて

0

コンテナを交換するためです。その内容だけを更新する必要があります。

初めてクリックすると、ajax呼び出しの応答(フォームのマークアップ)がdiv(id = "zawartosc")に置き換わります。だからこの後、あなたのDOMにそのdivが存在しなくなります。だからあなたの$targetElementはコンテナdivになりません(消えてしまったので)

コンテナdivを置き換えるのではなく、その内容を更新するだけです。

$($targetElement).replaceWith($newContent); 

$($targetElement).html($newContent); 
+1

Shyju - ありがとうございました。それは今pefectで動作します。 Iveはそれを理解するのに多くの時間を費やしましたが、結果はありませんでした。 – Piosek

+0

@Piosekようこそ。お役に立てて嬉しいです。 – Shyju

0

$($ targetElement).htmlを($ newContent)を交換してください。

OR

$($ targetElement).LOAD($ newContent)。

関連する問題