从Json文件中检索数据以实现ckeditor中的选择框

时间:2017-02-10 08:42:30

标签: javascript jquery json ckeditor

我在ckeditor下创建了一个包含选择框的新插件,我想用json文件中的数据来完成它的选项。 这就是我的Json所包含的内容:

{"services":[
{"linkUrl":"localhost:8080/mySite/contents/service1"},{"linkUrl":"localhost:8080/mySite/contents/service2"},{"linkUrl":"localhost:8080/mySite/contents/service3"},{"linkUrl":"localhost:8080/mySite/contents/service4"}
]}

这是我开发的代码:

{
    type: 'select',
    id: 'services',
    label: 'Services',
    items: [''],
    onLoad: function() {
        (function($) {
            $.ajax({
                url: "/modules/design/files/services.json",
                dataType: 'json',

                success: function(data) {
                    $('#services').each(function(key,val) {
                        if (key == "linkUrl") {
                            $('#services').append('<option value="'+ key + '">' + val + '</option>');
                        }
                    });
                }  
            });
        })(jQuery);
    },                                

    commit : function( data )
    {
        data.services = this.getValue();
    }
},   

执行我的代码后,选择框仍为空。

1 个答案:

答案 0 :(得分:0)

你只有一些语法问题,但想法是正确的,这段代码工作正常。

{   
    type: 'select',
    id: 'services',
    label: 'services',
    items: [''],
    onLoad: function() {
        (function($) {
            $.ajax({
                url: "/modules/design/files/services.json",
                dataType: 'json',
                success: function(data) { console.log("data.services.length " + data.services.length);
                    for( i = 0 ; i < data.services.length ; i++ ){
                        curservice = data.services[i];
                        $('.cke_dialog_ui_input_select').append($('<option>').text(curservice.name).attr('value', curservice.key));
                    }
                }  
            });
    })(jQuery);
},