2013-07-25 4 views
1

첫 번째 양식 성공 함수 내에서 다른 AJAX Form Post를 수행해야합니다.AJAX 성공 내에서 AJAX 양식 제출

http://i.imgur.com/rZ2gx6G.jpg

예,이 2 개 AJAX 요청을 수행합니다. 검색 영화 => 영화 =>이보기 구함 선택 특정 영화의 자세한 사항 나는 또 다른 AJAX 요청을 수행하는 밤은 영화 제목을 선택하면 <div id="results"></div>는 잘하지만, 요청이 간다 사업부로 결과를로드 할 수 있어요

메인 창으로

결과를 처리하는 초기 검색 페이지입니다. #results 내에서 결과를 반환

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#searchtitle").submit(function() { 
      var id = $(this).children('input[name="thetitle"]').attr('value'); 
      $.ajax({ 
       type: "POST", 
       url: "s.php", 
       data: $('#searchtitle').serialize(), 
       cache: false, 
       success: function(data){ 
      $('#status').html(data); 
       } 
      }); 
      return false; 
     }); 
    }); 

</script> 

<form id="searchtitle"> 
    <input type="text" name="thetitle" /> 
    <input type="submit" name="submit" class="button expand postfix" value="Search" /> 
</form> 
<div id="status"></div> 

s.php는

<?php 
    if(empty($_POST['thetitle'])) { 
    ?> 
<div class="alert-box error"> 
    <div class="alert-error"></div> 
    Error: Nothing Found 
</div> 
<?php 
    } 
    if(!empty($_POST['thetitle'])) { 
     $myid = strtoupper($_POST['thetitle']); 

     $searchReults = $tmdb_V3->searchMovie($myid,'en'); 
     ?> 
<?php 
    foreach($searchReults['results'] as $result) { 
    ?> 
<form class="sform"> 
    <input type="hidden" name="mid" value="<?php echo $result['id']); ?>" /> 
    <h5><?php echo $result['title']; ?></h5> 
    <span class="mreleased">Year: <?php echo $result['year']; ?></span> 
    <input type="submit" class="button" value="Select"> 
</form> 
<?php 
    } 
    } 
    ?> 

이 내가 가진

<script type="text/javascript"> 
$(".sform").submit(function() { 
    $.ajax({ 
     type: 'POST', 
     url: 'sx.php', 
     data: $(this).closest("form").serialize(); 
     success: function (response) { 
      $('#status').load(response); 
      $('#status').find('script').each(function (i) { 
       eval($(this).text()); 
      }); 

     } 
    }); 

    return false; 
} 
</script> 

s.php에서 결과를 게시 할 예정입니다 코드입니다 초기 검색 페이지 하단의 s.php 안에이 스크립트를 넣으려고 시도했습니다. 알 페이지와 운이 없다면, sx.php가 아닌 곳에서 벌금을 제출하십시오. s.php 문에서

+0

해당 파일 외부에서 양식 전송 기능을 이동하여 동일한 파일에 배치하십시오. 그런 다음 첫 번째 아약스 성공 함수 내에서'$ ('. sform')을 호출하십시오. submit();' – Ohgodwhy

+0

중복 http://stackoverflow.com/questions/15065725/how-to-submit-a-form-on- ajax-success? rq = 1 – maximkou

+0

우리가 설정하고 확인할 수 있도록 양식 구조를 제공 할 수 있습니까? – Konsole

답변

2

:

<input type="hidden" name="mid" value="<?php echo $result['id']); ?>" /> 

은 다음과 같아야합니다

<input type="hidden" name="mid" value="<?php echo $result['id']; ?>" /> //remove extra bracket 

을 s.php에 자바 스크립트 코드에 오타가 있습니다 :

data: $(this).closest("form").serialize(); // here should be comma not semicolon 

return false을 한 후에는 스크립트를 올바르게 닫아야합니다. }});이어야합니다.

동적 콘텐츠를 제출하려하므로 $(".sform").submit(function()이 작동하지 않습니다. 동적 콘텐츠에는 on을 사용해야합니다. 올바른 스크립트는 다음과 같습니다.

<script type="text/javascript"> 
$(document).on('submit', '.sform', function() { 
    $.ajax({ 
     type: 'POST', 
     url: 'sx.php', 
     data: $(this).closest("form").serialize(), 
     success: function (response) { 
      $('#status').load(response); 
      $('#status').find('script').each(function (i) { 
       eval($(this).text()); 
      }); 

     } 
    }); 

    return false; 
}); 
</script> 

로컬 호스트에서 (간단한 설정으로) 확인하고 확인했습니다. 그것은 두 아약스 요청을하고있다. 희망이 도움이!

+1

방금 ​​3 일간 두통이 풀 렸습니다! 이것은 완벽하게 작동합니다! 고맙습니다! –