jQuery e Ajax problema con risposta su dispositivi mobili
Salve popolo di altervista! Eccomi qui di nuovo a chiedere il vostro preziosissimo aiuto: mi sono trovato ad implementare una nuova template per il mio sito e sto usando un modello Bootstrap, fin qui tutto ok, ma adesso che vorrei usare il metodo Ajax per il login e per visualizzare la risposta sulla medesima pagina anzichè crearne un altra per l'apposita funzione: sui dispositivi mobili non visualizzo nessuna risposta, ovvero il div non si aggiorna rimane sempre vuoto.
Ho provato con diversi dispositivi: tablet, android e iOS ma il risultato è sempre lo stesso, mentre con il PC visualizzo tutto correttamente.
Ecco il codice che uso, JS:
Codice:
/* Controllo Campi login */
$('#invialogin').click(function(e) {
var formStatus = $('#username').val();
var pswcheck = $('#password').val();
if(formStatus === ""){
$("#BoxAlert").attr('class', 'alert alert-danger');
$("#BoxAlert").html('Il campo <b>Username</b> non può essere vuoto!');
$('#BoxAlert').show();
return false;
}
else if(pswcheck === "") {
$("#BoxAlert").attr('class', 'alert alert-danger');
$("#BoxAlert").html('Il campo <b>Password</b> non può essere vuoto!');
$('#BoxAlert').show();
return false;
}
else {
inviaLogin();
}
});
/* Funzione Login */
function inviaLogin()
{
var username = $("#username").val();
var password = $("#password").val();
$.ajax({
url: "include/ajax/login.php",
cache: false,
type: 'POST',
data: "username= " + username + "&password="+ password +"",
dataType: "html",
beforeSend: function()
{
$('#BoxAlert').html("Perfavore attendi <img src='img/loading.gif' />");
},
success: function(response)
{
console.log(response);
$('#BoxAlert').hide();
$("#BoxRisposta").html(response);
}
});
}
Codice HTML dei DIV e dei FORM:
Codice HTML:
<div class="col-md-10 col-md-offset-1">
<div class="alert alert-default" id="BoxAlert"></div>
</div>
<div class="col-md-10 col-md-offset-1" id="BoxRisposta">
</div>
<div class="box-content"> <h4 class="heading-primary text-uppercase mb-3">Login</h4> <div class="form-row"> <div class="form-group col"> <label>Nome Utente</label> <input type="text" value="" class="form-control form-control-lg" id="username"> </div> </div> <div class="form-row"> <div class="form-group col"> <a class="float-right" href="#">Non ricordi la password?</a> <label>Password</label> <input type="password" value="" class="form-control form-control-lg" id="password"> </div> </div> <div class="form-row"> <div class="form-group col-lg-6 "> <input type="submit" value="Login" class="btn btn-primary mb-5" onClick="inviaLogin();" id="invialogin"> </div> </div> <div class="form-row"> <div class="login-link"> <span class="paragraph-small">Non hai un account?</span> <a href="#" class="">Registrati gratis!</a> </div> </div>
</div>
