The problem is that you have jQuery included twice: once by you manually in your index.html, and once by WebSharper automatically for its own purposes. So all the functionality added by TypeAhead and TagsInput onto the initially loaded jQuery is lost when jQuery is reloaded from scratch a second time.
To solve this, instead of including jQuery, TypeAhead and TagsInput manually in the html file, you can use WebSharper's resources system:
- Define resources for TypeAhead and TagsInput, specifying that they depend on jQuery:
module Resources = open WebSharper.Core.Resources open WebSharper.JQuery.Resources [<Require(typeof<JQuery>)>] type TypeAhead() = inherit BaseResource("https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js") [<Require(typeof<TypeAhead>)>] type TagsInput() = inherit BaseResource("https://raw.githack.com/bootstrap-tagsinput/bootstrap-tagsinput/master/src/bootstrap-tagsinput.js")- Specify that your
Timethod depends on them:
type JQuery with [<Require(typeof<Resources.TagsInput>)>] [<Inline "$0.tagsinput({ typeaheadjs: { source: $1 }})">] member private this.Ti (findMatches: FuncWithArgs<string * (string [] -> unit), unit>) = X<unit>- Remove the jQuery, TypeAhead and TagsInput script tags from index.html, because they will automatically be added by WebSharper if the page contains code that calls
.Ti().