Back

使用 jeditable

发布时间: 2015-06-01 07:20:00

refer to:  http://www.appelsiini.net/projects/jeditable

注意: 放弃使用 rubygem 吧, 里面没有啥内容。 

用法:

下载文件:http://www.appelsiini.net/download/jquery.jeditable.js

并且把 js 文件做好配置后:

<p class="jeditable" id="paragraph_1" company_id=3>the text to edit</p>

$(".jeditable").editable('/positions/save_excel', {
//    indicator : "<img src='img/indicator.gif'>",
    indicator : "<img src='<%= asset_path('indicator.gif') %>'",
    type   : 'text',
    select : true,
    event: 'dblclick',      // 双击编辑
    submit : 'OK',
    cancel : 'cancel',
    cssclass : "editable",  // css的样式
    style: 'width: 100%',   // input 宽度是100%
    onblur: 'ignore'        // 开启调试模式。
    // submitdata可以设置需要提交的额外的参数(除了id, value之外的)
    submitdata: function(value, settings){  // $(this) 代表当前被click的元素
      result = {
        market_module_id: $(this).attr('market_module_id'),
        company_id: $(this).attr('company_id'),    
        date: $(this).attr('date')
      }
      return result
    }
});

就可以了。 

发送给后端哪些数据? 

id, value 是必须的。 value 就是你刚才输入的内容。id 是这个div/ element id,  想传其他参数? 使用 submitdata . 例如:

submitdata: { _method: "put" },

如果需要

默认是显示远程返回的json 。 所以操作成功的话,最好返回刚才输入的内容。例如:

  def save_excel
    render text: params[:value]
  end 

Back