HTML & CSS Page Refreshing on a Mobile Browser

[Gazza58]

Hello,

I hoping someone can assist me with some guidance on an issue I have with a Webpage.

I have developed a Website for a Skittle League (Sports League) and have some forms that allow the Result Card to be submitted to the Result Secretary.

There are some Free Text Boxes as well as a Drop Down Menu to allow Selections

This works fine on a PC; however when using a Mobile Browser on a phone or Tablet, as soon as a Free Text box is selected the page refreshes and any data entered in lost.

From what I have read this is to do with a pull down to refresh feature in Mobile browsers; is it possible to prevent the page refreshing?

One of the pages is www.stroudskittles.co.uk/scorecard.php

Any advice and help on this would be appreciated

Thanks

 

[marv]

im not sure preventing the page is the correct or simplest way to go about this. i think using something like this to save the other data thru the refresh would be the better way. ;D
[CODE title="jQuery: Save whole form Data"]var formData = {
set : function (){
var formData = []; // Here we are defining the array of elements
localStorage.removeItem('formData ');
$('form input[type=text]').each(function(){
//loop through form input fields
formData .push({ name: this.name, value: this.value});
});
//here we are converting whole array to json
localStorage.formData = JSON.stringify(formData);
},

get : function (){
if(localStorage.formData != undefined){
formData = JSON.parse(localStorage.formData);
for (var i = 0; i < formData.length; i++) {
$('[name='+formData[i].name+']').val(formData.value);
}
}
}
}
formData.get(); // method to call form data from FORM, when page loaded
$("input").change( function() {
formData.set(); // method to set input data on change
});[/CODE]
took this from google let me know if you need a hand.