Permalink
Browse files

Adding selection callback.

  • Loading branch information...
akoprow committed Mar 12, 2012
1 parent d00622b commit a28c6d71034d4ff7b1db787835e90226a3e3c002
Showing with 23 additions and 9 deletions.
  1. +23 −9 select.opa
View
@@ -1,24 +1,38 @@
import stdlib.themes.bootstrap
-function selectOptions(list('a) opts) {
- function render_option(o) {
- <option>{o}</>
+function select(({string id} or {autogen}) id, list('a) options, ('a -> void) callback) {
+ id =
+ match (id) {
+ case {id: user_id}: user_id;
+ case {autogen}: Dom.fresh_id()
+ }
+ function render_option(i, o) {
+ <option value={i}>{o}</>
}
- <>{List.map(render_option, opts)}</>
+ function changed(_evt) {
+ sel_val = List.unsafe_get(String.to_int(Dom.get_value(#{id})), options);
+ callback(sel_val);
+ }
+ <select id={id} onchange={changed}>
+ {List.mapi(render_option, options)}
+ </>
+}
+
+function selected(int number) {
+ #selectMsg = <>You selected {number}</>
}
function page() {
- list(int) numberRange = [2, 3, 4, 5, 6, 7, 8, 9]
+ list(int) numberRange = [2, 3, 4, 5, 6, 7, 8, 9];
<div class=container>
<form class=form-horizontal>
<legend>Simple selection demo with Opa</>
<fieldset>
<div class=control-group>
<label class=control-label for=select01>Make your choice</>
<div class=controls>
- <select id=select01>
- {selectOptions(numberRange)}
- </>
+ {select({id: "select01"}, numberRange, selected)}
+ <p id=#selectMsg class=help-block>You did not make any selection</>
</>
</>
</>
@@ -27,4 +41,4 @@ function page() {
}
// simple one-page server
-Server.start(Server.http, {title: "Form selection in Opa", ~page})
+Server.start(Server.http, {title: "Form selection in Opa", ~page});

0 comments on commit a28c6d7

Please sign in to comment.