Question

我正在开发一个Rails 4 Web应用程序。在我的Rails应用程序中，我有2个表单。第一个表单包含员工列表，我可以在其中选择员工并通过单击“添加”按钮添加到“第二个表单”。第二个表单还包含一个按钮，我可以从第二个表单中删除员工，所有被删除的员工将被移回第一个表单。

目前我实现了这一点，当我点击First表单中的添加按钮时，我将通过Ajax调用将所选员工数据传递给控制器，并将相同的选定数据返回到第二表单以显示所选员工。

是否可以在不对服务器进行任何调用的情况下从客户端进行管理。

Rails中是否有可用于实现此目的的宝石。

我正在使用Rails 4和Ruby 2。

示例：Sample List Manipulation in Javascript

感谢任何帮助。

Answer 1

是的，可以在客户端

执行此操作

<强>的Javascript

我要做的就是用页面上的JS替换你的ajax调用

在这个例子中使用过JQuery（希望没关系）：

<强> http://jsfiddle.net/U443j/3/

$(".move").on("click", "input", function() {
    var button = $(this).attr("id");
    var from = document.getElementById("FromLB");
    var to = document.getElementById("ToLB");

    if (button == "left") {
       move(to, from);
    }else{
       move(from, to);   
    }
});


function move(tbFrom, tbTo) 
{
 var arrFrom = new Array(); var arrTo = new Array(); 
 var arrLU = new Array();
 var i;
 for (i = 0; i < tbTo.options.length; i++) 
 {
  arrLU[tbTo.options[i].text] = tbTo.options[i].value;
  arrTo[i] = tbTo.options[i].text;
 }
 var fLength = 0;
 var tLength = arrTo.length;
 for(i = 0; i < tbFrom.options.length; i++) 
 {
  arrLU[tbFrom.options[i].text] = tbFrom.options[i].value;
  if (tbFrom.options[i].selected && tbFrom.options[i].value != "") 
  {
   arrTo[tLength] = tbFrom.options[i].text;
   tLength++;
  }
  else 
  {
   arrFrom[fLength] = tbFrom.options[i].text;
   fLength++;
  }
}

tbFrom.length = 0;
tbTo.length = 0;
var ii;

for(ii = 0; ii < arrFrom.length; ii++) 
{
  var no = new Option();
  no.value = arrLU[arrFrom[ii]];
  no.text = arrFrom[ii];
  tbFrom[ii] = no;
}

for(ii = 0; ii < arrTo.length; ii++) 
{
 var no = new Option();
 no.value = arrLU[arrTo[ii]];
 no.text = arrTo[ii];
 tbTo[ii] = no;
}
}

这将允许您在表单元素之间移动项目。这很重要的原因是因为它允许您将数据作为一个数据集发送到控制器：

<强>控制器

在我的JSFiddle上，我有一个save按钮

这可以绑定到您的Rails控制器，允许您将表单数据发送到您的系统

这将发送你的params哈希：

params { "FromLB": ["value1", "value2"], "ToLB": ["value1", "value2"] }

哈希的结构将有所不同，但您将获得两组数据，然后可以将这些数据放入数据库中：

#app/controllers/your_controller.rb
def action
   @from = params[:FromLB]
   @to = params[:ToLB]

   #Save the data-sets here
end

Ruby on Rails：在Rails应用程序中从客户端管理数组？

1 个答案: