Okay so I have a piece of Ajax code that I am looping every 1 second to receive the updated value from a PHP file.
The AJAX response works fine on my laptop the value I receive back is updated in the input field for the id "Type Number", but on mobile I just receive a blank input field.
When I alert the value and test it on the mobile the alert shows the correct value, but just don't seem to be able to get the value into the input field.
Note I am using twitter bootstrap 3 for the design I am showing a different layout for xs and sm and a different one for md and lg, but the input field id's are the same, as I have to disable some input fields so they cannot run certain functions on mobile.
AJAX
<script type='text/javascript'>
var interval = 1000;
function doAjax() {
$.ajax({
type: 'GET',
url: 'type_number.php',
dataType: 'html',
success: function (data) {
$('#type_number').val(data);
},
complete: function (data) {
// Schedule the next
setTimeout(doAjax, interval);
}
});
}
setTimeout(doAjax, interval);
</script>
HTML
<div class='input-group'>
<span class='input-group-addon'>SIN</span>
<input type='text' name='type_number' id='type_number' class='form-control' disabled></div><br>
I have searched on here to try and find a solution but haven't came across anything, just a few responses saying that javascript on mobile is limited which I understand but I have a function in my code which is an onclick event which puts the value of a div into a input field and that works fine on the mobile. So not sure why the AJAX response can't do the same.
