使用jQuery驗證上傳表單，在submitHandler（）中使用ajax（）...不工作

我正在使用jquery驗證表單。我想使用ajax提交表單。當我把ajax調用放入validate的submitHandler（）時，瀏覽器掛起。這是怎麼回事？使用jQuery驗證上傳表單，在submitHandler（）中使用ajax（）...不工作

該錯誤消息我得到的，當我使validate方法的調試是：

未捕獲的異常：[異常... nsresult 「上WrappedNative 原型對象非法操作」：「0x8057000c （NS_ERROR_XPC_BAD_OP_ON_WN_PROTO ）」位置：「JS幀:: http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js ::˚F::線132」的數據：無]

W¯¯對我而言，這太神祕了。

一些代碼：

$(document).ready(function() { 
$("#loginForm").validate({ 
     debug: true, 
     errorLabelContainer: $('div.error'), 
     wrapper: 'li', 
     rules: { 
      last_name: { 
       required: true 
      } 
     }, 
     messages: { 
      last_name: { 
       required: "Please enter your last name." 
      } 
     }, 
     submitHandler: function(form){ 
      $.ajax({ 
       type: "POST", 
       url: "test.php", 
       data: form, 
       success: function(msg){ 
        console.log("Data Saved: " + msg); 
       }, 
       error: function(msg){ 
        console.log("Error: " + msg); 
       } 
      }); 
     } 
    }); 

});

的形式是非常香草形式。通過標準POST提交工作正常。此外，驗證工作正常......這只是提交與Ajax部分，使我失敗。

來源

2010-10-28 Lothar

調用AJAX方法你說的瀏覽器掛起，我想知道在這段時間裏發生了什麼。你的服務器端代碼是否運行？或者我們仍然是客戶端？你有沒有在你的服務器端代碼中加入某種類型的調試器來處理這個請求？ – Samo 2010-10-28 03:51:01

您可能需要在發送之前連載這種形式 - 你可能不希望發送一個DOM對象

編輯RE：評論 - 只選擇一些投入和序列化 -

$(form).find(":input[name=inp1] :input[name=inp2]").serialize()

來源

2010-10-28 03:58:42 tobyodavies

我該怎麼做（以及爲什麼）？ – Lothar 2010-10-28 04:09:20

，因爲您不想發送dom對象，而不是發送頁面上的第一個鏈接 - 它只是沒有意義。 _您想要發送用戶輸入的鍵值對，這只是DOM中信息的一小部分（其中包括CSS屬性，頁面上的位置，子節點，父節點和其他任何內容可以通過JavaScript來訪問DOM）。序列化表單最簡單的方法是使用'$（form）.serialize（）' – tobyodavies 2010-10-28 04:18:54

這似乎是工作！你知道如何只訪問序列化數據的某些元素嗎？ – Lothar 2010-10-28 04:39:52

只是爲了詳細闡述tobyodavies的答案。您可能需要您提交變更爲

 $.ajax({ 
      type: "POST", 
      url: "test.php", 
      data: $(form).serialize(), 
      success: function(msg){ 
       console.log("Data Saved: " + msg); 
      }, 
      error: function(msg){ 
       console.log("Error: " + msg); 
      } 
     });

Ajax的功能預計數據選項，可以是一個字符串（不完全正確的，但這種情況下，它的罰款），而通過考試的形式DOM對象。

來源

2010-10-28 04:23:24 Toby

感謝您的回答。你知道如何只訪問序列化數據的某些元素嗎？ – Lothar 2010-10-28 04:40:09

我不完全確定你的意思。如果你只想序列化表單元素的一個子集，那麼你可以選擇那些序列化，而不是像 $（'＃name，＃email，＃phonenumber'）。serialize（）將序列化名稱，電子郵件和電話號碼錶單元素 – Toby 2010-10-28 05:19:41

如果使用數據：$（form）.serialize（），則無法接收文件。如何使用ajax上傳文件。 – 2016-07-30 08:31:51

與PHP函數

<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script> 

class Ajax{ 
public function submitForm($data=array()){ 
    //form - name attribute 
    //do - ajax page do_ 
    // get - ajax result 
    return '<script language="javascript" type="text/javascript"> 
       $(document).ready(function (data){ 
        $(\'form[name='.$data['form'].']\').validate({ 
          submitHandler: function(form) { 
           $.ajax({ 
            method : \'post\', 
            url : \'' . AJAX_PATH . ''. $data['do'].'\', 
            data : $(this).serialize(), 
            dataType : \'html\', 
            success : function(data){ 
             $(\'form[name='.$data['form'].']\').slideUp(1000); 
             $(\''. $data['get'] .'\').html(data).fadeIn(1000); 
             //$(\''. $data['get'] .'\').html(data).fadeIn(1000); 
            }, 
            error : function(data) {alert(\'missing file\'); } 
           }); 
           return false; 
          } 
        }); 
       }); 
      </script>'; 
}

}

$ajax = new Ajax(); 

<?php echo $ajax->submitForm(array('do'=>'do_register.php','form'=>'register','get'=>'#message'));?>

來源

2011-10-29 17:53:26 Thiwanka

使用jQuery驗證上傳表單，在submitHandler（）中使用ajax（）...不工作

回答

相關問題