x-editable ajax call does not process the designated url

Question

Im using bootstrap with x-editable and im trying to get it working once the save button from x-editable is clicked the php file should be executed.

Ive tried everything within my knowledge to fix this but im not a hardcore javascript programmer so changing it to Json to give it a try is to my perspective a little much effort.

Ive read the documentation of x-editable and this should be the way to work with it.

So here is the html:

  <a href="#" class="username">superuser</a> 

The Javascript:

      $.fn.editable.defaults.mode = 'inline';

      $('.username').editable({
           type: 'text',
           pk: 1,
           url: 'post.php',
         });

Once the post.php is missing x-editable gives an error , however if it sees the php file it does nothing. the contents from the php file are irrelevant because there is only a console log with test in it there.

The console log is never executed and i cant figure out why it is not working, I've seen 1 or 2 problems like thing one on Stackoverflow etc however no use full information.

This is the first time ever i had to ask something on the internet so i hope someone can help me with this one.

I've tried things like changing the url to localhost/dir/etc however no effect. also setting /posturl, and adding var posturl = "post.php"; didn't help

oh and I've tested all the resources : but if it helps here:

<!-- Le styles -->  
<!-- jQUERY -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Sharre -->
<script src="recources/assets/js/jquery.sharrre-1.3.4.js"></script>
<!-- Minnified bootstrap -->
<script src="recources/assets/min/js/bootstrap.min.js"></script>
<!-- Custom CSS -->
<link href="recources/assets/css/pagestyle.css" rel="stylesheet">
<!-- X - Editable -->
<link href="recources/assets/css/bootstrap-editable.css" rel="stylesheet">
<!-- External link -->
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.4.4/bootstrap-editable/js/bootstrap-editable.min.js"></script>

Answer 1

Use send parameter as it can determine Strategy for sending data to server. It Can be auto | always | never. When 'auto' data will be sent on server only if pk and url defined, otherwise new value will be stored locally.

You can set it for all inputs by this code:

$.fn.editable.defaults.send = "always";

Or Customize each input for related strategy like this:

$('.username').editable({
    send: 'always'
});

Answer 2

Have you tried modifying the send option ?

$('.username').editable({
    type: 'text',
    pk: 1,
    url: 'post.php',
    send: 'always'
});

Otherwise try debugging the unminified version bootstrap-editable.js and add a breakpoint here https://github.com/vitalets/x-editable/blob/master/src/editable-form/editable-form.js#L189. I had a similar issue and that's what I did. Hope that helps.