javascript/jquery timer에서 Ajax 양식 제출 제출

Question

자동으로 Ajax 지원 양식의 제출 버튼을 클릭하여 사용자가 버튼을 클릭 할 필요는 없지만 선택적으로 선택할 수 있습니다.

지금 당장은 Javascript에서 양식을 호출하는 첫 번째 경계에서 작업하고 있으므로 타이머를 작성한 후에는이 부분을 알아 보겠습니다.

나는 이것을하기 위해 여러 가지 방법을 시도했으며, 아무 것도 작동하지 않았다. 이것이 (jquery.mobile을 사용하는) ASP.NET MVC 4 모바일 응용 프로그램이지만 Jquery.mobile ajax가 비활성화되어 있으므로 내 버튼이 작동하도록되어 있습니다 (div를 업데이트하면 수동 아약스 기반 양식이 작성됩니다. jQuery.mobile 앱에서는 작동하지 않습니다. 왜냐하면 모든 ajax 양식 제출에 후크하기 때문입니다).

현재 버튼이 제대로 작동하므로 프로그래밍 방식으로 실행하지 못하는 것 같습니다. 내가 자바 스크립트에서이 작업을 수행하기 위해 노력했다

<% using (Ajax.BeginForm("SendLocation", null, new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "result", HttpMethod = "POST" }, new { @id = "locationForm" })) 
    { %> 
<ul data-role="listview" data-inset="true"> 
    <li data-role="list-divider">Navigation</li> 
    <li><%: Html.ActionLink("About", "About", "Home")%></li> 
    <li><%: Html.ActionLink("Support", "Support", "Home")%></li> 
    <li data-role="list-divider">Location</li> 
    <%: Html.HiddenFor(model => model.GPSLongitude)%> 
    <%: Html.HiddenFor(model => model.GPSLatitude)%> 
    <li><input type="submit" id="submitButton" value="Send" /></li> 
</ul> 
<% } %> 

:

나는 내 양식이

$.ajax({ 
       type: "POST", 
       url: action, 
       success: function() { 
        alert('success'); 
       } 
      }); 

을 그리고 평소에 서버 코드 발사를 얻는다. 그러나 DIV가 업데이트되지 않았고 모델도 손상되지 않았습니다 (모든 내부 값이 null로 존재하므로 새로 인스턴스화 된 것으로 가정합니다).

는 또한 양식을 발사하는 다양한 방법을 시도했습니다 :

 var form = $('#locationForm', $('#myForm')); 
     if (form == null) { 
      alert('could not find form'); 
     } else { 
      alert('firigin on form'); 
      form.submit(function (event) { eval($(this).attr("onsubmit")); return false; }); 
      form.submit(); 
     } 

이 중 하나가 작동하지 않았다 : 나는 웹을 통해 발견이 작업을 수행하는 모든 방법이었다

 var f = $('#locationForm', $('#myForm')); 
     var action = f.attr("action"); 
     var data = f.attr("data"); 
     $.post(action, data, function() { alert('back'); }); 

.

아무도 양식을 실행하지 않고 사용자가 제출 버튼을 직접 누른 것처럼 정상적으로 작동하게했습니다. 물론이 작업이 실패하면 제출 버튼을 누르면 완벽하게 작동합니다 ...

Answer 1

올바른 js 라이브러리를 포함하고 있는지 확인하십시오. 이 필요합니다. jquery.js, jquery.unobtrusive-은 ajax.js

) (

<appSettings> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/> 
    </appSettings> 

$은 ('#의 locationForm')가 제출 시도하십시오 web.confg에서 확인이 unobtrusivejavascriptenabled = 진정한합니다.;

오류 메시지가 나타 납니까? 사용중인 경우 즉, develper 도구를 사용하여 네트워크 트래픽을 확인하여 전송 된 항목이 없는지 확인할 수 있습니다.

Answer 2

Chrome 개발자 도구를 사용하여 $ .ajax 호출이 작동하기 전에 유효한 데이터를 가져야한다는 사실을 발견했습니다.

게시물에 내부 500 오류가 나타납니다. 물론 AJAX 덕분에 침묵을 지키고 컨트롤러가 IIS를 통과하지 못해 발포 한 것이 아니 었습니다.

그래서 내가 보낸 데이터가 JSON이 아니며 .serialize()가 JSON 형식을 사용하지 않는다는 것을 알았습니다.JSON Javascript 라이브러리를 사용하여 JavaScript로 개체를 변환하려고했지만 Data Model 개체 (또는 양식 개체)가 해당 라이브러리와 호환되지 않는 것으로 보입니다. JavaScript 콘솔에서 오류가 발생하고 시도 할 때 라이브러리가 다운됩니다.

은 내가 수동으로 원하는 실제로 단지 개체를 전달하기로 결정 난 컨트롤러 (GPS LON/LAT)를 전송하고 싶었다 숨겨진 필드를 통과하고, 모델은 컨트롤러에 그대로 있었다

var encoded = '{ GPSLongitude: ' + $('#GPSLongitude', $('#myForm')).val() + ',GPSLatitude: ' + $('#GPSLatitude', $('#myForm')).val() + '}'; 

요구!

이제이 대답을 읽는 모든 사람에게. 뷰를 업데이트해야하는 실제 AJAX 업데이트 프로세스가 작동하지 않습니다. 비록 제 목적을 위해서 실제로 업데이트 할 필요는 없었습니다. 부분 뷰가 리턴되었지만 특별한 AJAX 호출은 폼의 div가 업데이트되도록 연결을 끊는 것 같습니다.

그러나 데이터가 컨트롤러로 그대로 전달 되었기 때문에 기본적으로 필자가 궁극적 인 목표 인 서버에 필요한 GPS 데이터를 전달했습니다.