다음 Jquery Ajax Call이 한 번만 실행되는 이유는 무엇입니까?

난 내 ASP.NET MVC 프로젝트에 다음 스크립트가 있습니다다음 Jquery Ajax Call이 한 번만 실행되는 이유는 무엇입니까?

$(function() { 

var ajaxFormSubmit = function() { 
    var $form = $(this); 

    var options = { 
     url: $form.attr("action"), 
     type: $form.attr("method"), 
     data: $form.serialize() 
    }; 

    $.ajax(options).done(function (data) { 
     var $target = $($form.attr("data-otf-target")); 
     var $newHtml = $(data); 
     $target.replaceWith($newHtml); 
    }); 

    return false; 
}; 

$("form[data-otf-ajax='true']").submit(ajaxFormSubmit); 
});

왜이 fonction 한 번만 실행? 이 함수는 객체 목록을 업데이트하는 데 사용되며 다음은 면도기 뷰의 양식입니다.

<form method="get" action="@Url.Action("Index")" data-otf-ajax ="true" 
data-otf-target="#RestaurantList"> 
<input type="search" name="searchTerm" /> 
<input type="submit" value="Search By Name" /> 
</form> 

<div id="RestaurantList"> 
@Html.Partial("_Restaurants") 
</div>

출처

2017-12-27 Khalil Lazhar

javascript 코드를 'RestaurantList' div의 외부에 넣으십시오. 아마 아약스 호출로 덮어 쓰게 될 것입니다. – Hackerman

입력 형식'button'을 사용해 보시고 Jquery의'click (function)'을 사용하여 위의 함수를 실행하고 알려주십시오 .. –

자바 스크립트 코드는 별도의 파일로 jquery 스크립트 (@ Scripts.Render. .) –

함수는 한 번만 실행됩니다. 문제는 처리기가 처음 실행될 때 id가 RestaurantList 인 요소를 ajax 호출에서 반환 한 HTML 코드로 바꾸는 것입니다. 그래서

, 그것이 실행되는 다음 번에이 줄

var $target = $($form.attr("data-otf-target"));

문서의 ID RestaurantList에 어떤 요소가 더 이상 없기 때문에 (예상되는 동작이 없습니다.

에 한번 업데이트

$.ajax(options).done(function (data) { 
     var $target = $($form.attr("data-otf-target")); 
     var $newHtml = $(data); 
     $target.html($newHtml); 
    });

그 방법은, 당신의 요소는 여전히 있습니다 대신 replaceWith()의 .html 중에서() 메소드를 사용하여 RestaurantList 요소의 내용 같은 이드. 그리고 처리기의 다음 실행 잘 작동합니다.

출처

2017-12-27 15:34:24 RogerC

감사합니다! 완벽하게 작동합니다. –

다음 Jquery Ajax Call이 한 번만 실행되는 이유는 무엇입니까?

답변

관련 문제