Question

问题摘要

我试图将一对值（跟踪号和运营商代码）作为对象传递到jQuery ajax调用中，但是我收到一个参考错误：“ ReferenceError：未定义结果”

背景

值源自表单内的输入。下面的示例具有一对值（1-跟踪号和1-携带的代码）。

<form role="form" class="pt-3">
            <div class="form-group row">
                <div class="col-sm-6 both">
                    <fieldset>
                        <input class="form-control trackingNumber" id="tracking-number" name="tracking_number" type="text" placeholder="Enter Tracking Number (ie: 712345362789)"
                            value="">
                        <input class="form-control carrierCode" id="carrier-code" name="carrier_code" type="text" placeholder="Enter Carrier Code (ie: UPS, FedEx, USPS)"
                            value="">
                </div>
                <button class="tracking-button pulse-button" type="button" value='send' id="submit" onclick="UserParams()">Track Now</button>
            </div>
        </form>

下面的示例包含多对值（2个-跟踪号和2个-携带的代码）。

<form role="form" class="pt-3">
            <div class="form-group row">
                <div class="col-sm-6 both">
                    <fieldset>
                        <input class="form-control trackingNumber" id="tracking-number" name="tracking_number" type="text" placeholder="Enter Tracking Number (ie: 712345362789)"
                            value="">
                        <input class="form-control carrierCode" id="carrier-code" name="carrier_code" type="text" placeholder="Enter Carrier Code (ie: UPS, FedEx, USPS)"
                            value="">
                    </fieldset>
                </div>
                <div class="col-sm-6 both">
                    <fieldset>
                        <input class="form-control trackingNumber" id="tracking-number" name="tracking_number" type="text" placeholder="Enter Tracking Number (ie: 712345362789)"
                            value="">
                        <input class="form-control carrierCode" id="carrier-code" name="carrier_code" type="text" placeholder="Enter Carrier Code (ie: UPS, FedEx, USPS)"
                            value="">
                    </fieldset>
                </div>
                <button class="tracking-button pulse-button" type="button" value='send' id="submit" onclick="UserParams()">Track Now</button>
            </div>
        </form>

单击按钮时将触发UserParams函数。此函数将字段集中的输入序列化为一个对象，如下所示：

tracking_information: { 
0: tracking_number: "", carrier_code: "",
1: tracking_number: "", carrier_code: "",
}

该函数在序列化对象后还会调用本地API。

function UserParams() {

        var $form = $('form');
        var fieldSets = $form.find('fieldset');
        var result = {
            tracking_information: []
        };
        fieldSets.each(function () {
            var fields = {};
            $.each($(this).serializeArray(), function () {
                fields[this.name] = this.value;
            });
            result.tracking_information.push(fields);
        });

        // console.log(result);

        $.ajax({
            type: 'GET',
            url: '/api/tracking/retrieve/',
            data: result,
            dataType: 'json',
        });

    }

我尝试了以下方法，但没有用。

data: JSON.stringify(result);

预期结果

用户决定是否要发送一对或几对。我想确保此代码设置为处理动态更改。

我想通过jQuery ajax调用传递单对或多对。

问题

这是通过序列化传递多组值对的最佳方法吗？
由于收到参考错误，如何正确传递对象“结果”？我需要创建一个回调函数吗？如果是，该示例将如何显示？

如何将序列化的表单对象传递给jquery ajax调用？

0 个答案: