Kimserey's blog

Post form data to WebSharper sitelet from HTML/JS When building websites, chances are that you will need to gather data from your users. The most common way to gather data is via a form. But after gathering the data, there are two ways to submit it from the browser to your server: Using a HTML form Using an Ajax call Today we will see the differences and how we can implement it. 1. Submit data using a form Before hand, I have created a simple server which has a single endpoint accepting a POST. type EndPoint = | [<EndPoint "POST /upload">] Upload let Main = Application.MultiPage (fun ctx -> function Upload -> Content.Text "Received") Next we can create a simple form with one an input and button to submit. <form method="post" action="/upload"> <input name="my-data" type="text" /> <button type="submit">Submit</button> </form> The action is the url to ...

Use JS local storage with ListModel with WebSharper UI.Next in F# Last week I wanted to use the browser local storage to store a list of elements. I wanted to update the resource split project to have the data stored (temporarily) so that it will be easier to add or remove resources. The browser local storage is ideal for this kind of scenario. Turns out WebSharper.UI.Next has the feature built in to persist ListModel so today I will explain how to do it. This post is composed by two parts: 1. Use local storage with ListModel UI.Next 2. Debug values stored in Chrome 1. Use local storage with ListModel in UI.Next I started to browse WebSharper code and found that ListModel exposed a function named CreateWithStorage and that the default implementation was set to be used with local storage (ha! exactly what I wanted). The definition can be found here . So to use the storage we must use CreateWithStorage and Storage.default . CreateWithStorage<'Key, 'T when 'Ke...

Fix ‘The method or operation is not implemented Visual Studio’ when referencing project in F# solution Yesterday, when trying to reference a project within my solution, I had an error from VS with the following message. The problem was that I was referencing another project which was unloaded. When expanding the list of references, there is a warning sign for problematic references: Most of the time, for me at least, it indicates a mismatch of F# version between the two libraries. But a mismatch of F# version doesn’t cause the not implemented exception on Visual Studio. The issue was that the library referenced was unloaded . Once I made sure it was loaded, the sign disappeared and VS allowed me to add a reference.

20170202_listmodel_websharper_lostfocus.md How to avoid input lost focus with ListModel WebSharper F# Few months ago, I explained how ListModel worked . Today I would like to share a recurring issue that I used to have - lost of focus on input every time the ListModel values change . There’s an easy solution to that which I will demonstrate by first showing the initial code and explaining what is going on, why the focus is lost, then I will explain how we can work around it. This post will be composed by two parts: 1. Why the inputs lose focus? 2. How to prevent it I thought about sharing this when I saw that someone else has had the same issue - http://try.websharper.com/cache/0000Bj . 1. Why the inputs lose focus? The code is the following: [<JavaScript>] module Lensing = let aliases = ListModel.Create id [ "Bill"; "Joe" ] let lensIntoAlias aliasKey = aliases.LensInto id (fun a n -> n) aliasKey let Main = d...