Submit html form with results in webview - android

If I have a HTML form like this:
<form action="form_action.php" method="post">
First name: <input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
<input type="submit" value="Submit" />
</form>
And then I want to fill the fname & lname then like "press" the submit button programmatically and after that show the form_action.php with the post's in a webview.
And just so you know, I can't change the form, b'cause it's not my site I'm using.
Is that possible?
Hope you get it.
Thanks in advance. (Very sorry for bad english!)

Related

Adding autocomplete to input fields on Cordova Android and iOS app

I have an Ionic/Cordova app on both Android and iOS that has a signup form. In an effort to streamline the signup form I am trying to add autocomplete='auto-fill-field' to each of the input fields but so far I have not been able to get them to work.
My app is using all of the latest webviews supplied by Cordova.
Is it possible to get standard web input autocomplete fields to work on a bundled cordova app? If so, how? My hunch is that it won't work because the webviews don't have access to the standard chrome/safari browser. I see lots of posts about it but none of the ones I have reviewed have been able to get it to work for me.
This is my current signup form:
<div style="width:95%;margin-left:2.5%;">
<div style="height:25px;">
<input type="text" placeholder="First Name" class="registerFields" id="user_fName" autocomplete="given-name" ng-model="regObj.user_fName" ng-blur="setInfo('user_fName')" />
<input type="text" placeholder="Last Name" class="registerFields" id="user_lName" autocomplete="family-name" ng-model="regObj.user_lName" ng-blur="setInfo('user_lName')" />
</div>
<div style="height:25px;margin-top:10px;"><input type="email" placeholder="Email" class="registerFields" id="user_email" autocomplete="email" ng-model="regObj.user_email" ng-blur="setInfo('user_email')" /></div>
<div style="height:25px;margin-top:10px;">
<select class="registerFields" id="user_phoneCountry" ng-change="selectPhone();" autocomplete="country" ng-model="regObj.user_phoneCountry">
<option ng-value="" ng-if="false"></option>
<option ng-selected="pKey==regObj.user_phoneCountry" ng-repeat="pKey in notSorted(countries)" ng-value="pKey">{{pKey}}</option>
</select>
<input type="number" placeholder="Mobile Number" class="registerFields" inputmode="numeric" pattern="[0-9]*" id="user_phone" autocomplete="tel-national" ng-model="regObj.user_phone" ng-keypress="monitorLength($event,'user_phone',phoneNumLengths,1)" ng-blur="verifyLength('user_phone',phoneNumLengths,regObj.countryCode+' phone number')" />
</div>
<div style="height:25px;margin-top:10px;">
<select class="registerFields" id="user_zipCountry" autocomplete="country" ng-change="selectCountry();" ng-model="regObj.user_zipCountry">
<option value="" ng-if="false"></option>
<option ng-selected="cKey==regObj.user_zipCountry" ng-repeat="cKey in notSorted(countries)" value="{{cKey}}">{{cKey}}</option>
</select>
<input type="text" ng-if="regObj.postalInput=='text'" placeholder="Home PostalCode" style="width:70%;float:right;" autocomplete="postal-code" class="registerFields" pattern="[a-zA-Z0-9 -]*" id="user_RegZip" ng-model="regObj.user_RegZip" ng-keypress="monitorLength($event,'user_RegZip',postalCodeLengths,2)" ng-blur="verifyLength('user_RegZip',postalCodeLengths,regObj.countryCode+' postal code')" />
<input type="tel" ng-if="regObj.postalInput=='tel'" placeholder="Home Postal Code" autocomplete="postal-code" class="registerFields" inputmode="numeric" pattern="[0-9 -]*" id="user_RegZip" ng-model="regObj.user_RegZip" ng-keypress="monitorLength($event,'user_RegZip',postalCodeLengths,2)" ng-blur="verifyLength('user_RegZip',postalCodeLengths,regObj.countryCode+' postal code')" />
</div>
</div>
Try to attach name attribute to each and every field.
After attaching name attribute the keyboard started to give suggestion to autocomplete the field
<input type="email" autocomplete="email" name="email"/>
<input type="tel" autocomplete="mobile" name="phone" pattern="[0-9]*"/>

