Rails x-editable values are the same after editting and page refresh

Question

When editing a string, it's value visually changes, but when I refresh page the value becomes as it was before. I am using bootstrap-x-editable-rails 1.5.1.1 gem for editing.

Controller code:

module Admin
    class DoctypesController < AdminController
        before_action :set_doctype, only: [:show, :edit, :destroy, :update]
        def index
            @doctypes=DocumentType.order("title").page(params[:page])
        end

        def show
        end

        def new
        @doctype = DocumentType.new
        end

        def create
            @doctype=DocumentType.create(doctype_params)
            redirect_to admin_doctypes_path
        end

        def destroy
      @doctype.destroy
      redirect_to admin_doctypes_path
    end

    def update
        @doctype.update(doctype_params)
      redirect_to admin_doctypes_path
    end

    def edit

    end

    def set_doctype
        @doctype = DocumentType.find(params[:id])
      end

        private
      def doctype_params
      params.require(:document_type).permit(:id,:title)
        end
    end
end

Index.html.erb code:

<tbody>
        <% @doctypes.each do |doctype| %>
          <tr>
            <td class="doctype_edit" data-model="document_type" data-type="text"  data-url=<%=edit_admin_doctype_path(doctype)%> ><%= doctype.title%></td>
            <td>
                    <%= link_to '', :id => 'btn_remove_doctype', :data => { :path => admin_doctype_path(doctype), :toggle => 'modal', :target => '#modal_confirm_remove_doctype' }, :class => "btn btn-danger btn-xs" do %>
                  <span class='glyphicon glyphicon-remove'></span>
                <% end %>
            </td>
          </tr>
        <% end %>
      </tbody>

JS code:

$.fn.editable.defaults.mode = 'inline';
  $.fn.editable.defaults.ajaxOptions = {type: "GET"};
  $('.doctype_edit').editable();

Part of routes:

               admin_doctypes GET    /admin/doctypes(.:format)                          admin/doctypes#index
                              POST   /admin/doctypes(.:format)                          admin/doctypes#create
            new_admin_doctype GET    /admin/doctypes/new(.:format)                      admin/doctypes#new
           edit_admin_doctype GET    /admin/doctypes/:id/edit(.:format)                 admin/doctypes#edit
                admin_doctype GET    /admin/doctypes/:id(.:format)                      admin/doctypes#show
                              PATCH  /admin/doctypes/:id(.:format)                      admin/doctypes#update
                              PUT    /admin/doctypes/:id(.:format)                      admin/doctypes#update
                              DELETE /admin/doctypes/:id(.:format)                      admin/doctypes#destroy

Answer 1

That's how it worked.

Controller:

def update
        if @doctype.update(title: params[:value])
        status = msg = 'ok' 
      else
        status = 'error'
        msg = @doctype.errors.full_messages.join(',')
      end

      if request.xhr?
        render :json => {
        :status => status,
        :msg => msg
      }
    end
  end

Html:

<% @doctypes.each do |doctype| %>
          <tr>
            <td>
              <div class="doctype_edit" data-type="text" data-url="/admin/doctypes/<%=doctype.id%>" data-name="title" data-pk=<%= doctype.id %> >
                <%= doctype.title%>
              </div>
            </td>

            <td>
                    <%= link_to '', :id => 'btn_remove_doctype', :data => { :path => admin_doctype_path(doctype), :toggle => 'modal', :target => '#modal_confirm_remove_doctype' }, :class => "btn btn-danger btn-xs" do %>
                  <span class='glyphicon glyphicon-remove'></span>
                <% end %>
            </td>
          </tr>
        <% end %>

Js code:

$.fn.editable.defaults.mode = 'inline';
$.fn.editable.defaults.ajaxOptions = {type: "PATCH"};
  $('.doctype_edit').editable({
    inputclass: 'inputdoctype',
    success: function(response, newValue) {
        if(response.status == 'error') {
            return response.msg;
        } else {
          $('this').html(newValue);
        }
    }
  });