Question

I’m trying to use the data of a form to create a JSON file that I can use in other pages of my app.

I’m using JQuery Mobile and its POST method.
But I don’t manage to have any kind of results and I don’t know why.
This is my code.

<form id="#formK">
    <label>Text
        <input type="text" name="header" />
    </label>
    <div data-role="button" id="save" />Save</div>
</form>

<script type="text/javascript">

$("#save").click( function(){
    $.post("OptJson.php", {head : $('[name=header]').val(); }, json );
});

</script>

And this is the source of my OptJson.php page

<?php
echo $_POST['head'] ;    
?>

Where are the errors ? Thanks

Answer 1

Try removing the semi-colon from head : $('[name=header]').val();

If I run your code in my Chrome browser I get the following message: SyntaxError: Unexpected token ;. The semi-colon is a statement terminator and you don’t want to terminate that statement, you just want to call the function and use the result as an argument.

The argument you are sending is a JavaScript object, and you construct it like this:

var myObject = {
   data: "stuff",
   otherData: getStuff()
};

Not like this:

//THIS IS WRONG
var myObject = {
   data: "stuff";
   otherData: getStuff();
};
//THIS IS WRONG

Notice the different use of semi-colons.

Edit: Also, the dataType parameter has to be specified as a string, so "json", not json.

I would strongly recommend you use the web developer tools that exist in most modern browsers (I prefer Chrome’s, but Firefox has good ones too). Check the “Console” tab and see what errors the browser reports. It will help tons when debugging your JavaScript code.

Edit2: If you want to actually see the data returned you have to use the success callback like so:

$.post("OptJson.php", {head : $('[name=header]').val() }, function(data){
    alert(data); //do stuff with returned data
}, "json");