Responsive HTML - How to show a `Go` button instead of `Next` on mobile keyboard

Ive a simple problem, Ive a form that submits on enter on any field. However, on a mobile input type=text for example doesnt show a Go or submit key on the keyboard.
Instead it shows or does a next and takes the user to next input field. Only the last field shows the Go key.
Is there a way to get this working?
Here is the html:
<form action="" method="POST">
<input type="text" id="field_1" name="field_1" value="" />
<input type="text" id="field_2" name="field_2" value="" />
<input type="text" id="field_3" name="field_3" value="" />
</form>
Thanks a lot

input type="file" accept="image/*" capture="camera" not working for mobile

I've got a simple form that uploads some basic info and an image to my formtools database. It works perfectly on desktop but not on mobile. On my Android phone when I test it it asks me to select the camera or file browser I have tried both camera and file browser and I take a picure / upload an image which it seems to do then loads the thank you page, but when I go the the form tools database the image has not been uploaded.
Anyone know why this isn't working?
here's the form
<form enctype="multipart/form-data" id="competitionform" class="uniForm cmxform" name="competitionform" method="post" action="/formtools/process.php">
<input type="hidden" name="form_tools_form_id" value="110" />
<header>
<h2>Upload your image</h2>
</header>
<label>Your Name </label>
<input width="100px;" type="text" placeholder=" " name="name" />
<label>Your Email </label>
<input type="text" placeholder=" " name="email" /> <
<label for="file">Upload Selfie</label>
<input type="file" name="uploadselfie"/>
<input type="submit" id="submit" value="Upload Selfie" />
</form>
I've also tried adding
accept="image/*" capture="camera"
to the input which opens the camera lets you take a picture then loads the thank you page but again no image is uploaded to the formtools database.
Thanks
<form> with enctype="multipart/form-data" can only upload pic/files and so on .It can't send other input which type is text to the database.
This point, you must set two forms, one for input type=text, another for input type=file.

Phonegap - email html form content

I have the below HTML code which basically sends mail on click of submit button
<form action="mailto:xxx#gmail.com" method="post" enctype="text/plain">
Name:<br>
<input type="text" name="name" value="Name"><br>
E-mail:<br>
<input type="text" name="mail" value="E-Mail"><br>
Comment:<br>
<input type="text" name="comment" value="Comments" size="50"><br><br>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
when I hit the submit button in the phonegap application I get the below in the logcat.
DroidGap: GapViewClient.onReceivedError: Error code=-10 Description=net::ERR_UNKNOWN_URL_SCHEME URL=mailto:xxx#gmail.com?body=name%3Dyour%20name%0D%0Amail%3Dxxx%40gmail.com%0D%0Acomment%3Dyour%20comment%0D%0A
I am not able to resolve this issue. Any suggestions or help would be appreciated.
I think you should use email composer Plugins to send email.
SMSComposer plugin

have form act as a simple redirect (HTML/PhoneGap)

I'm making a prototype and the manipulation of the url when submitting a form is causing me issues. I just want to redirect to the link but keep my styling.
<form method = "link" action="portal.html" class="forms">
<label>Username:</label>
<input type="text" name="username" />
<label>Password:</label>
<input type="password" name="password" />
<input type="submit" class="submit" />
</form>
I want the submit to act a a straight redirect.. w/ appending the ?username=&password= to the redirect.
If it makes a difference this is an html5 project for android using phonegap.
If I understood correctly, you just want to submit the form and go to another page, while appending the form's fields to the URL as a query string (?foo=bar&foo=bar). For that you have to declare your form's method as GET, like so:
<form method="GET" action="portal.html" class="forms">
EDIT: turns out the desired behavior is exactly the opposite.
To don't append a query string, you could set your form's method to POST
<form method="POST" action="portal.html" class="forms">

Categories

Resources