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

pearlxp

Member
Licensed User
Longtime User
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)
 

pearlxp

Member
Licensed User
Longtime User
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)
 
Upvote 0

DonManfred

Expert
Licensed User
Longtime User
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.
 
Upvote 0

pearlxp

Member
Licensed User
Longtime User
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?
 
Upvote 0

DonManfred

Expert
Licensed User
Longtime User
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
 

Attachments

  • webviewjs.zip
    7.2 KB · Views: 237
Upvote 0

ronell

Well-Known Member
Licensed User
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

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
 
Upvote 0

pearlxp

Member
Licensed User
Longtime User
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.
 
Upvote 0
Top