Android Question How can I store the form input values to Variable from Webview LoadHtml method ?

pearlxp · Oct 22, 2017

I am using WebView LoadHtml method to create a dynamic-html-Entry-form with some query parameters.
Can I store these input values to in B4A variables for further processing ?

html=$"
<html>
<body>
<form >
Name: <input type="text" name="FirstName" ><br>
Email: <input type="email" name="Email"><br>
<button type="button">Next</button>
</form>
</body>
</html>
"$

WebView1.LoadHtml(html)

Erel · Oct 23, 2017

pearlxp said:
I am using WebView LoadHtml method to create a dynamic-html-Entry-form with some query parameters.

Why? Everything will be simpler if you create a native layout.

You can inject JavaScript that fetches the fields values.

pearlxp · Oct 23, 2017

The number of parameters will vary so it will be comfortable to use Webview for user input. I want to process these input values using native code and display the output/report again to Webview. How can I use/show these variables 'dtfrom' and 'dtto' in native textbox ?

html= $"

<html>
<body>
<form id="frm1" >
Date From: <input type="date"><br>
To: <input type="date"><br><br><br>
</form>
<button onclick="GetValues()">NEXT</button>
<script>
function GetValues()
{
var dtfrom = document.getElementById("frm1").elements[0].value;
var dtto = document.getElementById("frm1").elements[1].value;
}
</script>
</body>
</html>
"$

WebView1.LoadHtml(html)

DonManfred · Oct 23, 2017

Check the webviewextra and especially the javascript interface in it
https://www.b4x.com/android/forum/threads/webviewextras.12453/

With the javascriptinterface you can use code in javascript inside your html which then calls a sub in your app giving 0, 1, 2 or 3 parameters... What you then do with the given parameters is up to you.

ronell · Oct 23, 2017

@pearlxp
use code tags when posting codes

pearlxp · Oct 23, 2017

I have checked the link. we can call the sub for webview1.LoadUrl() in pageFinished event

WebView1_PageFinished (Url AsString)
WebViewExtras1.executeJavascript(WebView1, jScript)
EndSub

how can I execute this in Webview1.LoadHtml() "onclick" event

webview1.Loadhtml Vs webview1.loadUrl

Can u please suggest any sample code for it?

DonManfred · Oct 23, 2017

Can you please start with posting a small project using your html inside a webview.
Use File Export as zip in the IDE. Make sure that the html-file you are using is included in the assets

DonManfred · Oct 23, 2017

check this example.

basically this is the code used

B4X:

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.
   
    Dim WebViewExtras1 As WebViewExtras
    Dim WebView1 As WebView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("layoutMain")
    ' onClick="javascript:B4A.CallSub('buttonClick', false);
    '    add the B4A javascript interface to the WebView
    WebViewExtras1.addJavascriptInterface(WebView1, "B4A")
    Dim html As String = $"<html>
<body>
<form >
Name: <input type="text" id="FirstName" name="FirstName" value="John" ><br>
Email: <input type="email" id="email" name="Email" value="johndoe@somewhere.com"><br>
<button type="button" onClick="javascript:B4A.CallSub('check_data', false, document.getElementById('FirstName').value, document.getElementById('email').value);">Next</button>

</form>
</body>
</html>"$
    '    now load a web page
    WebView1.LoadHtml(html)
End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub
Sub check_data(var1 As String, var2 As String)
    Log($"check_data(${var1}, ${var2})"$)
End Sub

Erel · Oct 23, 2017

pearlxp said:
The number of parameters will vary so it will be comfortable to use Webview for user input.

I still recommend you to use native layout. Everything will be simpler and you will have more control.
There is no problem with creating controls at runtime.

ronell · Oct 23, 2017

Erel said:
I still recommend you to use native layout. Everything will be simpler and you will have more control.
There is no problem with creating controls at runtime.

yeah, i dont get what shes trying to achieve

pearlxp said:
The number of parameters will vary so it will be comfortable to use Webview for user input

what do you mean by "number of parameters will vary? im pretty sure b4a native layout can handle it

pearlxp · Oct 23, 2017

Thank you Manfred . Its Working fine...
This is what I exactly required. The parameters will vary for each reports.
Now I can process the input variable to create the SQL Query for preparing the html report.

Android Question How can I store the form input values to Variable from Webview LoadHtml method ?

pearlxp

Member

Erel

B4X founder

pearlxp

Member

DonManfred

Expert

ronell

Well-Known Member

pearlxp

Member

DonManfred

Expert

DonManfred

Expert

Attachments

Erel

B4X founder

ronell

Well-Known Member

pearlxp

Member

Similar Threads