2010-02-23 5 views
0

malsup jquery 양식 플러그인을 사용하려고하는데 간단한 예제가 작동하지 않습니다 (http://jquery.malsup.com/form/#ajaxForm). 아래 코드를 붙여 넣었습니다. 무슨 일 이니? 일어나는 모든 것은 나는 "당신의 코멘트에 대해 당신에게 감사합니다!"라는 경고 상자를 얻습니다. 다른 일은 일어나지 않습니다.Ajax, jquery 양식 플러그인이 작동하지 않습니다.

감사합니다,

마크

이것은 ajaxtest.html 파일입니다


:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="javascript/jquery.js"></script> 
    <script type="text/javascript" src="javascript/jquery.form.js"></script> 
    <script type="text/javascript"> 
     // wait for the DOM to be loaded 
     $(document).ready(function() { 

    var options = { 
    target: '#output1', // target element(s) to be updated with server response 
    beforeSubmit: showRequest, // pre-submit callback 
    success: showResponse // post-submit callback 
    }; 

      // bind 'myForm' and provide a simple callback function 
      $('#myForm').ajaxForm(function() { 
       alert("Thank you for your comment!"); 
     }); 
     }); 
    function showRequest(formData, jqForm, options) { 
    alert("calling before sending!"); 
    return true; 
    } 
    function showResponse(responseText, statusText, xhr, $form) { 
    alert("this is the callback post response"); 
    } 
    </script> 
<script> 

</script> 
</head> 
<body> 
<form id="myForm" action="form/report.php" method="post"> 
    Name: <input type="text" name="name" /> 
    Comment: <textarea name="comment"></textarea> 
    <input type="submit" value="Submit Comment" /> 
<div id="output1"></div> 
</form> 
</body> 
</html> 

이것은 PHP 파일입니다

<?php 
echo '<div style="background-color:#ffa; padding:20px">' . $_POST['message'] . '</div>'; 
?> 

+0

js 오류에 대해 방화 킷 콘솔을 확인 했습니까? –

답변

0

어디서든 options 변수를 사용하지 않고 정의하면됩니다.

+0

감사합니다. - 이것이 문제였습니다. 감사합니다! – Mark

0

"options"객체를 ajaxForm 호출에 전달하고 그 안에 success 함수 (즉, options 객체)를 설정해야합니다. 이 페이지를 참조하십시오 : http://jquery.malsup.com/form/#options-object

+0

정말 고마워요! 이것이 문제였습니다. 그것의 newb 실수하지만 언젠가는 배우기 시작해야합니다. – Mark

관련 문제