【问题标题】:Saving multiple records from a JQuery to a Rails table?将 JQuery 中的多条记录保存到 Rails 表中?
【发布时间】:2011-08-03 15:52:31
【问题描述】:

我在 jquery 中有一个表,当我单击另一个 jquery 表的记录时会生成该表。该表的该记录具有要输入和提交的数据。该表由几条记录组成。单击提交按钮时,表中的每条记录都必须是 rails 数据库表中的单独记录。我如何获取我需要的数据并将其提交到数据库。我知道我需要 table 的 create 方法,但我不知道如何获取要分配的属性。

项目列表表

<div class="right">

    <b>Projects this week</b><div class = "right"><input name="btnDel" type="button" id="btnDel" value="-" onClick="RemoveRow();"></div>

    <ul id="task_list">
        <form name="frmMain" method="post">
        <table width="470" border="1" id="tbExp">
          <tr>
            <td><div align="center">No.</div></td>
            <td><div align="center">Project </div></td>
            <td><div align="center">Task </div></td>
            <td><div align="center">Hours </div></td>
            <td><div align="center"></div></td> 
          </tr>
        </table>

        <input type="hidden" name="hdnMaxLine" value="0">
        </form>
    </ul>
</div>

Javscript 项目列表表

function CreateSelectOption(ele) {
    var objSelect = document.getElementById(ele);
    var Item = new Option("", "");
    objSelect.options[objSelect.length] = Item;
    var Item = new Option("Pre-Sales");
    objSelect.options[objSelect.length] = Item;
    var Item = new Option("Project");
    objSelect.options[objSelect.length] = Item;
    var Item = new Option("Support");
    objSelect.options[objSelect.length] = Item;
}

function CreateNewRow(num, str) {
    var intLine = parseInt(document.frmMain.hdnMaxLine.value);
    intLine++;

    var theTable = document.getElementById("tbExp");
    var newRow = theTable.insertRow(theTable.rows.length)
    newRow.id = newRow.uniqueID

    var newCell

    //*** ID Column ***//
    newCell = newRow.insertCell(0);
    newCell.id = newCell.uniqueID;
    newCell.setAttribute("className", "css-name");
    newCell.innerHTML = num;

    //*** Column 1 ***//
    newCell = newRow.insertCell(1);
    newCell.id = newCell.uniqueID;
    newCell.setAttribute("className", "css-name");
    //newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"10\" NAME=\"Column1_"+intLine+"\"  ID=\"Column1_"+intLine+"\" VALUE=\"\"></center>";
    newCell.innerHTML = str;

    //*** Column 2 ***//
    newCell = newRow.insertCell(2);
    newCell.id = newCell.uniqueID;
    newCell.setAttribute("className", "css-name");
    newCell.innerHTML = "<center><SELECT NAME=\"Column5_"+intLine+"\" ID=\"Column5_"+intLine+"\"></SELECT></center>";

    //*** Column 3 ***//
    newCell = newRow.insertCell(3);
    newCell.id = newCell.uniqueID;
    newCell.setAttribute("className", "css-name");
    newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column4_" + intLine + "\"  ID=\"Column4_" + intLine + "\" VALUE=\"\"></center>";

    //*** Column 4 ***//
    //  newCell = newRow.insertCell(3);
    //  newCell.id = newCell.uniqueID;
    //  newCell.setAttribute("className", "css-name");
    //  newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column4_"+intLine+"\"  ID=\"Column4_"+intLine+"\" VALUE=\"\"></center>";

    //*** Column 5 ***//
    //newCell = newRow.insertCell(4);
    //newCell.id = newCell.uniqueID;
    //  newCell.setAttribute("className", "css-name");
    //  newCell.innerHTML = "<center><SELECT NAME=\"Column5_"+intLine+"\" ID=\"Column5_"+intLine+"\"></SELECT></center>";

    //*** Create Option ***//
    CreateSelectOption("Column5_" + intLine)
    document.frmMain.hdnMaxLine.value = intLine;
}

function RemoveRow() {
    intLine = parseInt(document.frmMain.hdnMaxLine.value);
    if(parseInt(intLine) > 0) {
        theTable = document.getElementById("tbExp");
        theTableBody = theTable.tBodies[0];
        theTableBody.deleteRow(intLine);
        intLine--;
        document.frmMain.hdnMaxLine.value = intLine;
    }
}

CreateEfforts 迁移

需要保存数据的配置文件

class CreateEfforts < ActiveRecord::Migration
  def self.up
    create_table :efforts do |t|
      t.integer :project_task_id
      t.integer :user_id
      t.date :week_commencing
      t.float :hours

      t.timestamps
    end
  end

  def self.down
    drop_table :efforts
  end
end

【问题讨论】:

    标签: javascript jquery ruby-on-rails-3 datatables


    【解决方案1】:

    考虑将数据从视图中抽象出来。您需要一些数据,例如:

    var myRecord = { number: 123, Project: 'name'... };
    var tableList = [];
    

    最终,您的创建表会将记录添加到 tableList,您可以将其传递给 jQuery 函数,该函数通过 $.post() 发送到 Rails 端点。然后你可以使用 tableList 在页面上呈现你的表格。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2013-10-05
      • 1970-01-01
      • 2010-11-02
      • 1970-01-01
      • 2016-10-16
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多