将复选框数据从 html 网络表单保存到 Google 电子表格

Question

我的函数脚本运行良好，除了函数没有选择复选框值这一事实。相反，那些特定的列只是在电子表格单元格中显示未定义。我缺少什么功能会使其从 html Web 表单中选择复选框值？

我的 html 表单：

<form id="registration-form" action="https://script.google.com/macros/s/AKfycbx_fFp-WWHLvRV4SgSq-JPklxwZIyZnCD_04-zHzUYhjcwGpier/exec">
        <div class="grid-container">
            <div class="grid-x grid-padding-x">
                <div class="large-12 cell">
                    <fieldset>
                        <label>Check In:
                            <input type="date" name="checkin_date">
                        </label>
                    </fieldset>
                    <hr>
                    <fieldset>
                        <label>Check Out:
                            <input type="date" name="checkout_date">
                        </label>
                    </fieldset>
                    <hr>
                    <fieldset>
                        <legend>I will attend the IDIA meeting on 24<sup>th</sup> to 25<sup>th</sup> May</sup> (Please note this is a closed meeting for IDIA members only)</legend>
                        <input id="checkboxno" type="checkbox" name="attending_IDIA_meeting"><label for="checkboxno">Yes</label>
                        <input id="checkboxyes" type="checkbox" name="not_attending_IDIA_meeting"><label for="checkboxyes">No</label>
                    </fieldset>
                    <hr>
                    <fieldset>
                        <legend>I will take a transit hotel accommodation on:</legend>
                        <br>
                        <input id="checkbox1" type="checkbox" name="twenty"><label for="checkbox1" style="font-size: 16px;">20<sup>th</sup> May 2018</label>
                        <input id="checkbox2" type="checkbox" name="twenty_one"><label for="checkbox2" style="font-size: 16px;">21<sup>st</sup> May 2018</label>
                        <input id="checkbox3" type="checkbox" name="twenty_two"><label for="checkbox3" style="font-size: 16px;">22<sup>nd</sup> May 2018</label>
                        <input id="checkbox3" type="checkbox" name="twenty_three"><label for="checkbox3" style="font-size: 16px;">23<sup>rd</sup> May 2018</label>
                    </fieldset>
                    <hr>
                    <fieldset>
                        <label style="font-size: 15px;"> Transit Hotel Venue: (If invisible below, venue has been automatically set to Eka Hotel)
                            <input type="text" value="Eka Hotel" name="transit_venue" readonly>
                        </label>
                    </fieldset>
                    <hr>
                    <fieldset>
                        <legend>I will participate in the Learning visit on 24<sup>th</sup> May</legend>
                       <input id="attending_Learning_visit" type="checkbox" name="no"><label for="learningvisitno">Yes</label>
                    <input id="not_attending_Learning_visit" type="checkbox" name="yes"><label for="learningvisityes">No</label>
                    </fieldset>
                    <br>
                    <fieldset>
                        <label>Any other additional information you may wish to provide?
                            <textarea name="additional_info" rows="4"></textarea>
                        </label>
                    </fieldset>
                    <hr>
                    <button type="submit" class="button large expanded primary" style="background-color: #F26522;" id="submit-form">Submit</button>
                </div>
            </div>
        </div>
    </div>
</form>

jQuery/ajax 代码：

 <script type="text/javascript">
    var $form = $('form#registration-form'),
    url = 'https://script.google.com/macros/s/AKfycbx_fFp-WWHLvRV4SgSq-JPklxwZIyZnCD_04-zHzUYhjcwGpier/exec'
    $('#submit-form').on('click', function(e) {
        e.preventDefault();
        var jqxhr = $.ajax({
            url: url,
            method: "GET",
            dataType: "jsonp",
            data: $form.serializeObject()
        }).success(
        // will add my success message here
        );
    })
</script>

code.gs：

    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());
}

Answer 1

如果您希望它仅在选中复选框时写入值，请尝试为您的复选框元素添加 value 属性，例如

<input id="checkboxno" type="checkbox" name="attending_IDIA_meeting" value="true"><label for="checkboxno">Yes</label>

如果您希望它在选中或未选中时写入一个值，请考虑切换到选项输入。有关更多详细信息，请参阅jQuery serialize does not register checkboxes。无论如何，选项输入似乎更适合您的目的。