javascript - x-editable 的成功回调不起作用

Question

我已经能够成功实现 x-editable 以创建新用户并随后将更改发布到数据库。在这方面一切正常。

我想使用一个字段的数字条目并对其进行一些算术运算并将结果显示在不同的 div 中。

我创建了这个 fiddle :http://jsfiddle.net/Mdcfh/

显示我的设置。这个 fiddle 工作正常，但是当我在我的代码中实现完全相同时，回调中没有任何反应。

我在下面附加了我的代码的相关部分:

HTML

<div id="msg_units" style="display:none">Saved!</div>
<table class="table table-condensed table-hover">
<thead>
<tr>
<td class="text-left hide800"><strong>Name</strong></td>
<td class="text-center"><strong>Price</strong></td>
<td class="text-center"><strong>Quantity</strong></td>
<td class="text-right"><strong>Totals</strong></td>
</tr>
</thead>
<tbody>
<tr>                         
<td class="text-left hide800"><?php echo $_REQUEST['title']?></td>
<td class="text-center"><i class="fa fa-inr"></i><strong><span class="price"     id="unit_cost"><?php echo $_REQUEST['cost']?></span></strong></td>
<td class="text-center"><a href="#" class="myeditable qty" id="num_units" data-type="text" data-pk="3" data-name="num_units" data-title="How many are going?"></a></td>
<td class="text-right"><i class="fa fa-inr"></i><strong><a href="#" id="exp_total"></a>        </strong></td>
</tr></tbody></table>

JS

//editables 
$('#num_units').editable({
 url: 'post.php',
 ajaxOptions: { dataType: 'json' },
display: function(value, response) {
return false;   //disable this method
},
success: function(response, newValue) {
      var current_pk = $(this).data('pk');
      $('#exp_total').html(3*7200);
        $('#msg_units').text(current_pk).show();
        if (response && response.units) {
        $('#msg_units').text(response.units*5).show();
    }   
}
});

POST.PHP

$result = mysql_query('update mytable set '.mysql_escape_string($name).'="'.mysql_escape_string($value).'" where id = "'.mysql_escape_string($pk).'"');

  $yes[] = array(
    'success' => 'true',
    'msg' => 'update success for',
    'value' => $value
    );

  if ($result != false) {
    // echo json_encode($yes);
    echo '{"units": "3"}';
    // echo '{"success": "true"}';
  } else {
    $no[] = array(
      'success' => 'false',
      'msg' => 'update failed for' .mysql_escape_string($name),
      'value' => $value
      );
    echo json_encode($no);
  }

post.php 代码正在运行，我所有的可编辑内容都已成功更新。但是我根本无法使成功回调工作。成功回调中编写的所有语句都不起作用(尽管它们在浏览器控制台中起作用)。

这是另一个使用真实代码的 fiddle 。 fiddle :http://jsfiddle.net/8meZ8/1/

我对此很陌生，我确信有一些明显的遗漏。任何帮助将不胜感激!提前致谢!!

更新@brutallord

我在我的 post.php 中使用它来生成响应:

  $yes[] = array(
    'success' => 'true',
    'msg' => 'update success for',
    'value' => $value
    );

  if ($result != false) {
    echo json_encode($yes);
    //echo '{"units": 3}';
    // echo '{"success": "true"}';
  } else {
    $no[] = array(
      'success' => 'false',
      'msg' => 'update failed for' .mysql_escape_string($name),
      'value' => $value
      );
    echo json_encode($no);
  }

我想强调的是，提交新用户可以正常工作。在这种情况下，我将发布到另一个文件 newuser.php，该文件发送如下给出的响应:

if ($result != false) {
     echo '{"id": '. mysql_insert_id() .'}';
} else {
     echo "Error:" . $maxid . $_POST['buyer_email'] . $_POST['buyer_contact_no'] . $_POST['buyer_full_name'];
}

newuser 的成功回调函数对上述响应非常有用。

Answer 1

我找到了解决方案:

这是 Javascript 代码流的明显错误。 Editables 似乎对此特别挑剔。以正确的顺序(按照预期的运行顺序)移动代码块(可编辑声明)，一切都开始正常工作。

特殊情况需要突出显示 - 如果像这样在代码中更早地启动可编辑，

$(selector).editable({
url: 'post.php',
})

确保验证/成功/错误代码就在它下面，以避免像我遇到的代码流问题。理想情况下会建议，跳过单独的初始化。只需在开头声明全局变量，然后在下面使用可编辑项。

感谢大家的回复。