2014-10-11 95 views
0

我想更新一些帶HTML5 contenteditable選項的stroy的情節。這裏是代碼。需要更新Rails模型的Ajax調用HTML5 contenteditable,而不是它的創建新記錄

查看文件#,其中多條曲線可以修改

<div id="editable" contenteditable="true"> 
    <%= simple_format p.description %> 
</div> 

AJAX#

$(function(){ 
    var contents = $("#editable").html(); 
    $('#editable').blur(function() { 
     if (contents!=$(this).html()){ 
     alert('Handler for .change() called.'); 
     contents = $(this).html(); 
     autoSavePost(); 
     } 

    }) 
}); 

function autoSavePost(){ 
    var data = {id: parseInt($("#plot_id").text()), tale_id: parseInt($("#tale").text()) ,description: $("#editable").html(), user_id: parseInt($("#user").text())}; 
    console.log(data); 
    $.ajax({ 
     type: "POST", 
     url: "/plots", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     data: JSON.stringify(data), 
     success: function(){ 
      $("#success-indicate").fadeIn().delay(4000).fadeOut(); 

     } 
    }); 
    // setTimeout(autoSavePost, 6000); 
} 

routes文件#

resources :plots do 
    member do 
    post 'update' 
    end 
end 

控制器文件#

def update 
    respond_to do |format| 
    if @plot.update(params[:description]) 
     format.html { redirect_to plots_path, notice: 'Plot was successfully updated.' } 
     format.json { render:@plot } 
     format.js 
    else 
     format.html { render action: 'edit' } 
     format.json { render json: @plot.errors, status: :unprocessable_entity } 
    end 
    end 
end 

我在問專家的幫助。會很感激

+0

現在改變URL格局研究後,其更新爲「陰謀/ ID」和類型爲「PUT」 – sukanta 2014-10-14 23:05:59

回答

0

更改AJAX PARAMS到下面,數據更新,而不是裝箱

function autoSavePost(){ 
    var id = parseInt($("#plot_id").text()); 
    var data = {id: parseInt($("#plot_id").text()), tale_id: parseInt($("#tale").text()) ,description: $("#editable").html(), user_id: parseInt($("#user").text())}; 
    console.log(data); 
    $.ajax({ 
     type: "PUT", 
     url: "/plots/" + id , 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     data: JSON.stringify(data), 
     success: function(){ 
      $("#success-indicate").fadeIn().delay(4000).fadeOut(); 

     } 
    }); 
    // setTimeout(autoSavePost, 6000); 
} 
相關問題