0

我正在尝试执行以下操作：

1）当一个复选框被选中时，我希望该Time of Arrival框随着复选框被动态选中的时间而更新。我不想按下提交按钮或任何类似的东西，我猜它应该是动态的，通过 AJAX。 在此处输入图像描述

我当前的代码如下所示：

<table border="1">
    <tr>
     <td><b>Present</b></td>
     <td><b>Student ID</b></td>
     <td><b>First Name</b></td>
     <td><b>Last Name</b></td>
     <td><b>Time of Arrival</b></td>
    </tr>
<% @register.student_registers.each do |student_register| %>
  <tr>
      <td><%= check_box_tag "student_registers_ids[#{student_register.id}]",  student_register.id, student_register.present?%></td>
      <td><%= student_register.student.university_id%></td>
      <td><%= student_register.student.first_name.titlecase%></td>
      <td><%= student_register.student.last_name.titlecase%></td>
      <td><%= student_register.time_of_arrival %></td>
  </tr>
  <% end %>
</table>

2）我想做的另一件事是更新数据库中的记录，只要Present复选框被选中，而无需按下Submit按钮。这将在model#show页面中完成，而不是在model#edit页面中。

有什么建议么？

编辑：

我修改了代码，但它仍然无法正常工作......

<table border="1">
    <tr>
     <td><b>Present</b></td>
     <td><b>Student ID</b></td>
     <td><b>First Name</b></td>
     <td><b>Last Name</b></td>
     <td><b>Time of Arrival</b></td>
    </tr>
  <% form_tag :remote => true %>
<% @register.student_registers.each do |student_register| %>
  <tr>
      <td><%= check_box_tag "student_registers_ids[#{student_register.id}]",
                            student_register.id, student_register.present?,
                            :disabled => false,
                            :onclick => 'popup  ' %></td>
      <td><%= label_tag 'UniversityId', student_register.student.university_id%></td>
      <td><%= label_tag 'FirstName', student_register.student.first_name.titlecase%></td>
      <td><%= label_tag 'LastName', student_register.student.last_name.titlecase%></td>
      <td><%= label_tag student_register.time_of_arrival, nil, :class => 'TimeOfArrival'%>    </td>
  </tr>
  <% end %>

</table>
<%= submit_tag "Save", :confirm => "You sure", :onclick => 'alert("Test")'%>

求各位大神帮忙。。。。

4

1 回答 1

0

这是我要做的：

  1. 为所有复选框输入指定一个公共 CSS 类（稍后用作 jQuery 选择器）。
  2. 在“到达时间”单元格中创建一个空<span>...</span>元素，其 id 对学生 ID（例如 ）进行编码。'toa_1234'
  3. 使用 jQuery.change()并将$.ajax()消息发送到服务器。
  4. 创建相应的控制器或动作来处理 AJAX POST 并返回记录的（服务器端）时间。
  5. 在 AJAX 成功时，显示记录的服务器时间并禁用复选框（因此不能再次单击）。

HTML/ERB：

<td><%= check_box_tag "student_registers_ids[#{student_register.id}]",
  student_register.id, false,
  :class => 'student_present' %></td>
<td><%= student_register.student.university_id%></td>
<td><%= student_register.student.first_name.titlecase%></td>
<td><%= student_register.student.last_name.titlecase%></td>
<td><%= content_tag :span, student_register.time_of_arrival,
  :id => "toa_#{student_register.student.id}" %></td>

JS/咖啡脚本：

$ ->
  $('input[type="checkbox"].student_present').change (e) ->
    checkbox = $(this)
    student_id = checkbox.val()
    $.ajax
      url: '/register/present'
      method: 'POST'
      dataType: 'json'
      data:
        student_id: student_id
      success: (data) ->
        $("span#toa_#{student_id}").html(data['toa'])
        checkbox.attr 'disabled', true

控制器/动作：

def present
  student_id = params['student_id']
  # TODO: mark student present and save in database
  recorded_toa = Time.now # TODO replace with actual time
  render json: { student_id: student_id, toa: recorded_toa.strftime('%I:%M %P') }
end
于 2013-03-14T07:45:51.723 回答