Add parameters to POST data and submit

Question

Is it possible to add parameters to your php $_POST data through javascript before submitting the form without making individual hidden input tags?

I have a page that uses ajax (non-jQuery) which parses the innerText of <td> elements and sends them to a php page for processing.

I'm now going to make a .csv file from that data (via the php page) and I can no longer do that via ajax. Therefore, I have to submit the whole form and leave the page. When doing this, I don't know how to add parameters to the $_POST data like I did with ajax. When the form is submitted, it only processes the input tags and I can't add my custom data like I did with the ajax call.

Thanks!

EDIT: Ajax code as requested by Matthew

function generateReport(saveReport)
{   
    xmlHttp=GetXmlHttpObject();
    var params = [];

    if(saveReport !== undefined)
    {
        params.push("reportName=" + document.myForm.reportName.value);
    }

    if (xmlHttp==null)
    {
      alert ("Browser does not support HTTP Request");
      return;
    } 

    var cols = document.myForm.colsUsedSel;

    if(cols.options.length == 0)
    {
        alert("Please choose columns to view in the report.");
        return;
    }

    //Loop through display columns
    for(var i = 0; i < cols.options.length; i++)
    {
        params.push("displayCols[]=" + cols.options[i].value);
    }

    //Loop through <tr>'s of "where clause" table
    var trList = document.getElementById("clauseTable").childNodes;

    for(var x = 0; x < trList.length; x++)
    {
        var tdList = trList[x].childNodes;

        for(var y = 0; y < tdList.length; y++)
        {
            var tdType = tdList[y].getAttribute("class");

            //Check if there is a class for this <td>
            if(!!tdType)
                params.push(tdType + "=" + encodeURIComponent(tdList[y].innerText));            
        }
    }


    //Loop through <tr>'s of "order by" table
    var trList = document.getElementById("orderByTable").childNodes;

    for(var x = 0; x < trList.length; x++)
    {
        var tdList = trList[x].childNodes;

        for(var y = 0; y < tdList.length; y++)
        {
            var tdType = tdList[y].getAttribute("class");

            //Check if there is a class for this <td>
            if(!!tdType)
                params.push(tdType + "=" + encodeURIComponent(tdList[y].innerText));            
        }
    }

    if(document.myForm.generateCSV.checked)
        params.push("generateCSV=1");
    else
        params.push("generateCSV=0");

    params.push("sid="+Math.random());
    xmlHttp.onreadystatechange= stateChangedGenerate;
    xmlHttp.open("POST","reportBuilderDB.php",true);
    xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlHttp.send(params.join("&"));
}

You can submit a form w/o leaving a page. Set the `action=''` and attack an `onSubmit` handler. Inside the `onSubmit(event)` handler, calling `event.preventDefault` will stop the page from reloading. — Matthew Herbst, Jan 23 '16 at 03:56
Thanks Matthew, but my issue is more with getting the data to the other page. I have to do a full submit because I'm returning non-text headers and from what I've read, ajax won't make the file pop up. `header('Content-Type: application/csv'); header('Content-Disposition: attachment; filename="'.$filename.'";');` — mang, Jan 23 '16 at 04:04
Check out http://stackoverflow.com/questions/9713058/sending-post-data-with-a-xmlhttprequest — Matthew Herbst, Jan 23 '16 at 04:25
I need to submit the form though. When I try to do it with my ajax call, it just returns a comma list of my data instead of a csv file (with "Save As" prompt). See example here of what I'm trying to do on php side: http://stackoverflow.com/questions/217424/create-a-csv-file-for-a-user-in-php — mang, Jan 23 '16 at 04:34

Add parameters to POST data and submit

0 Answers0