0

I am working on an simple client/server communication with jquery/JS and PHP. It works fine till a '.' is included in the data.

Tried with the following titles:

  • asdf-wq1 --> works
  • test1 --> works
  • bigip1.local --> '.' is replaced with '_'

I already added the escape() function to my code, but the result was the same.

function xy(){
    for (var i = 0; i < nodes.length; i++) {
        var xy = escape(nodes[i].title) +"=" +escape(nodes[i].translate.x + "/" + nodes[i].translate.y);

        $.ajax({
            url: 'save_layout.php',
            data: xy,
            dataType: "text",
            type: 'post',
            success: function(output) {
                $("#output").html(output);
            },
            error: function (response, status, error) {
                alert("error" + response.responseText);
            }
        });
    }
}

PHP:

foreach($_POST as $name=>$value) {
     echo "$name $value \n";
}

Firebug Output Request:

POST http /frontend/save_layout.php

200 OK  186ms   
jquery....min.js (Zeile 4)
HeaderPostAntwortHTML
Parameterapplication/x-www-form-urlencoded
bigip1.local 470/390

Quelle
bigip1.local=470/390

Firebug Output (Response): 

bigip1_local 470/390

As you can see - it seems to be sent to the server correctly, but on the server as soon as reading our of $_POST - the '.' is a '_' at a sudden.

Hope someone can help me here!

Improve this question
2
  • Try letting jQuery do the encoding: var xy = {}; xy[nodes[i].title] = nodes[i].translate.x + "/" + nodes[i].translate.y; That way jQuery will string the post body for you. Commented Jan 6, 2013 at 14:25
  • hi! thx for the prompt response - but unfortunately i am still facing the same problem... i can see the correct value "bigip1.local" in the firebug post data, but in php i still get the "bigip1_local" as soon as i access $_POST... Commented Jan 6, 2013 at 14:39

3 Answers 3

Reset to default
3

You should not convert the data into a string manually. jQuery does that. Just pass an object instead of a string to the Ajax functions.

And you should never (never!) use escape(). This function is broken and there is no reason to use it. Use encodeURIComponent() in its place, if you must do manual URL encoding for some reason.

function xy(nodes) {
    $.each(nodes, function (i, node) {
        $.post("save_layout.php", {
            title: node.title,
            x: node.translate.x,
            y: node.translate.y
        })
        .done(function (output) {
            $("#output").html(output);
        })
        .fail(function (response, status, error) {
            alert("error" + response.responseText);
        });
    });
}

Also note a few other changes I've made to your code to make it more idiomatic in the context of jQuery:

  • The fact that the nodes are passed in as a parameter instead of a global variable. This makes the function more independent.
  • The use of $.each() to replace your for loop.
  • The use of the explicit $.post() instead of the more generic $.ajax().
  • The fact that all data is passed as a value, not as a key. The keys title, x, y will be the same for every request. This makes things easier on the server side (and on the client).
  • The use of .done() and .fail() callbacks that can be attached to .post(), .get() and .ajax() since their nature is that of a promise. You can read more about $.Deferred and promises or just take this as it is - a very convenient way of working with Ajax callbacks in jQuery.

You might want to think about refactoring the code to something that makes one Ajax request with all objects instead of one request for each object. HTTP requests take time, it's best to combine them.

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

+1 if this still doesn't solve the issue, then there is a problem on the PHP side.
it really seems to solve it - i will just test now and confirm and then accept the solution!! thx a lot!!
0
  1. escape is deprecated. better use encodeURIComponent.

  2. it your case just use jQuery functionality

    for (var i = 0, l = nodes.length; i < l; i++) {

    var data = {};
    data[nodes[i].title] = nodes[i].translate.x + "/" + nodes[i].translate.y;

    $.ajax({
        url: 'save_layout.php',
        data: data,
        dataType: "text",
        type: 'post',
        success: function(output) {
            $("#output").html(output);
        },
        error: function (response, status, error) {
            alert("error" + response.responseText);
        }
    });

}
Improve this answer

1 Comment

hi! thx for the prompt response! i like your approch since it is more straight forward - but unfortunately i am still facing the same problem... i added a window.console.log( [nodes[i].title] ); before the ajax request and it shows the correct value "bigip1.local", but in php i still get the "bigip1_local" as soon as i access $_POST...
-1

In your javascript code you could try using

JSON.stringify(values);

And then just json_decode() in your php.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.