Inline text change not updating on ajax request (but changes on DB)_问答_开发者

I'm using a script I found for changing a line of text on the go (you click on it and an input shows). It works fine without doing anything to the database but when I add my code for an update, it will update the DB but won't refresh the text after it submits. I'm totally lost now since I've been at it for hours, maybe I'm missing something very basic.

My JS:

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



$('.editable').inlineEdit({
    value: $.ajax({ data: { 'action': 'get' } }).r开发者_JAVA百科esponseText,
    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 shows me that after I update my text it returns OK and after I refresh the site it will show the updated text but not before. I started thinking this approach is too much hassle but after so much hours I feel like I'm one step from my solution...

EDIT:

I'm using this plugin: http://yelotofu.com/2009/08/jquery-inline-edit-tutorial/

And my html is just

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

Your code works fine for me....

Here's the demo app I put together (asp.net, but basically the same minus the database).

Just to be clear: Press Enter to save. Click off to cancel (since you removed the buttons).

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>

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]

Not sure what else to tell you, but maybe something here will give you an idea...

Inline text change not updating on ajax request (but changes on DB)

精彩评论

关注公众号

热门标签

图文推荐

Inline text change not updating on ajax request (but changes on DB)

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：