jQuery-Tabledit 在我编辑时抛出解析错误“JSON 输入的意外结束”

Question

我正在尝试实现 jQuery-Tabledit 插件来处理内联表字段编辑。问题是，当我编辑某些字段时，我的控制台抛出解析错误并且数据未更新。

这是我的代码：

$(document).ready(function(){
        $.ajaxSetup({
            headers: {
                'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $('#tabla_editable').Tabledit({
            url:'{{route("update_tarea")}}',
            dataType: 'text',
            columns: {
                identifier: [0, 'id'],
                editable: [[1, 'Nombre de Tarea'], [2, 'Descripción de Tarea']]
            },
            onFail: function(jqXHR, textStatus, errorThrown) {
                console.log('onFail(jqXHR, textStatus, errorThrown)');
                console.log(jqXHR);
                console.log(textStatus);
                console.log(errorThrown);
            },
            onAjax: function(action, serialize) {
                console.log('onAjax(action, serialize)');
                console.log(action);
                console.log(serialize);
            }
        });
    });

路线

    Route::post('update','adminProyectoController@update_tareas')->name('update_tarea');

和控制器

public function update_tareas(Request $request)
{
    \Log::info($request->all());
    //$tarea = Tarea::find($request->input('id'));
}

我做错了什么？请帮助

谢谢

Answer 1

我有一个类似的问题，并通过检查服务器端的响应并确保其有效的

JSON

触发

onSuccess

而不是

onFail

来设法克服它。我能够通过在我的服务器端文件中添加

echo json_encode($input);

来做到这一点。

js:

$('#data_table').Tabledit({
            deleteButton: true,
            editButton: true,
            restoreButton: false,
            columns: {
              identifier: [0, 'id'],
              editable: [[1, 'col1'], [2, 'col2']]
            },
            hideIdentifier: false,
            url: 'live_edit.php',
            onSuccess: function(data, textStatus, jqXHR) {
                alert('Updated!');
            },
            onFail: function(jqXHR, textStatus, errorThrown) {
              console.log('Error: ('+textStatus+') '+ errorThrown);
              console.log(jqXHR);
              //alert('Error: ('+textStatus+') '+ errorThrown+' => '+jqXHR);
            },
            onAjax: function(action, serialize) {
                // open your xhr here 
                console.log("on Ajax");
                console.log("action : ", action);
                console.log("data : ", serialize);
            }
          });

服务器代码：

<?php
include_once 'dbconnect.php';
$input = filter_input_array(INPUT_POST);
if ($input['action'] == 'edit') {
    $update_field='';
    if(isset($input['col1'])) {
        $update_field.= "col1='".$input['col1']."'";
    } else if(isset($input['col2'])) {
        $update_field.= "col2='".$input['col2']."'";
    }  

    if($update_field && $input['file_id']) {
        $sql_query = "UPDATE table_nameSET $update_field WHERE id='" . $input['id'] . "'";
        mysqli_query($con, $sql_query) or die("database error:". mysqli_error($con));
    }
    header('Content-type: application/json');
    echo json_encode($input);
}
?>

希望这有帮助。