jquery editable ajax,jquery - How to override x-editable ajax response value? - Stack Overflow

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.

For example, my x-editable link looks like this:

$100

I enter my edit in the pop-up that x-editable provides then enter the value 300.00

When I do my edits, I proceed as follows:

$('#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);

}

});

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);

For some reason this is not working. I want $300.00 to show up, not 300.00.