How to Pass variable from JavaScript to PHP Page using XMLHTTP -

this question has answer here:

• how pass javascript variables php? 12 answers

please read description before marking duplicate.

as far know, way pass data javascript php through ajax call.

my scenario this:

1. using php,i echo html page has javascript.

   <?php         $out .= '     <h3>upload new primary studies</h3>     <div>     <p> please select primary studies want upload:</p>     <table>     <form id="file-form" action="" method="post"> <tr><input type="file" id="file-select" name="userfile" multiple/>                  <button type="submit" id="upload-button"">upload</button>                  </tr>                </form>       </table>         </div>  <h3>view / edit primary studies</h3> <div id="grid1"></div> <script>  var form = document.getelementbyid("file-form"); var fileselect = document.getelementbyid("file-select"); var uploadbutton = document.getelementbyid("upload-button"); var today = new date(); var idvalue = 1;       var jsondata = {      header: []  };  var data1;  form.onsubmit = function(event) {   event.preventdefault();  // update button text. uploadbutton.innerhtml = "uploading...";   // selected files input. var files = fileselect.files; var file1 = files[0];  var = 1; var reader = new filereader(); reader.readastext(file1); reader.onload = function(event){     var csv = event.target.result;     var data = $.csv.toarrays(csv);     for(var row in data) {         if ( row == 0)             continue;         else         {             jsondata.header.push({                  "id" : idvalue,                 "refid" : 1,                 "reftype" : data[row][0],                 "recorddate" : new date().tojson().slice(0,10),                 "primaryauthors" : data[row][1],                 "primarytitle" : data[row][2],                 "fullperiodical" : data[row][3],                 "periodicalabbrev" : data[row][4],                 "pubyear" : data[row][5],                 "pubdate" : data[row][6],                 "volume" : data[row][7],                 "issue" : data[row][8],                 "startpage" : data[row][9],                 "otherpage" : data[row][10],                 "keywords" : data[row][11],                 "abstract" : data[row][12],                 "notes" : data[row][13],                 "personalnotes" : data[row][14],                 "secondaryauthors" : data[row][15],                 "secondarytitle" : data[row][16],                 "edition" : data[row][17],                 "publisher" : data[row][18],                 "placepub" : data[row][19],                 "tertiaryauthors" : data[row][20],                 "quaternaryauthors" : data[row][21],                 "quinaryauthors" : data[row][22],                 "tertiarytitle" : data[row][23],                 "issn" : data[row][24],                 "availability" : data[row][25],                 "address" : data[row][26],                 "accnumber" : data[row][27],                 "language" : data[row][28],                 "classification" : data[row][29],                 "subfile" : data[row][30],                 "orgforiegntitle" : data[row][31],                 "url" : data[row][32],                 "doi" : data[row][33],                 "callnumber" : data[row][34],                 "database" : data[row][35],                 "datasource" : data[row][36],                 "identphrase" : data[row][37],                 "retdate" : data[row][38]             });             idvalue++;         }     }         data1 = jsondata;         //alert(json.stringify(data1));         $("#grid1").iggrid("datasourceobject", data1);         $("#grid1").iggrid("databind");      }       uploadbutton.innerhtml = "upload complete"; }  // call grid json data $( document ).ready(grid1()); var request; function createdbrows() {     var r = confirm("do want create records in database");      var url = "/_application/model/dataaccess/insertstudies.php?json=";     if (r == true) {          alert("you pressed ok!");         // database of grid         var dbsource = $("#grid1").iggrid().data().iggrid.datasourceobject();        } else {        alert("you pressed cancel!");     } } </script> <br> <br>  <div>  <button type="submit" id="upload-button"" onclick="createdbrows()">create  database rows</button>  <button type="clear" id="clear-button"">clear</button>     <button type="cancel" id="cancel-button"">cancel</button> </div> '; 

2. steps application are:

   1. upload csv file.
   2. data csv file displayed in iggrid.
   3. user modifies data & saves on grid.
   4. once user done modification, user clicks on create db rows button
   5. on click of above button, data source should pass php page: insertstudies.php

my problem:

i stuck @ point 2.e not able create ajax call , send data php page. can point source or give example can explain way pass data using javascript php page php page.

what asking ajax post method.

you can either send data php page via json array or form serialize.

the function returns data "echoed" php page tag class of result

$.post("path/yourphppage.php",{key: 'value'}, function( data ) {   $( ".result" ).html( data ); });