更改发送到服务器的x-editable值

时间:2015-05-01 14:35:18

标签: jquery x-editable

我希望更改x-editable发送到服务器的值,但是,希望x-editable像往常一样更新原始元素文本(即使用输入的值)。

我想出了一个解决方案,但是,我不相信我这样做是正确的。该怎么做呢?

http://jsfiddle.net/oqLj9xLd/1/

    require_once('db_config.php');

$sql = "SELECT * FROM routes";
$stmt = $conn->prepare($sql);
$stmt->execute();

echo '<table class="table table-striped table-bordered" id="basic-datatable" border="0" cellpadding="10">';
echo '<thead><tr><th>Business ID</th><th>Business Type</th><th>Price</th><th>Down Payment</th><th>Weekly Net</th><th>City</th><th>State</th><th>Business Description</th></tr></thead>';
echo '<tbody>';
while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
{
    echo "<tr>";
    echo '<td>' . $row['route_id'] . '</td>';
    echo '<td><a href="detail.php?id=' . $row['id'] . '">' . $row['route_title'] . '</a></td>';
    echo '<td>$' . $row['total_price'] . '</td>';
    echo '<td>$' . $row['down_payment'] . '</td>';
    echo '<td>$' . $row['weekly_net'] . '</td>';
    echo '<td>' . $row['city'] . '</td>';
    echo '<td>' . $row['state'] . '</td>';
    echo '<td>' . $row['remarks'] . '</td>';
    echo "</tr>";
}
echo '</tbody>';
echo '</table>';

2 个答案:

答案 0 :(得分:0)

我需要将用户友好的日期时间格式的文本更改为服务器的unix时间戳。这是我(更轻松)的解决方案:

var setupTimeOffset = $(`<div>My Time:<a>${timestampToText(setup.timeOffset)}</a></div>`);
setupEditableDateTime(setupTimeOffset.find('a'), 'timeOffset');

/* ... */

function setupEditableDateTime(control, field) {
    control.editable({
        type: 'text',
        send: 'always',
        mode: 'inline',
        url: 'ajax.php?action=updateSetup',
        params: function(params) {
            delete params.pk;
            delete params.name;
            params.field = field;
            params.value = textToTimestamp(params.value);
            return params;
        },
        success: function(response, newValue) { console.log(response); },
        error: function(response, newValue) {},
    });
}

function textToTimestamp(dateTimeText) {
    var reggie = /(\d{2}).(\d{2}).(\d{4}) (\d{2}):(\d{2}):(\d{2})/;
    var dateArray = reggie.exec(dateTimeText); 
    var dateObject = new Date(
        (+dateArray[3]),
        (+dateArray[2])-1, // Careful, month starts at 0!
        (+dateArray[1]),
        (+dateArray[4]),
        (+dateArray[5]),
        (+dateArray[6])
    );
    return dateObject.getTime()/1000;
}

function timestampToText(UNIX_timestamp){
    var a = new Date(UNIX_timestamp * 1000);
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    var year = a.getFullYear();
    var month = ("0" + (a.getMonth() + 1)).slice(-2);
    var date = ("0" + a.getDate()).slice(-2);
    var hour = ("0" + a.getHours()).slice(-2);
    var min = ("0" + a.getMinutes()).slice(-2);
    var sec = ("0" + a.getSeconds()).slice(-2);
    var time = date + '.' + month + '.' + year + ' ' + hour + ':' + min + ':' + sec ;
    return time;
}

我还删除了pk和name字段,因为出于我的目的它们不是必需的。

答案 1 :(得分:-1)

.validate()方法纯粹是为验证而设计的。您不应该将其用作修改数据的方法。请考虑使用params选项,而不是将其作为回调提供。

例如,如果您要修改字段my_field并发送{a:1, b:2, c:3}以及新值,则可以添加以下代码:

 $.fn.editable.defaults.params = function(params) {
     if (params.name === 'my_field') {
         params.value = 'new value';
     }
     params.a = 1; 
     params.b = 2; 
     // ...

     return params;
 };

这样您就可以在不更改用户输入的情况下更改提交的数据。