Unable to load data from datasource into form in string format.

[seanvree]

I think I'm missing something here, but I can't seem to load the dataSource from a JSON file in string format.

I have a simple form with one select field. I'm trying to save and reload the submitted value from the json file, however, I thought that the data had to be in the format of " {"key":"value"} ", example: " {"Strawberry": "Strawberry Flavor"} " but my form will only populate the value if it's in this format: " ["Stawberry"] ".

What am I doing wrong here?

Below is my form:

The list select options are being loaded via dataSource which is formatted like below. This is working fine.

"../config/icecream-list.json" :

{
    "Vanilla": "Vanilla Flavor",
    "Chocolate": "Chocolate Flavor",
    "Strawberry": "Strawberry Flavor",
    "Mint": "Mint"
}

 <div id="icecream"></div>

            <script type="text/javascript">

                $(document).ready(function() {
                var CustomConnector = Alpaca.Connector.extend({
                        buildAjaxConfig: function(uri, isJson) {
                            var ajaxConfig = this.base(uri, isJson);
                            ajaxConfig.headers = {
                                "ssoheader": "abcde12345"
                            };
                            return ajaxConfig;
                        }
                    });
                   Alpaca.registerConnectorClass("custom", CustomConnector);
                    $("#icecream").alpaca({
                        "connector": "custom",
                        "dataSource": "../data/icecream-data.json",
                        "schema": {
                            "type": "string",
                            "name": "icecream",
                            "format": "string",
                            "required": true,
                            "default": ["Vanilla"]
                        },
                        "options": {
                            "type": "select",
                            "dataSource": "../config/icecream-list.json",
                            "name": "icecream",
                            "label": "Ice Cream",
                            "removeDefaultNone": true,
                            "icecream": {
                                "type": "select",
                                "name": "icecream",
                                "label": "Ice Cream"
                            },                           
                            "form": {
                                "attributes": {
                                    "action": "post_receiver.php",
                                    "method": "post"
                                },
                                "buttons": {
                                    "submit": {
                                        "type": "button",
                                        "label": "Submit",
                                        "name": "submit",
                                        "value": "submit",
                                        click: function(){
                                            var data = $('#icecream').alpaca().getValue();
                                            $.post({
                                                url: 'post_receiver.php', 
                                                data: $('#icecream').alpaca().getValue(),
                                                success: function(data) {
                                                    alert(JSON.stringify(data));
                                                    alert("settings saved!");
                                                    setTimeout(location.reload.bind(location), 100)
                                                },
                                                error: function(errorThrown){
                                                    console.log(errorThrown); 
                                                } 
                                            });
                                        }
                                    },
                                    "view": {
                                        "type": "button",
                                        "label": "View JSON",
                                        "value": "View JSON",
                                        "click": function() {
                                            alert(JSON.stringify(this.getValue(), null, "  "));
                                        }
                                    }
                                },
                            }
                        }
                    });
                });
            </script>