Skip to content

Commit

Permalink
Fix commas breaking single select list fields, and added ability to s…
Browse files Browse the repository at this point in the history 
…pecify delimiting functions for multiple select fields
  • Loading branch information
@mibewh
mibewh committed Mar 6, 2019
1 parent 3a2fe06 commit e5e4505
Show file tree
Hide file tree
Showing 8 changed files with 180 additions and 29 deletions.
36 changes: 36 additions & 0 deletions site/docs/fields/checkbox.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -259,4 +259,40 @@ $("#field8").alpaca({
}
});
</script>
{% endraw %}

## Example 9
Checkbox Field with custom delimiters
<div id="field9"> </div>
{% raw %}
<script type="text/javascript" id="field9-script">
$("#field9").alpaca({
"data": "sandwich | cookie | drink",
"schema": {
"type": "string",
"enum": ["sandwich", "chips", "cookie", "drink"]
},
"options": {
"type": "checkbox",
"label": "What would you like with your order?",
"optionLabels": ["A Sandwich", "Potato Chips", "A Cookie", "Soft Drink"],
"form": {
"buttons": {
"view": {
"label": "View JSON",
"click": function() {
alert(JSON.stringify(this.getValue(), null, " "));
}
}
}
},
"split": function(val) {
return val.split("|");
},
"join": function(vals) {
return vals.join("|");
}
}
});
</script>
{% endraw %}
36 changes: 36 additions & 0 deletions site/docs/fields/chooser.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -235,3 +235,39 @@ $("#field8").alpaca({
});
</script>
{% endraw %}

## Example 9
An example using custom delimiters
<div id="field9"> </div>
{% raw %}
<script type="text/javascript" id="field9-script">
$("#field9").alpaca({
"schema": {
"type": "string",
"title": "Select your favorite colors",
"enum": ["red", "orange", "yellow", "green", "blue", "indigo", "violet"]
},
"options": {
"type": "chooser",
"optionLabels": ["Red", "Orange", "Yellow", "Green", "Blue", "Indigo", "Violet"],
"form": {
"buttons": {
"view": {
"label": "View JSON",
"click": function() {
alert(JSON.stringify(this.getValue(), null, " "));
}
}
}
},
"split": function(val) {
return val.split("|");
},
"join": function(vals) {
return vals.join("|");
}
},
"data": ["red", "yellow", "green"]
});
</script>
{% endraw %}
41 changes: 41 additions & 0 deletions site/docs/fields/select.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -442,4 +442,45 @@ $("#field16").alpaca({
}
});
</script>
{% endraw %}

## Example 17
Multiple select field for array data, using custom delimiters.
<div id="field17"> </div>
{% raw %}
<script type="text/javascript" id="field17-script">
$("#field17").alpaca({
"data": "Vanilla | Chocolate",
"schema": {
"type": "string",
"title": "Ice Cream",
"enum": ["Vanilla", "Chocolate", "Strawberry", "Mint"],
"minItems": 2,
"maxItems": 3
},
"options": {
"label": "Ice cream",
"helper": "Guess my favorite ice cream?",
"type": "select",
"size": 5,
"noneLabel": "Pick a flavour of Ice Cream!",
"form": {
"buttons": {
"view": {
"label": "View JSON",
"click": function() {
alert(JSON.stringify(this.getValue(), null, " "));
}
}
}
},
"split": function(val) {
return val.split("|");
},
"join": function(vals) {
return vals.join("|");
}
}
});
</script>
{% endraw %}
14 changes: 0 additions & 14 deletions src/js/fields/list/CheckBoxField.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,20 +23,6 @@

self.base();

if (typeof(self.options.multiple) === "undefined")
{
self.options.multiple = false;

if (self.schema.type === "array")
{
self.options.multiple = true;
}
else if (typeof(self.schema["enum"]) !== "undefined")
{
self.options.multiple = true;
}
}

// in single mode, blank out rightlabel
if (!self.options.multiple)
{
Expand Down
2 changes: 2 additions & 0 deletions src/js/fields/list/ChooserField.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,8 @@
{
var self = this;

self.options.multiple = true;

this.base();
},

Expand Down
73 changes: 63 additions & 10 deletions src/js/fields/list/ListField.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,22 @@
self.options.useDataSourceAsEnum = true;
}

if (typeof(self.options.multiple) === "undefined")
{
if (self.schema["type"] && self.schema["type"] === "array")
{
self.options.multiple = true;
}
else if (typeof(self.schema["enum"]) !== "undefined")
{
self.options.multiple = true;
}
else
{
self.options.multiple = false;
}
}

// make sure we convert any incoming data to our expected format
self.setValue(this.data, true);
},
Expand Down Expand Up @@ -110,7 +126,7 @@
displayableTexts.push(text);
}
}

model.displayableText = displayableTexts.join(", ");
},

Expand Down Expand Up @@ -251,8 +267,16 @@
for (var i = 0; i < this.data.length; i++) {
array.push(this.data[i].value);
}

val = array.join(",");

// Use custom join function if provided
if (self.options.join && Alpaca.isFunction(self.options.join))
{
val = self.options.join(array);
}
else
{
val = array.join(",");
}
}
else if (self.schema.type === "number")
{
Expand Down Expand Up @@ -343,14 +367,33 @@
}
else if (Alpaca.isString(val))
{
values = val.split(",");
for (var i = 0; i < values.length; i++)
if (self.options.multiple)
{
values[i] = values[i].trim();
values[i] = {
"text": values[i],
"value": values[i]
};
// Use custom split function, if defined
if (self.options.split && Alpaca.isFunction(self.options.split))
{
values = self.options.split(val);
}
else
{
values = val.split(",");
}

for (var i = 0; i < values.length; i++)
{
values[i] = values[i].trim();
values[i] = {
"text": values[i],
"value": values[i]
};
}
}
else
{
values.push({
"text": val,
"value": val
});
}

handled = true;
Expand Down Expand Up @@ -582,6 +625,16 @@
"description": "Whether to constrain the field's schema enum property to the values that come back from the data source.",
"type": "boolean",
"default": true
},
"split": {
"title": "Split Function",
"type": "function",
"description": "For multiple select lists. Defines a f(a) for how data strings should be split into individual values. A join function should also be defined which reverses this function."
},
"join": {
"title": "Join Function",
"type": "function",
"description": "For multiple select lists. Defines a f(a) for how selected options should be combined into a single string. A split function should also be defined which reverses this function."
}
}
});
Expand Down
2 changes: 2 additions & 0 deletions src/js/fields/list/RadioField.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@
{
var self = this;

self.options.multiple = false;

this.base();

if (this.options.name)
Expand Down
5 changes: 0 additions & 5 deletions src/js/fields/list/SelectField.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,6 @@

this.base();

if (self.schema["type"] && self.schema["type"] === "array")
{
self.options.multiple = true;
}

// automatically turn on "hideNone" if we're in multiselect mode and have the multiselect plugin
if (self.options.multiple && $.fn.multiselect)
{
Expand Down

0 comments on commit e5e4505

Please sign in to comment.