用AJAX在Rails中提交動態表單的最佳方式是什麼？

在我的應用程序中，我管理着許多包含許多變量的工作流程。 - 每個變量都有自己的值。 - 每個工作流程都與一個或多個變量相關聯。用AJAX在Rails中提交動態表單的最佳方式是什麼？

我有一個工作流程配置頁面，用戶將在其中選擇一個工作流程，然後顯示其相關變量以輸入值。我遇到的問題是用最好的方法來保存用戶在表單上的條目。通常我會對/ variables /：id/update做一個ajax調用，但在這種情況下，我想在按下保存按鈕的同時更新多個變量。我的想法是在變量控制器中創建一個自定義方法來處理這個問題，但是在那個嘗試中我得到一個關於無法驗證CSRF令牌真實性的錯誤。

我真的很感謝任何幫助，我可以得到。我覺得可能有更好的方法來做這件事，但我有點綠，只是不知道。任何人都有建議？

我在customize.html.erb形式如下：

<div class="col-md-10" style="background-color:yellow; height: 216px; "> 
    <div class="h3">Required ContextDataDef Values:</div> 
     <div class="workflow_variables">   
      <div id="placeholder"></div>        
    </div> 
</div>

我的JavaScript看起來像：

$(document).on('click', '.list-group .workflow-item', function() { 
    var listGroupItem$ = $(this).find('.list-group-item'); 
    var listGroupItemName = listGroupItem$.text(); 

    var workflowId$ = $(this).find('.workflow-id-string'); 
    var workflowIdText = workflowId$.text(); 


    $.getJSON('/workflows/'+ workflowIdText + '/details', function(foundFlow) { 
     console.log(foundFlow); 

    var flowName = foundFlow['name']; 
    var flowDescrip = foundFlow['description']; 

    $('#flowName').val(flowName); 
    $('#flowDescrip').val(flowDescrip); 
    }); 


    $.getJSON('/workflows/'+ workflowIdText + '/getFlowVariables', function(foundVars) { 
    console.log(foundVars); 

    var output=""; 
    for (var i in foundVars) { 
     output+=" <form class='form-inline' id='variableValuesForm' data-remote='true'>" + "<label for='@variable' style='margin-right: 5px; margin-top: 5px;'>" + foundVars[i].name + ":</label>" + "<input type='text' style='width: 170px; margin-top: 5px;' class='text small' name=" + foundVars[i].name + " id=" + foundVars[i].name + " value=" + foundVars[i].value + ">" + "<input type='text' style='width: 20px; margin-top: 5px;' class='text small' name='varID' id='varID' value=" + foundVars[i].id + ">" + "<button>Save</button>" + "</form>"; 
    } 
    output+=""; 

    document.getElementById("placeholder").innerHTML=output; 


    }); 


    });

---- ---- UPDATE基於的意見，我已經更新了以上信息：

所以當我添加data-remote = true時，我最終得到的是這個

Started GET "/clients/4/customize?&rbYouTubeUsername=MyUser&varID=29"

這很好，所有的，但我真的想調用一種不同於自定義的方法。我想是這樣的：

Started GET "/clients/4/updateVariable?&rbYouTubeUsername=MyUser&varID=29"

或者在一個完美的世界，我會得到這樣的：

Started GET "/variable/29/update?&rbYouTubeUsername=MyUser"

來源

2015-04-03 JasonPerr

軌已經具有內置支持的形式阿賈克斯，您可以點擊這裏http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html – 2015-04-03 21:17:17

這並沒有真正幫助。我知道軌道形式助手，但不知道如何在頁面第一次加載時表單不存在時使用它們。只有當用戶點擊工作流以觸發表單變爲可見時，表單纔會存在。它的事實並不總是存在，導致問題的複雜性。 – JasonPerr 2015-04-03 21:39:51

穆罕默德是正確的。你想使用Rails的不顯眼的JavaScript的想法。即使你沒有在Ruby端使用表單助手，你仍然可以添加data-remote =「true」來獲得你想要的效果。 – shawn42 2015-04-03 21:52:42

我缺少的是有加有清醒的認識的關鍵要素數據的遠程='true'參數以及一個動作參數，所以我可以控制控制器發送表單數據的方法。一旦我將這兩個元素添加到表單中，這都是有道理的。

data-remote='true' action='update_variable'

現在的結果是

Started GET "/clients/4/update_variable?rbYouTubeUsername=AnotherNewVal&varID=29"

來源

2015-04-04 05:21:53 JasonPerr

用AJAX在Rails中提交動態表單的最佳方式是什麼？

回答

相關問題