内联文本更改不会更新ajax请求(但更改数据库)

时间:2011-06-21 15:45:56

标签: php jquery ajax

我正在使用我找到的脚本来改变一行文本(点击它并输入显示)。它工作正常而不对数据库做任何事情但是当我添加我的代码进行更新时,它将更新数据库,但在提交后不会刷新文本。我已经完全迷失了,因为我已经好几个小时了,也许我错过了一些非常基本的东西。

我的JS:

$.ajaxSetup({
    url: '/ajax/nombreruta.php',
    type: 'POST',
    async: false,
    timeout: 500
});



$('.editable').inlineEdit({
    value: $.ajax({ data: { 'action': 'get' } }).responseText,
    buttons: '',
    cancelOnBlur: true,
    save: function(event, data) {
        var html = $.ajax({
            data: { 'action': 'save', 'value': data.value }
        }).responseText;

        //alert("id: " + this.id );

        return html === 'OK' ? true : false;
    }
});

nombreruta.php:

<?php session_start();

$action = isset($_POST) && $_POST['action'] ? $_POST['action'] : 'get';
$value  = isset($_POST) && $_POST['value'] ? $_POST['value'] : '';

include $_SERVER['DOCUMENT_ROOT'] ."/util-funciones.php";//for my db functions

$cnx=conectar();
$sel="select * from ruta where id_ruta='".$_SESSION['ruta']."'";

$field=mysql_query($sel, $cnx);
if($row=mysql_fetch_object($field)){
$data = $row->nombre;
}

switch ($action) {

// retrieve data
case 'get':
    echo $data;
    break;

// save data
case 'save':
    if ($value != '') {


        $sel="update ruta set nombre='".$value."' where id_ruta=".$_SESSION['ruta'];
        mysql_query($sel,$cnx) or die(mysql_error());

        $_SESSION['data'] = $value;

        echo "OK";
    } else {
        echo "ERROR: no se han recibido valores.";
    }
    break;

// no action
default:
    echo "ERROR: no se ha especificado accion.";
    break;
}

Firebug告诉我,在我更新文本后,它返回OK,在刷新网站后,它将显示更新的文本,但之前没有。我开始认为这种方法太麻烦了,但经过这么多时间后,我觉得我离解决方案只有一步......

编辑:

我正在使用此插件:http://yelotofu.com/2009/08/jquery-inline-edit-tutorial/

我的HTML只是

 <span class="editable">Text</span>

1 个答案:

答案 0 :(得分:1)

你的代码对我来说很好....

这是我放在一起的演示应用程序(asp.net,但基本上相同的减去数据库)。

要清楚:按Enter保存。单击关闭取消(因为您删除了按钮)。

<强> HTML

<html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" ></script>
    <script type="text/javascript" src="https://raw.github.com/caphun/jquery.inlineedit/master/jquery.inlineedit.js"></script>
    <script type="text/javascript">
        $(function(){
            $.ajaxSetup({
                url: 'Test.ashx?' + window.location.search.substring(1),
                type: 'POST',
                async: false,
                timeout: 500
            });

            $('.editable').inlineEdit({
                value: $.ajax({ data: { 'action': 'get'} }).responseText,
                buttons: '',
                cancelOnBlur: true,
                save: function (event, data) {
                    var html = $.ajax({
                        data: { 'action': 'save', 'value': data.value }
                    }).responseText;
                    return html === 'OK' ? true : false;
                }
            });
        });
    </script>
  </head>
  <body>
    <span class="editable">Test 1</span>
  </body>
</html>    

<强> C#

public void ProcessRequest(HttpContext context)
{
    //Custom Object to Get and Format my Connection String from the URL
    QueryStringObjects QSO = new QueryStringObjects(context.Request, "InlineAjaxTest");

    //Look for any GET or POST params named 'action'
    switch (context.Request.Params["action"])
    {
        //If 'action' = 'save' then....
        case "save":
            //Open a connection to my database (This is a custom Database object)
            using (DataBrokerSql SQL = GetDataBroker(QSO.Connstring))
            {
                //Create a SQL parameter for the value of the text box
                DbParameter[] Params = {
                    new SqlParameter("@val", context.Request.Params["value"])
                };
                //Execute an Insert or Update
                SQL.ExecSQL(@"UPDATE
                                    Test_InlineAJAX
                                SET
                                    Value = @val
                                IF @@ROWCOUNT=0
                                    INSERT INTO
                                    Test_InlineAJAX
                                    VALUES
                                    (@val)", Params);

            }
            //Return OK to the browser
            context.Response.Write("OK");
            break;
        default:
            //Open a connection to my database
            using (DataBrokerSql SQL = GetDataBroker(QSO.Connstring))
            {
                //Get Value from my table (there's only one row so no need to filter)
                object obj = SQL.GetScalar("Select Value From Test_InlineAJAX");
                //If my value is null return "" if not return the value of the object
                context.Response.Write(obj != null ? obj.ToString() : "");
            }
            break;
    }
}

<强> SQL

CREATE TABLE [dbo].[Test_InlineAJAX](
    [Value] [varchar](255) NULL
) ON [PRIMARY]

不知道还有什么要告诉你的,但也许这里有些东西可以给你一个想法...