【问题标题】:Change value of variable on checkbox checked rails更改复选框选中导轨上的变量值
【发布时间】:2013-11-08 11:10:34
【问题描述】:

我是 Rails 新手。请帮助我,因为我对在 rails 中使用 jquery 和 ajax 没有明确的了解。

我有一个任务复选框。我的数据库中有一个布尔字段 is_completed,默认情况下设置为 false。选中复选框时,is_completed 的值应设置为 true,如果未选中,则应设置为 false。

迁移任务表

  t.boolean :is_completed, :default => false 

我的查看代码是

  <%= check_box_tag :is_completed %>

在我的 task.js 中

  $(':checkbox').change(function() {
     if (this.checked) {
   alert('completed')
      /* is_completed should be true */
     } 
     else {
  /* is_completed should be true */
    } 
   });
 });

请告诉我该怎么做。

【问题讨论】:

  • 你能发布整个视图代码和根吗?您是否希望通过 ajax 来做到这一点,它没有在任何地方说明。
  • 除了ajax还能做什么?
  • 使用 remote:true 为每个对象制作表单,因此 rails 会处理所有事情。这是一种糟糕的方式,但最简单。

标签: javascript jquery ruby-on-rails checkbox


【解决方案1】:

我创建了一个方法并从 jquery 传递了值,并使用 ajax 请求完成了工作。

在task.js中

  $(function () {
    $(':checkbox').change(function () {
      var task_id = jQuery('#task_id:hidden').val();
      complete_task(task_id);
   });


 function complete_task(task_id) {
$.ajax({    
  type: "GET",
  dataType: "html",
  url: "/tasks/"+task_id+"/complete_task",
  data: {"task_id": task_id},
  success: function(data) {
    $("#task_status").html(data);
  }
 });
 }
});

在任务控制器中

 def complete_task
@task =Task.find(params[:task_id])
@task.is_completed = true
@task.save
render :partial => 'task'
end

【讨论】:

    【解决方案2】:

    使用jquery ajax:

    $(':checkbox').change(function() {
       $.ajax({
        url: "/tasks/" + task_id,
        data: "&task[is_completed]=" + this.checked,
        dataType: "json",
        type: "PUT"
        });
     });
    

    【讨论】:

      【解决方案3】:

      试试这个:

      $(':checkbox').click(function() { 
          var checked = $(':checkbox').prop('checked');
          if (checked)
              alert('yes');   
          else
              alert('no');
      });
      

      【讨论】:

      • 它没有用。我希望将数据库中的字段更改为 true。如果复选框被选中但即使我选中复选框也没有响应
      • 检查this
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-12-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-03-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多