Back to Questions
1.9k
views2
comments
Chosen select-options not firing on.change
websharpercsshtmlui

I'm using Chosen for a dropdown with multiple selection. The basic dropdown from this post has a suggested snippet with

1

on.change (fun el _ -> getSelectedItems el)

as expected. Now the problem is that it is not fired when I apply the Chosen class: attr.class"chosen-select" to the select

FYI according to Chosen documentation I have

1
2
3
4

let initialSel = JQuery.Of("#MySelect option:selected")
JS.Inline("$0.prop($1,$2)", initialSel, "selected", false)
let chosen_select = JQuery.Of(".chosen-select")
JS.Inline("$0.chosen()", chosen_select)

on the parent div [ on.afterRender in the Client.fs besides the requested style and script in the Main.fs

1
2
3
4
5
6
7

type ChosenStyle() =
    inherit Resources.BaseResource("MyScripts",
        "chosen/chosen.css")
[<Require(typeof<JQueryUIScript>)>]
type ChosenScript() =    
    inherit Resources.BaseResource("MyScripts",
        "chosen/chosen.jquery.min.js")
.

Looks like they use custom events, you should be able to get by with something like this:

1

JS.Inline("$0.chosen().change($1)", chosen_select, fun () -> (* ... *))
By on 8/21/2019 1:15 AM ()

Yep, this seems ok, thanks.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

type Helper =
    {
        selected: bool
        value: string
    }

let MyOnChange (ev: Dom.Event) = 
    Console.Log("MyChange fired with target", ev.Target)
    let k = ev.Target?options : Helper []
    k
    |> Array.iter (fun x -> 
        if (x.selected) 
        then Console.Log (x.value + " selected ")
    )


let triggerMe = JQuery.Of("#MySelect")
JS.Inline("$0.on('change', $1);", triggerMe, MyOnChange)
By on 8/21/2019 1:32 AM ()

    Topic tags

    IntelliFactory Offices Copyright (c) 2011-2012 IntelliFactory. All rights reserved.
    Home | Products | Consulting | Trainings | Blogs | Jobs | Contact Us | Terms of Use | Privacy Policy | Cookie Policy     		Built with WebSharper