I am currently exploring WebViewGadget (PB 6.30) and how to communicate variables between JavaScript and PureBasic.
This code displays a small form consisting of three HTML tags: First Name, Last Name, and a “Submit” button to send the data to PureBasic variables.
Code: Select all
EnableExplicit
Enumeration
#app
#webview
#json
EndEnumeration
; HTML Code
Define Html.s = ~"<!DOCTYPE html>\n" +
~"<html>\n" +
~"<body>\n" +
~"\n" +
~"<label>First name:</label><br>\n" +
~"<input type=\"text\" id=\"fname\"><br>\n" +
~"<label>Last name:</label><br>\n" +
~"<input type=\"text\" id=\"lname\"><br><br>\n" +
~"<input type=\"submit\" id=\"submit\" value=\"Submit\">\n" +
~"\n" +
~"<script>\n" +
~"const [fname, lname, submit] = document.querySelectorAll(\"#fname, #lname, #submit\");\n" +
~"\n" +
~"document.addEventListener(\"DOMContentLoaded\", () => {\n" +
~" submit.addEventListener(\"click\", () => {\n" +
~" window.formSubmit(fname.value, lname.value).then(result => {\n" +
~" fname.value = '';\n" +
~" lname.value = '';\n" +
~" })\n" +
~" });\n" +
~"});\n" +
~"</script>\n" +
~"</body>\n" +
~"</html>\n"
; Event
Define Event
Declare DataReceived(JSONBuffer.s)
OpenWindow(#app, 100, 100, 400, 400, "Simple Form", #PB_Window_SystemMenu | #PB_Window_Invisible)
; Webview option debug (view console)
WebViewGadget(#webview, 0, 0, 400, 400, #PB_WebView_Debug)
; Insert code HTML and assign callback
SetGadgetItemText(#webview, #PB_WebView_HtmlCode, Html)
BindWebViewCallback(#webview, "formSubmit", @DataReceived())
; Show the window once the webview has been fully loaded
HideWindow(#app, #False)
; WebViewGadget callback
Procedure DataReceived(JSONBuffer.s)
Protected buffer.s = ""
Dim JsonParameters.s(0)
ParseJSON(#json, JSONBuffer)
ExtractJSONArray(JSONValue(#json), JsonParameters())
Debug "First Name : " + JsonParameters(0)
Debug "Last name : " + JsonParameters(1)
ProcedureReturn UTF8(~"{ \"buffer\": "+ Chr(34) + buffer + Chr(34)+ "}")
EndProcedure
Repeat
Event = WaitWindowEvent()
Until Event = #PB_Event_CloseWindow
■ You can test it by entering your first name, then your last name, and clicking the Submit button. You will see the result in the debug window. It works! YEahhhh i'm happy
■ But there's a problem
. Now press the tab key several times in the form. The application freezes.I don't see any errors in this small code and there are no errors in the JS debug console.
Could there be a bug with the WebViewGadget ? Or is it me ?
