2011-05-20 74 views
0

我有一個運行的應用程序在rails中,我想灑一些ajaxiness。使用facebox提交表單

我現在有一個多形式,並且要做到以下幾點:在第1步點擊「提交」

  • 用戶(形式被提交)
  • 的fancybox啓動顯示註冊表單和「註冊」或「跳過」按鈕
  • 如果點擊「註冊」或「跳過」並不重要,用戶會轉到步驟2以查看我的應用程序。

我正在尋找launching fancybox on form submitsubmitting form via fancybox

在演示的我什麼也沒找到。

在我使用fancybox之前,有人使用fancybox插件來完成這個工作流程嗎?

我讀了一些SO questions與提交表單問題的用戶。我提到的工作流是否有更好的插件?

回答

0

我已經做了類似fancybox的實現。我有一個用戶結帳,點擊結帳後,一個fancybox會出現問題提示。在顯示提示之前,它會提交表單。這是我使用的代碼的輪廓:

我改變表單提交按鈕鏈接:

<a id='various2' href='#submitform'>Submit</a> 

綁定的fancybox的鏈接,並添加的onComplete儘快處理形式的fancybox打開:

$(document).ready(function() { 


      $("#various2").fancybox({ 
       'cache' : false, 
       'hideOnOverlayClick' : false, 
       'showCloseButton' : false, 
       'autoDimensions' : false, 
       'width'    : 650, 
       'titlePosition'  : 'inside', 
       'transitionIn'  : 'fade', 
       'transitionOut'  : 'fade', 
       'scrolling'   : 'no', 

       'onComplete'   : function(){ 
        processform(); 
       } 
      }); 
}); 

有一個javascript函數來處理表單使用ajax,然後顯示您的登錄/創建帳戶信息。如果是我,我會做另一個Ajax調用來顯示您登錄/註冊,但我已經離開的代碼了,但有評論表示的一部分,你可以把它叫做:

function processform(){ 
     var idcardnumber1 = jQuery("#field1").val(); 
     var idcardnumber2 = jQuery("#field2").val(); 
     $.ajax({ 
      cache : false, 
      type: "POST", 
      url: "processform.php", 
      data: "field1="+field1+"&field2="+field2, 
      dataType: "json", 
      success: function(data){ 
      if(data.valid == 1){ 
      // Display Your Login Signup Form 
      } 
      else{ 
       // Close Fancybox since the form did not submit 

       $.fancybox.close(); 
      } 


      } 
     }); 
    } 
+0

我一直在尋找一種方式來不要將按鈕變成超鏈接。此外,我的表單有超過20個字段,並且像'processForm()'方法中那樣傳遞它們將會非常麻煩並且很難在將來調試。我會留意其他選項。 – Omnipresent 2011-05-25 13:44:02