Mój cel (którego nie mogę osiągnąć): wiele inputów radio na stronie, po kliknięciu któregokolwiek wyświetla się loader, wykonuje się ajax typu post który trwa 2-3 sekundy (koniecznie z parametrem async:false), skrypt robi kilka operacji na otrzymanych danych (ale to wyciąłem i dalej nie działa), loader znika.
Problem: w FF działa idealnie, w IE (każdym!) po kliknieciu w radio robi się taki jak tylko po mousedown (jakbysmy nacisneli lpm na radio i nie puszczajac opuscili radio), w takim stanie zostaje przez czas oczekiwania na odpowiedz od ajaxa, loader się nie wyświetla, ajax konczy dzialanie, wtedy dopiero radio wyglada jak faktycznie wciśnięte. Loadera nie widać ani przez moment.
Kod:
strona:
Kod
<form>
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
</form>
<img class="loadin" src="<?=base_url()?>images/ajax-loader.gif" style="display:none" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
<input type="radio" name="nazwa" />
</form>
<img class="loadin" src="<?=base_url()?>images/ajax-loader.gif" style="display:none" />
1 próba:
Kod
$(document).ready(function() {
$("input[type='radio']").click(function() {
$(".loadin").show();
$.ajax({
type: "POST",
url: "tu jest url",
async: false,
data: ({xxx : 'xxx'}),
success: function(msg){$("body").append(msg)}, //to tak przykladowo
error: function() {return 0;}
});
$(".loadin").hide();
});
});
$("input[type='radio']").click(function() {
$(".loadin").show();
$.ajax({
type: "POST",
url: "tu jest url",
async: false,
data: ({xxx : 'xxx'}),
success: function(msg){$("body").append(msg)}, //to tak przykladowo
error: function() {return 0;}
});
$(".loadin").hide();
});
});
2 próba:
Kod
$(document).ready(function() {
$("input[type='radio']").click(function() {
$.ajax({
type: "POST",
url: "tu jest url",
async: false,
data: ({xxx : 'xxx'}),
beforeSend: function(){$(".loadin").show();},
complete: function(){$(".loadin").hide();},
success: function(msg){$("body").append(msg)},
error: function() {return 0;}
});
});
});
$("input[type='radio']").click(function() {
$.ajax({
type: "POST",
url: "tu jest url",
async: false,
data: ({xxx : 'xxx'}),
beforeSend: function(){$(".loadin").show();},
complete: function(){$(".loadin").hide();},
success: function(msg){$("body").append(msg)},
error: function() {return 0;}
});
});
});
3 próba:
Kod
$(document).ready(function() {
$(".loadin").ajaxStart(function(){
$(this).show();
});
$(".loadin").ajaxStop(function(){
$(this).hide();
});
$("input[type='radio']").click(function() {
$.ajax({
type: "POST",
url: "tu jest url",
async: false,
data: ({xxx : 'xxx'}),
success: function(msg){$("body").append(msg)},
error: function() {return 0;}
});
});
});
$(".loadin").ajaxStart(function(){
$(this).show();
});
$(".loadin").ajaxStop(function(){
$(this).hide();
});
$("input[type='radio']").click(function() {
$.ajax({
type: "POST",
url: "tu jest url",
async: false,
data: ({xxx : 'xxx'}),
success: function(msg){$("body").append(msg)},
error: function() {return 0;}
});
});
});
Pomysły? Czy to tylko wspaniałomyślność (it's not a bug, it's a feature!) firefoxa, że to zadziało, czy błąd ie?