将POST发送到Sheet正在返回" undefined"细胞

时间:2017-02-22 23:33:26

标签: javascript jquery google-apps-script google-sheets-api

我正在向Google表格发送帖子请求 在我的POST中,我发送的是用户输入的值。

每次运行程序时,都会将正确的数据输入到我的工作表中。但是,我还会在每个单元格中返回多行,值为undefined。我没有做任何循环所以我不确定为什么会发生这种情况。

HTML:

<form id='foo'>
    <p><label>*</label><input type="text" id ="Gross_Sales"     name="Gross Sales"  class = "input_text"> Gross Sales</input><br><br></p>
    <p><label>*</label><input type="text" id ="Tax"             name="Tax"          class = "input_text"> Tax</input><br><br></p>
    <p><label> </label><input type="text" id ="net_s"           name="Net Sales"    class = "input_text"> Net Sales</input><br><br></p>
    <p><label>*</label><input type="text" id ="cc"          name="Credit Card"  class = "input_text"> Credit Card</input><br><br></p>
    <button onclick="sendData()">button</button>
</form>

的Javascript / Jquery的:

function sendData() {

    $("#foo").submit(function(event) {

        // Abort any pending request
        if (request) {
            request.abort();
        }
        // setup some local variables
        var $form = $(this);

        // Let's select and cache all the fields
        var $inputs = $form.find("input");

        // Serialize the data in the form
        var serializedData = $form.serialize();

        // Let's disable the inputs for the duration of the Ajax request.
        // Note: we disable elements AFTER the form data has been serialized.
        // Disabled form elements will not be serialized.
        $inputs.prop("disabled", true);

        // Fire off the request to /form.php
        request = $.ajax({
            url: "https://script.google.com/macros/s/{id}/exec",
            type: "post",
            data: serializedData

        });
        console.log(serializedData);
        // Callback handler that will be called on success
        request.done(function(response, textStatus, jqXHR) {
            // Log a message to the console
            console.log("Hooray, it worked!");
            console.log(response);
            console.log(textStatus);
            console.log(jqXHR);
        });

        // Callback handler that will be called on failure
        request.fail(function(jqXHR, textStatus, errorThrown) {
            // Log the error to the console
            console.error(
                "The following error occurred: " +
                textStatus, errorThrown
            );
        });

        // Callback handler that will be called regardless
        // if the request failed or succeeded
        request.always(function() {
            // Reenable the inputs
            $inputs.prop("disabled", false);
        });

        // Prevent default posting of form
        event.preventDefault();
    });
}

图片显示Google表格 Image Showing Google Sheet

Google脚本

//  1. Enter sheet name where data is to be written below
var SHEET_NAME = "Sheet1";

//  2. Run > setup
//
//  3. Publish > Deploy as web app
//    - enter Project Version name and click 'Save New Version'
//    - set security level and enable service (most likely execute as 'me' and access 'anyone, even anonymously)
//
//  4. Copy the 'Current web app URL' and post this in your form/script action
//
//  5. Insert column names on your destination sheet matching the parameter names of the data you are passing in (exactly matching case)

var SCRIPT_PROP = PropertiesService.getScriptProperties(); // new property service

// If you don't want to expose either GET or POST methods you can comment out the appropriate function
function doGet(e) {
    return handleResponse(e);
}

function doPost(e) {
    return handleResponse(e);
}

function handleResponse(e) {
    // shortly after my original solution Google announced the LockService[1]
    // this prevents concurrent access overwritting data
    // [1] http://googleappsdeveloper.blogspot.co.uk/2011/10/concurrency-and-google-     apps-script.html
    // we want a public lock, one that locks for all invocations
    var lock = LockService.getPublicLock();
    lock.waitLock(30000); // wait 30 seconds before conceding defeat.

    try {
        // next set where we write the data - you could write to multiple/alternate destinations
        var doc = SpreadsheetApp.openById(SCRIPT_PROP.getProperty("key"));
        var sheet = doc.getSheetByName(SHEET_NAME);

        // we'll assume header is in row 1 but you can override with header_row in      GET/POST data
        var headRow = e.parameter.header_row || 1;
        var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
        var nextRow = sheet.getLastRow() + 1; // get next row
        var row = [];
        // loop through the header columns
        for (i in headers) {
            if (headers[i] == "Timestamp") { // special case if you include a 'Timestamp' column
                row.push(new Date());
            } else { // else use header name to get data
                row.push(e.parameter[headers[i]]);
            }
        }
        // more efficient to set values as [][] array than individually
        sheet.getRange(nextRow, 1, 1, row.length).setValues([row]);
        // return json success results
        return ContentService
            .createTextOutput(JSON.stringify({
                "result": "success",
                "row": nextRow
            }))
            .setMimeType(ContentService.MimeType.JSON);
    } catch (e) {
        // if error return this
        return ContentService
            .createTextOutput(JSON.stringify({
                "result": "error",
                "error": e
            }))
            .setMimeType(ContentService.MimeType.JSON);
    } finally { //release lock
        lock.releaseLock();
    }
}

function setup() {
    var doc = SpreadsheetApp.getActiveSpreadsheet();
    SCRIPT_PROP.setProperty("key", doc.getId());
}

0 个答案:

没有答案