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

Posted 2023-05-08

【中文标题】x-editable 的成功回调不起作用

【英文标题】：Success callback of x-editable is not working

【发布时间】：2014-04-30 16:49:35

【问题描述】：

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

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

我创建了这个小提琴：http://jsfiddle.net/Mdcfh/

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

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

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 代码正在运行，我的所有可编辑内容都已成功更新。但是我根本无法使成功回调起作用。成功回调中编写的所有语句都不起作用（尽管它们在浏览器控制台中起作用）。

这是另一个使用真实代码的小提琴。小提琴：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 的成功回调函数与上述响应的作用类似。

【参考方案1】：

我想出了解决办法：

这是 javascript 代码流的明显错误。 Editables 似乎对此特别挑剔。以正确的顺序（按照预期的运行顺序）移动了代码块（可编辑的声明），一切都开始像魅力一样工作了。

需要突出显示特定案例 - 如果可编辑在代码的前面启动，像这样，

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

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

感谢大家的回复。

【讨论】：

您能在此处的代码块中输入完整的解决方案代码吗？当您提到将成功代码放在“正下方”时，我不明白您的意思。

我实际上只是为我的案例解决了这个问题。成功回调没有被触发，但是一旦我将函数定义嵌套在 ajaxOptions 参数中，它就会触发。

【参考方案2】：

似乎是这样，成功回调使用来自服务器的答案作为 JSON，但可能是您没有发送：

header('Content-type:application/json')

?

【讨论】：

我从 post.php 发送响应为 json_encode($arr)。此外，我尝试在函数中指定 ajaxoptions，如下所示： ajaxOptions: dataType: 'json', contentType: 'Content-type:application/json' 按照以下说明：vitalets.github.io/x-editable/docs.html 但无济于事。

是的，我明白这一点。但您可能需要在 php.ini 中设置额外的响应标头。这使得响应被解释为 JSON 字符串，而不是纯文本。 无论如何，如果您显示将哪些参数传递给成功回调并在网络面板上显示ajax查询详细信息会很好

我明白了。我用与您的评论相关的代码更新了我的问题 - @brutallord

好的。如果您显示将哪些参数传递给成功回调会很有帮助，或者它根本不起作用？和网络查询标头虽然很有帮助

如上面的代码所示，我将成功、消息和值作为 json 传递给回调。我也尝试了各种其他组合。而且我甚至可以使用简单的 echo '"id": '。 mysql_insert_id() .'';也是。但是这里的成功回调拒绝工作。我不确定您所说的网络查询标头是什么意思。对不起。您能否详细说明我如何找到它？

【参考方案3】：

<?php
$yes = array('success' => true,'msg'=>'Done');
$no = array('success' => false,'msg'=>'no');

header('Content-type:application/json');
echo json_encode($yes);

还有js代码

$('tr #name,tr #job').editable(
    type:'text',
    ajaxOptions:  dataType: 'json' ,
    url: 'editable-request/update-trainee.php',
    display: function(value, response) 
    return false;   //disable this method
  ,
    success: function(response, newValue) 
if(!response.success) 
  return response.msg;
else
  alert(response.msg);
  );

这对我有用

【讨论】：

您似乎忘记了最后一个右括号。格式化你的 JS 看看有什么问题 - jsbeautifier.org

是的..谢谢