繁体   English   中英

您可以简单地用JSON AJAX响应替换JavaScript对象吗?

[英]Can you simply replace a JavaScript Object with a JSON AJAX response?

我有这个简洁的jQuery插件,它允许您通过传入JavaScript对象来生成和设置表单字段值。

传入的对象具有与表单字段名称匹配的属性名称,其值将在HTML表单上设置。

我在这里使用了它的演示: http : //codepen.io/jasondavis/pen/jsmya?editors=101

我可以看到此插件完全有用的主要区域可能是通过从AJAX响应中填充一个FOrm。

在下面的演示中,我传入了设置Form字段值的JavaScript对象。

为了使它在现实生活中的应用中有用,我看到了它的主要用途是从AJAX响应中填充表单。

所以我的问题,尽管可能是最基本的,但我不确定...

假设您单击一个触发AJAX请求的按钮,并且返回值为JSON响应。 我是否可以简单地将JSON响应传递到此jQuery插件中以填写表单值,或者是否需要首先以其他方式对它进行转换和处理?

形式为form-field-name: 'form-field-value'的JavaScript对象看起来像这样...

var formFieldValues = {
    text:'text',
    text2:'text2',
    text3:'text3',
    radio:1
}

我的演示中的代码:

/*
 * jQuery.formFieldValues: get or set all of the name/value pairs from child input controls
* @argument data {array} If included, will populate all child controls.
* @returns element if data was provided, or array of values if not
*/
$.fn.formFieldValues = function(data) {
    var els = this.find(':input').get();

    if(arguments.length === 0) {
        // return all data
        data = {};

        $.each(els, function() {
            if (this.name && !this.disabled && (this.checked
                            || /select|textarea/i.test(this.nodeName)
                            || /text|hidden|password/i.test(this.type))) {
                if(data[this.name] == undefined){
                    data[this.name] = [];
                }
                data[this.name].push($(this).val());
            }
        });
        return data;
    } else {
        $.each(els, function() {
            if (this.name && data[this.name]) {
                var names = data[this.name];
                var $this = $(this);
                if(Object.prototype.toString.call(names) !== '[object Array]'){
                    names = [names]; //backwards compat to old version of this code
                }
                if(this.type == 'checkbox' || this.type == 'radio') {
                    var val = $this.val();
                    var found = false;
                    for(var i = 0; i < names.length; i++){
                        if(names[i] == val){
                            found = true;
                            break;
                        }
                    }
                    $this.attr("checked", found);
                } else {
                    $this.val(names[0]);
                }
            }
        });
        return this;
    }
};

$(document).ready(function($) {

    // Object with Form field values. (Form Field Name: 'value')
    var formFieldValues = {
        text:'text',
        text2:'text2',
        text3:'text3',
        radio:1
    }

    // Set Form Field Values
    $('#my-form').formFieldValues(formFieldValues);

    // Get Form Field Values
    console.log($('#my-form').formFieldValues());  

});

我是否可以简单地将JSON响应传递到此jQuery插件中以填写表单值,或者是否需要首先以其他方式对它进行转换和处理?

默认情况下,Ajax请求的响应是一个字符串(将包含JSON)。 您要么必须显式解析JSON,要么配置jQuery来为您做这件事(例如,通过dataType: 'json' )。

但是,作为插件作者,这不应该是您的问题。 明确说明您的API需要一个对象,由消费者决定是否传递一个对象。

我相信你想要

var jsonObj = JSON.parse(els);

然后在代码中使用objJSON。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM