Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal, gostaria de um suporte de vocês.
Estou tentando usar um menu de abas no sistema que estou desenhando, mas ele está dando conflito com o DatePicker que uso. Já tentei usar o jQuery no.Conflict(), mas não dei sorte. Vocês sabem me dizer o que é?
Tentei me basear pelo artigo abaixo.
http://imasters.com.br/artigo/13871/jquery/evitando-conflitos-com-jquerynoconflict
Se eu comento as linhas que puxam o DatePicker, ele funciona, mas com elas...
O DatePicker que estou usando é esse daqui:
http://stefangabos.ro/jquery/zebra-datepicker/
Segue os jQueries que uso abaixo. Os DatePickers são puxados logo no começo e o de abas lá no final.
// -- ////////;///////////// GRID VIEW //////////////////////// -- //
$(document).ready(function () {
PintaGrid();
$('.datePicker').Zebra_DatePicker({
format: 'd M, Y'
});
$('.datePicker2').Zebra_DatePicker({
format: 'F, Y'
});
});
function PintaGrid() {
$('.gridView').find('tr:odd').css({ 'background-color': '#e6f2ff' });
$('.gridView').find('tr:first td').css({ 'background-color': '#72a1d5', 'font-weight': 'bold', 'color': '#FFF', 'font-size': '12px' });
$('.gridView').find('tr:first th').css({ 'background-color': '#72a1d5', 'font-weight': 'bold', 'color': '#FFF', 'font-size': '12px' });
$('.gridRodada tr').find('td:first').css({ 'width': '90px' });
$('.gridRodada tr').find('th:first').css({ 'width': '90px' });
}// -- ////////;///////////// MODAL DO BALÃO //////////////////////// -- //
var aberto = 0;
function abremenu(id, classrel) {
if (id != "") {
if (aberto == 0) {
$(id).fadeIn(300);
aberto = 1;
} else {
$(id).fadeOut(300);
aberto = 0;
}
}
}// -- ////////;///////////// MENU DE ABAS //////////////////////// -- //
$(document).ready(function () {
$('.tabs a').click(function () {
switch_tabs($(this));
});
switch_tabs($('.defaulttab'));
});
function switch_tabs(obj) {
$('.tab-content').hide();
$('.tabs a').removeClass("selected");
var id = obj.attr("rel");
$('#' + id).show();
obj.addClass("selected");
}Tentei trocar a variável para $a como o artigo havia instruído, mas nada aconteceu.
Segue a tentativa:
var $a = jQuery.noConflict()
$a(document).ready(function () {
$a('.tabs a').click(function () {
switch_tabs($a(this));
});
switch_tabs($a('.defaulttab'));
});
function switch_tabs(obj) {
$a('.tab-content').hide();
$a('.tabs a').removeClass("selected");
var id = obj.attr("rel");
$a('#' + id).show();
obj.addClass("selected");
}Alguém consegui me dar uma "luz"?
Então William, eu só carrego uma vez os códigos. O meu <head> é assim:
<head runat="server">
<title></title>
<link href="Scripts/css/cssGeral.Css" rel="stylesheet" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="Scripts/js/jsGeral.js" type="text/javascript"></script>
</head>Esse jsGeral.js é o arquivo que eu carrego as jQueries que postei lá em cima.
Ok, então vamos entender oque realmente está acontecendo.
Aperte Ctrl+Shift+J no Firefox, veja os erros que aparecem.
http://wbruno.com.br/2011/03/31/como-debugar-javascript-firefox-erros-comuns/
Nota: teu problema não é conflito.
Então, aparece o seguinte esse no Firefox:
Hora: 29/10/2012 16:05:32
Erro: TypeError: $(".datePicker").Zebra_DatePicker is not a function
Arquivo-fonte: http://localhost:63083/RodadaNegocios/Scripts/js/jsGeral.js
Linha: 7
Ele reclama justamente do Datepicker. Mas o estranho é que o DatePicker funciona sem problemas, mas o menu de abas só funciona se eu comentar a linha que puxa o DatePicker.
Você sabe o que é?
esse erro é pq você não importou o arquivo que declara esse DatePicker.
Corrija esse erro. =)
E pode esquecer o noConflict. Deixa normal
Hummmmmmmmmmmmmmmmmmmmmm....
Né que funcionou mesmo rsrs
Muito obrigado.
Eu não estava carregando ele porque estou tentando carregar apenas o essencial em cada página, para que ela fique o mais leve possível.
Vou adaptar os códigos aqui.
Obs: tópico resolvido!!
ambos são jQuery ?
então você não tem um conflito. Apenas importe uma única vez a lib jQuery.