0
$\begingroup$

Is it possible to control the width of FormFunction? Related, is it possible to have more than 4 inputs in a row in FormFunction? Two code examples. Example 1 produced a row of 4 inputs.

cd[E4] = CloudDeploy[
FormFunction[
FormObject[
"DTS" -> CompoundElement[<|
   "Year" -> Range[2010, 2018],
   "Month" -> Range[1, 12],
   "Day" -> Range[1, 30],
   "Hour" -> Range[12]
   |>],
ImageFormattingWidth -> Infinity,
AppearanceRules -> <|"ItemLayout" -> "Vertical"|>,
FormLayoutFunction -> 
 Function[Grid[{{#["Year"], #["Month"], #["Day"], #["Hour"]}}]]
],
({#["Year"], #["Month"], #["Day"], #["Hour"]}) &
]
]

Example 2 produces a column of 5 inputs. Why is it a column not a row?

cd[E5] = CloudDeploy[
FormFunction[
FormObject[
"DTS" -> CompoundElement[<|
   "Year" -> Range[2010, 2018],
   "Month" -> Range[1, 12],
   "Day" -> Range[1, 30],
   "Hour" -> Range[12],
   "Minute" -> Range[60]
   |>],
ImageFormattingWidth -> Infinity,
AppearanceRules -> <|"ItemLayout" -> "Vertical"|>,
FormLayoutFunction -> 
 Function[
  Grid[{{#["Year"], #["Month"], #["Day"], #["Hour"], #[
      "Minute"]}}]]
],
({#["Year"], #["Month"], #["Day"], #["Hour"], #["Minute"], #[
   "Second"]}) &
]
]

It seems FormFunction is regulating the width and number of inputs per row. This does not seem to be the case for FormObject however,

CloudDeploy[
FormObject[
<|
"Year" -> Range[2010, 2018],
"Month" -> Range[1, 12],
"Day" -> Range[1, 30],
"Hour" -> Range[12],
"Minute" -> Range[60],
"Second" -> Range[60],
"more" -> Range[10],
"even more" -> Range[10],
"how many more" -> Range[10]
|>,
FormLayoutFunction -> 
Function[
Grid[{{#["Year"], Spacer[5], #["Month"], Spacer[5], #["Day"], 
   Spacer[5], #["Hour"], Spacer[5], #["Minute"], 
   Spacer[5], #["Second"], Spacer[5], #["more"], 
   Spacer[5], #["even more"], Spacer[5], #["how many more"]}}]]

] ]

the problem with FormObject is I don't see a good way of collecting and operating on the variable values. FormFunction has a very convenient way of getting at input values and operating on them directly. I don't see how to do the same things with FormObject, for example collecting the variable values and applying a CloudPut.

$\endgroup$
  • $\begingroup$ Not bad... It only took me 10 minutes to answer one of my questions ;) the answer is be more careful - you can have more than 5 inputs in a row. Properly specifying the FormObject inputs, the FormLayoutFunction keys and the slots used by FormFunction results in all the inputs in a row - sort of - Using Grid in FormLayoutFunction shows items off the right side of the FormFunction 'area', while using Row wraps items to a second row. Again, is there a way to control the width of FormFunction? $\endgroup$ – Mitch Jan 15 '18 at 10:19
  • $\begingroup$ You can self answer then. $\endgroup$ – Kuba Jan 15 '18 at 11:16
1
$\begingroup$

Sure thing, I wanted to generalize it some so here we go...

Create some input controls. inputs = <| Table[FromCharacterCode[96 + i, "UTF8"] -> Range[5], {i, 15}]|>;

Now CloudDeploy the FormObject directly:

cd[FO] = CloudDeploy[
FormObject[
inputs,
ImageFormattingWidth -> Infinity,
AppearanceRules -> <|"ItemLayout" -> "Vertical"|>,
FormLayoutFunction -> 
Function[
 Grid[{{#1["a"], #1["b"], #1["c"], #1["d"], #1["e"], #1["f"], #1[
     "g"], #1["h"], #1["i"], #1["j"], #1["k"], #1["l"], #1[
     "m"], #1["n"], #1["o"]}}]]
]
]

Results in a very tight grouping of controls starting at the very left edge of the page. It's easy enough to add a little formatting and/or HTML to make this very useful.

CloudDeploy the Formfuntion with FormLayoutFunction -> Grid...

cd[GRID] = CloudDeploy[
FormFunction[
FormObject[
inputs,
ImageFormattingWidth -> Infinity,
AppearanceRules -> <|"ItemLayout" -> "Vertical"|>,
FormLayoutFunction -> 
 Function[
  Grid[{{#1["a"], #1["b"], #1["c"], #1["d"], #1["e"], #1["f"], #1[
      "g"], #1["h"], #1["i"], #1["j"], #1["k"], #1["l"], #1[
      "m"], #1["n"], #1["o"]}}]]
],
{#1["a"], #1["b"], #1["c"], #1["d"], #1["e"], #1["f"], #1["g"], #1[
  "h"], #1["i"], #1["j"], #1["k"], #1["l"], #1["m"], #1["n"], #1[
  "o"]} &
]
]

Results in a set of controls running on to the right outside the FormFuntion formatted area making it usable but not very presentable.

Now CloudDeploy with FormLayoutFunction -> Row...

cd[ROW] = CloudDeploy[
FormFunction[
FormObject[
inputs,
ImageFormattingWidth -> Infinity,
AppearanceRules -> <|"ItemLayout" -> "Vertical"|>,
FormLayoutFunction -> 
 Function[
  Row[{#1["a"], #1["b"], #1["c"], #1["d"], #1["e"], #1["f"], #1[
     "g"], #1["h"], #1["i"], #1["j"], #1["k"], #1["l"], #1[
     "m"], #1["n"], #1["o"]}]]
],
{#1["a"], #1["b"], #1["c"], #1["d"], #1["e"], #1["f"], #1["g"], #1[
  "h"], #1["i"], #1["j"], #1["k"], #1["l"], #1["m"], #1["n"], #1[
  "o"]} &
]
]

Results in a wrap around inside the FormFunction formated area so usable and presentable but the tightness of the CloudDeploy[ FormObject... ] inside a larger formatted area for CloudDeploy[ FormFunction... ] would be just right --- says baby bear.

$\endgroup$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.