1

我正在使用 remotipart 使用 ajax 上传和升级图像，问题是当我编辑项目时，ajax 会更新数据，但 remotipart(https://github.com/leppert/remotipart) 返回图像的“解析错误”更新。

这就是我的表单的样子：

= form_for(Achievement.new), html: {multipart: true , remote: true} do |f|
          = f.text_field :name
          = f.text_area :description
          = f.file_field :image
          = f.submit 'Send'

我正在使用一个表单来创建、编辑和删除“成就”。这是我的js：

constructor: ->
    $('.edit_button').click ->
      $.ajaxSettings.dataType = "json"
      @id = $(this).data('id')
      @content = $(this).parent()
      @name = $('.form_achievement #name')
      @description = $('.form_achievement #description')
      @image = $('.form_achievement .avatar img')
      @button = $('.form_achievement form input:submit')
      @form = $('.form_achievement form')

      #Load data to edit on form
      $.ajax
        type: 'get'
        url: "/en/private/achievements/#{@id}/edit/"

        success: (data) =>
          alert 'edit'
          @name.val(data.achievement.name)
          @description.val(data.achievement.description)
          @stat.html(data.achievement.stat)
          @value.val(data.achievement.value)
          @image.prop 'src', data.image

        #Change method of the form to put and bind event  
        $.ajaxSettings.dataType = "json"
        @form.attr('method','put')
        $('.form_achievement form').attr('action', "/en/private/achievements/#{@id}")
        $('#achievement_form.accordion .form_achievement').unbind('click', NewAchievement)

        @form.bind 'ajax:success', (xhr, data, status) =>
          @content.slideUp 'slow', ->
            $(this).remove()
          alert 'Edit'

        @form.bind 'ajax:error', (event, response, error) =>
          alert error
        @button.bind 'change', => @changeButton()


        error: (data) ->
          alert 'error'

  changeButton: ->
    @form.submit()

当我尝试在不更改图像的情况下进行编辑时，这解决了我的问题，但是当我尝试升级到新图像进行编辑时，返回“解析错误”。谁能帮我？

4

2 回答 2

5

您很可能会遇到解析错误，因为您的响应实际上是 HTML。

问题是，默认情况下，remotipart 假定服务器响应是 JS。您可以在呈现表单时设置数据类型，在您的情况下：

form_for(Achievement.new), html: {:'data-type' => :html, :multipart => true, :remote => true}

或者它可以像这样在 JS 中完成：

@form.bind 'ajax:remotipartSubmit', (event, xhr, settings) =>
    settings.dataType = "html *"
于 2013-05-24T01:02:34.950 回答
1

@stephencorwin 是正确的。Remotipart 使用隐藏的 iframe 来传输您的图像。作为编辑操作接收 html 请求的结果，您的服务器会返回一个 html 响应。Remotipart 足够聪明，可以将所需的 json 响应包装在 html 中，您可以使用它$.parseJSON(data.responseText)来获取 json。但是你的浏览器，它期望一个纯 json 响应，会抛出parserror.

我相信你可以简单地忽略这个错误。

于 2013-05-20T19:17:13.353 回答