All I am trying to do is to build an object from the input elements typed in by the user without them clicking submit. These functions supposed to do the job, except I am not getting the $_POST array correctly at the host page:
I started out thinking I can create a simple json object and stringify it then ajax it as a 'json' datatype. That did not work. I kept getting parser errors, 'unexpected character ..'. I used an outside parser to check the generated object, and it was valid every time. So I modified my serialization to create a jquery.param object as you see below.
The output in console.log looks like this:
[ [{ hostname: 'myhostname'}, {userdb1:'mydbname'}, {adminname:'guest'}, {adminpassword:'abc123'}, {username:'muuser'}, {password:'myuser'} ]
The var_dump[$_POST] at the host is this:
Array ( [0] => [ [1] => { [2] => [3] => h [4] => o [5] => s [6] => t [7] => n [8] => a [9] => m [10] => e [11] => : [12] => [13] => ' [14] => m [15] => y [16] => h [17] => o [18] => s [19] => t [20] => n [21] => a [22] => m [23] => e [24] => ' [25] => } [26] => , [27] => [28] => { [29] => u [30] => s [31] => e [32] => r [33] => d [34] => b [35] => 1 [36] => : [37] => ' [38] => m [39] => y [40] => d [41] => b [42] => n [43] => a [44] => m [45] => e [46] => ' [47] => } [48] => , [49] => [50] => { [51] => a [52] => d [53] => m [54] => i [55] => n [56] => n [57] => a [58] => m [59] => e [60] => : [61] => ' [62] => g [63] => u [64] => e [65] => s [66] => t [67] => ' [68] => } [69] => , [70] => [71] => { [72] => a [73] => d [74] => m [75] => i [76] => n [77] => p [78] => a [79] => s [80] => s [81] => w [82] => o [83] => r [84] => d [85] => : [86] => ' [87] => a [88] => b [89] => c [90] => 1 [91] => 2 [92] => 3 [93] => ' [94] => } [95] => , [96] => [97] => { [98] => u [99] => s [100] => e [101] => r [102] => n [103] => a [104] => m [105] => e [106] => : [107] => ' [108] => m [109] => u [110] => u [111] => s [112] => e [113] => r [114] => ' [115] => } [116] => , [117] => [118] => { [119] => p [120] => a [121] => s [122] => s [123] => w [124] => o [125] => r [126] => d [127] => : [128] => ' [129] => m [130] => y [131] => u [132] => s [133] => e [134] => r [135] => ' [136] => } [137] => [138] => ] )
what is going on here. need to get a $_POST array of these key/value simple user created object without form serialization!
Here are the functions
function savePageInputs(idtags,targetOutId)
{
var method = 'post';
var phpscript = 'savedata.php';
var data = new Array();
for(var i=0;i<idtags.length;i++)
{
tag = idtags[i];
data[i] = $(\"#\"+tag).val(); //get their values
}
jsonData = makeJsonData(idtags,data); //make JSON object
shipJsonToHost(jsonData, phpscript, method, targetOutId);
}
function makeJsonData(idtags,values)
{
tag = idtags[0];
val = values[0];
jsonData = '[{ '+ tag +': '+'\''+val+'\'}' ;
for(var i=1;i<idtags.length;i++)
{
tag = idtags[i];
val = valueList[i];
jsonData += ', {' + tag+':'+ '\''+val+'\'}' ;
}
jsonData += ' ]' ;
return jsonData;
}
function shipJsonToHost(jsonData, phpscript, method, targetOutId)
{
jQuery.ajaxSettings.traditional = true;
var outputTo = $(\"#\"+targetOutId);
outputTo.append('<center>Processing...<br/> <img src=\"images/loading.gif\" height=50 width=50></center>');
$.ajax
(
{
data: $.param(jsonData) ,
type: method,
dataType: 'text',
url: phpscript,
success: function(response)
{
outputTo.empty();
outputTo.append(response);
},
error: function(request, errorType, errorThrown)
{
outputTo.html('Error: '+errorType+ ' '+errorThrown);
}
}
);
}