title: How to override x-editable ajax response value?
body: <p>I am using x-editable to do inline editing. When I update the value via ajax and x-editable to get the response, I am finding it very difficult to override the div that contains the new x-editable value.</p>
  
  <p>For example, my x-editable link looks like this: </p>
  
  <pre><code> &lt;a href="#" id="freight"&gt;$100&lt;/a&gt;
  </code></pre>
  
  <p>I enter my edit in the pop-up that x-editable provides then enter the value 300.00</p>
  
  <p>When I do my edits, I proceed as follows: </p>
  
  <pre><code> $('#freight').editable({
              validate: function(value) {
                  if($.trim(value) == '') return 'This value is required.';
              },
              type: 'text',
              url: '{{ path('update_purchase_order_ajax') }}',
              pk: {{ purchaseOrder.id }},
              title: 'Enter Freight Value',
              ajaxOptions: {
                  dataType: 'json'
              },
              success: function(response, newValue) {
                  // Update the purchase order amounts...
                  $('#freight').html('$' + newValue);
              }
          });
  </code></pre>
  
  <p>When x-editable is finished, the value that shows up on the page is now 300.00 (without the $ dollar sign). As you can see in my jquery code, I am trying to override the value x-editable is putting on the page with $('#freight').html('$' + newValue);</p>
  
  <p>For some reason this is not working. I want $300.00 to show up, not 300.00.</p>