A minha situação é assim: Tenho uma página em ASP que monta uma table. E tenho outra, também em ASP que tem umas funções, que fazem o seguinte. Disponibiliza um html para popular a table. Coloquei um modal jquery e dá erro. Diz que não reconhece a função jquery como função. A primeira página que eu estou postando é a página principal, e nela eu coloquei as funçõe js/jquery e a chamada.
<html>
<head>
<title><%=Application("app")%></title>
<link rel="stylesheet" type="text/css" href="\gen\css\css002.css">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
<script type="text/javascript" src="\cal\asp\cal0087.js"></script>
<script type="text/javascript" src="\cal\asp\cal0088.js"></script>
<script src="../../gen/js/cpaint2.inc.compressed.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$( "#dialog" ).dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000
},
hide: {
effect: "explode",
duration: 1000
}
});
$( "#btnLupa" ).click(function() {
$( "#dialog" ).dialog( "open" );
});
});
</script>
<!--Fim do testando o modal do jquery UI-->
</head>
<body>
<%AbreTable()%>
<font class="subtitulos"><%=txt_subtitulo%></font>
<%FechaTable()%>
<form method="post" name="form01">
<%AbreTable()%>
<div id="txt_msg" class="msg" align="center"><%=txt_msg%></div>
<table border="0" width="100%">
<%
montaOpSucInspetoria()
montaContrato()
MontaContrato() está em outra página que vou postar embaixo. Esse método só faz é fornecer uma <tr>
e as <td>
dessa <tr>
da table acima. Nesse método há uma imagem(lupa.gif
) e no OnClick
dele deveria chamar a função jquery que está na página principal.
sub montaContrato()
%>
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
<tr>
<td class="label_right" nowrap>Contrato </td>
<td>
<input type="text" name="num_contrato" value="" size="15" maxlength="17" tabindex="1" OnKeyPress="javascript:MascAlfaNum()" OnKeyDown="TeclaEnter()" onchange="PesquisaContratoMontaFilial();">
<!--<img id='' style='display:; cursor:hand' name='Pesquisa_Contrato' width='16' height='16' src='/gen/mid/lupa.gif' border='0' alt='Pesquisa Contrato' onClick="javascript:AbrePesquisa('/GEN/ASP/GEN0001a.asp?ind_situacao=&tipo_empresa=&ind_classificacao=&p_cod_tipo_contrato=&indsubmit=false&txt_nome_campo_cod=num_contrato&txt_nome_campo_cod_ts=cod_ts_contrato&txt_nome_campo_desc=nome_contrato&ind_tipo_pessoa=J&funcao_executar=PesquisaContratoMontaFilial();&abre_modal=S&ind_alteracao_contrato=&tipo_preco=','Pesquisa_Contrato','Pesquisa Contrato', 700, 500, 20, 15, 'S')">-->
<img id='btnLupa' style='display:; cursor:hand' name='Pesquisa_Contrato' width='16' height='16' src='/gen/mid/lupa.gif' border='0' alt='Pesquisa Contrato'>
<input type="text" name="nome_contrato" value="" size="50" tabindex="-1" Readonly class="camposblocks">
<input type="hidden" name="cod_ts_contrato" value="">
<input type="hidden" name="ind_tipo_pessoa" value="J" />
</td>
</tr>
<%
end sub
No lugar da <div id="dialog">
deveria ser um IFrame e nele uma chamada a uma página de pesquisa que temos aqui. Há um comentário na imagem da lupa.gif e nesse comentário está exatamente o que deveria ser carregado. Eu coloquei a div
apenas para teste. Abaixo os erros que estão dando:
Uncaught TypeError: $(...).dialog is not a function
e esse erro
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://10.104.33.247/gen/css/Default/css002.css".
Vi os includes do js e css, coloquei a mesma versão que está no fiddle que eu fiz e funciona. Esse exemplo tirei diretamente do site jquery-ui.
Fiz isso aqui e mesmo assim continua dando o mesmo erro:
<script type="text/javascript">
$(document).ready(function(){
$(function () {
$("#dialog1").dialog({
autoOpen: false
});
$("#opener").click(function () {
$("#dialog1").dialog('open');
});
});
})
</script>
Meu novo HTML como está e mesmo assim continua o erro. A função jquery já coloquei em baixo onde estão as demais, em cima onde está e continua:
<%@ LANGUAGE="VBSCRIPT"%>
<%
Option Explicit
dim txt_usuario, txt_senha, txt_ip, txt_modulo, txt_sistema, txt_msg
dim rsPesqBenef, txt_subtitulo, txtXML, qtdIni, qtdFim, sBgColor
dim data_atendimento_ini, data_atendimento_fim, data_atual
dim txt_situacao, txt_origem_atendimento
txt_usuario = Session("ace_usuario")
txt_senha = Session("ace_senha")
txt_ip = Session("ace_ip")
txt_sistema = Session("ace_sistema")
txt_msg = Session("txt_msg")
txt_subtitulo = request("pt")
'OBS.: A session("ace_modulo") só é atualizada no refresh da tela.
if request("pcf") = "ATB0084" then
Session("ace_modulo") = "40"
elseif request("pcf") = "ATC0007" then
Session("ace_modulo") = "47"
end if
txt_modulo = Session("ace_modulo")
Session("txt_msg") = ""
session("pgm_retorno") = Request.ServerVariables("SCRIPT_NAME") & "?" & Request.ServerVariables("QUERY_STRING")
recuperaDataAtual()
if data_atendimento_ini = "" or data_atendimento_fim = "" then
call recuperaDateDiffporparmetro("7")
end if
%>
<html>
<head>
<title><%=Application("app")%></title>
<link rel="stylesheet" type="text/css" href="\gen\css\css002.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="\cal\asp\cal0087.js"></script>
<script type="text/javascript" src="\cal\asp\cal0088.js"></script>
<script src="../../gen/js/cpaint2.inc.compressed.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(function () {
$("#dialog1").dialog({
autoOpen: false
});
$("#opener").click(function () {
$("#dialog1").dialog('open');
});
});
})
</script>
</head>
<!--#include file="..\..\cal\asp\cal0088inc.asp"-->
<!--#include file="..\..\gen\inc\inc0077a.asp"-->
<!--#include file=..\..\gen\inc\inc0000_new.asp-->
<!--#include file=..\..\gen\inc\inc0001.asp-->
<!--#include file=..\..\gen\inc\inc0002.asp-->
<!--#include file=..\..\gen\asp\gen0146a.asp-->
<!--#include file=..\..\gen\asp\gen0146b.asp-->
<body>
<%AbreTable()%>
<font class="subtitulos"><%=txt_subtitulo%></font>
<%FechaTable()%>
<form method="post" name="form01">
<%AbreTable()%>
<div id="txt_msg" class="msg" align="center"><%=txt_msg%></div>
<button id="opener">Abrir Diálogo Modal</button>
<div id="dialog1" title="Diálogo Modal" hidden="hidden">Este é um teste de Dialogo Modal usando JQuery-UI</div>
<table border="0" width="100%">
<%
montaOpSucInspetoria()
montaContrato()
if txt_modulo = "40" then
montaNumBeneficiario()
end if
montaNumAtendimento("S")
montaDataAtendimento()
montaUsuarioAtendimento()
montaCboMotivoAtd()
montaCboSituacao()
%>
</table>
<%FechaTable()%>
<table border="0" width="100%">
<tr id="trResultConsAtdBeneficiario" style="display:''">
<td>
<div id="dvResultConsAtdBeneficiario"></div>
</td>
</tr>
</table>
<input type="hidden" name="p_versao" value="1.10">
<input type="hidden" name="qtd_de" value="">
<input type="hidden" name="qtd_ate" value="">
<input type="hidden" name="txt_subtitulo" value="<%=txt_subtitulo%>">
<input type="hidden" name="cod_modulo" value="<%=txt_modulo%>">
<script language="javascript">
function acao_continuar(){
if (validaForm()){
document.getElementById('txt_msg').innerHTML = '';
document.getElementById('txt_msg').style.display = 'none';
buscaAtendimentos();
}
}
function selecionarAtendimento(pNumAtendimentoTs, pCodTs, pCodEntidadeTs, pIndSituacao, pnumcpfbenefevent, pnom_benef_event) {
var strChamada = '../../cal/asp/cal0088b.asp?pt=<%=txt_subtitulo%>';
strChamada +='&num_atendimento_ts='+pNumAtendimentoTs;
strChamada +='&cod_entidade_ts='+pCodEntidadeTs;
strChamada += '&num_cpf_benef_event=' + pnumcpfbenefevent;
strChamada += '&nom_benef_event=' + pnom_benef_event;
if ( form01.cod_modulo.value == '40' ){
strChamada +='&cod_ts='+pCodTs;
}else if ( form01.cod_modulo.value == '47' ) {
strChamada +='&cod_ts_contrato='+pCodTs;
}
document.form01.action = strChamada;
document.form01.submit();
}
</script>
</form>
<%
'VOLTAR/CONTINUAR/LIMPAR/INCLUIR/ALTERAR/EXCLUIR/EXECUTAR/POPUP
call MontaToolbar("N","S","S","N","N","N","N","N")
%>
</body>
</html>
<%
sub MontaCalendario(pCampo)
%>
<img src="/gen/img/img.gif" id="img_<%=pCampo%>"
style="cursor: pointer; border: 1px solid red;"
title="Selecionar data" onmouseover="this.style.background='red';"
onmouseout="this.style.background=''" />
<script>
Calendar.setup({
inputField : "<%=pCampo%>",
ifFormat : "%d/%m/%Y",
button : "img_<%=pCampo%>",
align : "Tl",
singleClick : true
});
</script>
<%
end sub
%>
$( "#dialog" ).dialog({})
deve estar rodando antes da página ser renderizada e a<div id="dialog">
ser criada, por via das dúvidas, eu colocaria a tagdefer="defer"
no script que chama sua função$.dialog()