Hybrid android application break

Nimesh

I’ve developed web application with onsenui, it is working fine on ios but due to some reason unexpected behaviour on android device.

My code is simple as below:

<!doctype html>

<head>

</head>

<body>

<ons-modal var=“loader”>
<div class=“myloader”></div>
</ons-modal>

<ons-modal var=“loaderSearch”>
<div class=“myloader”></div>
</ons-modal>

<ons-modal var=“loaderLang”>
<div class=“myloader”></div>
</ons-modal>

<ons-navigator id=“kSettingsNavigator” page=“signup.html”>
</ons-navigator>

<ons-toolbar>
<div class=“left”><ons-back-button></ons-back-button></div>
<div class=“center white”><span id=“search-text” class=“trn” data-trn-key=“register”>Register</span></div>
</ons-toolbar>

<form id="frm-signup" class="frm-signup" method="post"> 
<input type="hidden" name="next_steps" class="next_steps">
   
<div class="wrapper">
   <div class="field-wrapper">
   <input type="text" name="first_name" id="first_name" class="first_name text-input text-input--underbar has_validation" 
   placeholder="First Name" value="" data-validation="required" data-validation-error-msg="This field is mandatory!" >
   </div>

   <div class="field-wrapper">
   <input type="text" name="last_name" id="last_name" class="last_name text-input text-input--underbar has_validation" 
   placeholder="Last Name" value="" data-validation="required" data-validation-error-msg="This field is mandatory!"  >
   </div>   
   
   <div class="field-wrapper">
       <input type="text" name="email" id="email" class="email_address text-input text-input--underbar has_validation" 
       placeholder="Email address" value="" data-validation="required" data-validation-error-msg="This field is mandatory!" >
   </div>
  
   <span id="emailerror" style="color:red; display: block;font-size: 12px;text-align: left;"></span>
</div>

<button class="button green-btn button--large trn" onclick="signup();">

Sign Up
</button>
</form>

</ons-page>
</script>

 <ons-toolbar>        
  <div class="left"><ons-back-button></ons-back-button></div>             
  <div class="center white"><span id="search-text" class="trn" data-trn-key="register">WRISTBAND ID</span></div>                  
 </ons-toolbar>
     
 
 <form id="frm-wristband" class="frm-wristband" method="post">   
  <input type="hidden" name="next_steps" class="next_steps">
     
  <div class="wrapper">
    <div class="field-wrapper">
    </div>       
 </div>
 <div class="wrapper">
  <div class="field-wrapper">
  </div>       
 </div>


  <div class="wrapper">
     <div class="field-wrapper">
     <input type="text" name="wristband_Id" Id="wristband_Id" maxlength="14" class="wristband_Id text-input text-input--underbar has_validation"  
      placeholder="Wristband ID(Top ID, 14 digits)" value="" data-validation="required" data-validation-error-msg="this field is mandatory!" >
     
     
     </div>        
    
  </div>
  
  <button class="button green-btn button--large trn" onclick="wristband();" data-trn-key="wristband">
 Save Details
 </div>
  </button>
  <span class="spanwristband"></span>
  </form>

</ons-page>
</script>

</body>

on form submit:

function signup() {

$.validate({
	form: '#frm-signup',
	borderColorOnError: "#FF0000",
	onError: function (err) {
		
	},
	onSuccess: function () {

		//For emailvalidation
		var emailId = $("#email").val();
		var regex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
		if (!regex.test(emailId)) {
			$("#emailerror").html('Email format is not valid!')
			return false;

		}

		var params = $("#frm-signup").serialize();

		var mac = getQueryStringValue('mac');
		params += "&device_id=" + mac;

		//callAjax("Signup", params, true);

		setStorage("mac", mac);
		setStorage("firstname", $("#first_name").val());
		setStorage("lastname", $("#last_name").val());
		setStorage("email", $("#email").val());

		var options = {
			animation: 'slide',
			onTransitionEnd: function () {
				initSlideMenu();
			}
		};
		document.getElementById('kSettingsNavigator').resetToPage('wristband.html');
		return false;
		
		
	}
});

}

where i’m calling reset to page to redirect page to another page and it only works on ios as expected,
tested on android 8.1 page just reload and can’t redirect to another page.

thanks in advance.

emccorson

Can you provide a working example of this in the playground please? https://onsen.io/playground/

Or if that’s not possible, please host the code somewhere so I can run it on an Android device.

It can’t be run as currently posted because some libraries are missing. Once I can run it, I should be able to see what the problem is.

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Hybrid android application break

on form submit: