Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Vamos criar uma pagina que será a nossa pagina de calendario, ai cada adapta pro seu problema
Eu chamei a minha de agenda.asp
Primeirameste temos de recuperar o mes e ano que queremos visualizar, logico que isso deve ser passado pra pagina, mas veremos no decorrer da aulinha
o codigo abaixo alem de pegar o mes já trata os possiveis erros de tipo pois converte tudo pra inteiro, ja que o que vem da URL ou de um FORM geralmente é tratado como texto
ASP
-
[*]Mes = Request("Mes")
[*]Ano = Request("Ano")
[*]IF Mes = "" THEN
[*] Mes = MONTH(NOW)
[*]END IF
[*]
[*]IF Ano = "" THEN
[*] Ano = YEAR(NOW)
[*]END IF
[*]
[*]Mes = CINT(Mes)
[*]Ano = CINT(Ano)
agora vamos ter que descobrir em que dia da semana começa o mes, pra poder montar o calendario corretamente
o codigo abaixo concatena o um com o mes e ano passados pra termos o primeiro dia do mes em questão
ASP
-
[*]PrimeiroDiaSemana = WEEKDAY("1"&"/"&Mes&"/"&Ano)
agora precisamos saber quantos dias tem o mes certo??
então tá o codigo abaixo faz isso, muitos ja devem um dia ter feito esta acoxambrada de passar pro proximo mes e voltar um dia ta ai o codigo
ASP
-
[*]UltimoDia = DAY(DateAdd("d",-1,DateAdd("m",1,"1" & "/" & Mes & "/" & Ano)))
a função abaixo é usada pra montar links para o proximo mes e para o anterior
ela usa o Mes pego ali em cima
ASP
-
[*]SELECT CASE Mes
[*]CASE 1
[*] MesProximo = Mes + 1
[*] AnoProximo = Ano
[*] MesAnterior = 12
[*] AnoAnterior = Ano - 1
[*]CASE 12
[*] MesProximo = 1
[*] AnoProximo = Ano + 1
[*] MesAnterior = Mes - 1
[*] AnoAnterior = Ano
[*]CASE ELSE
[*] MesProximo = Mes + 1
[*] AnoProximo = Ano
[*] MesAnterior = Mes - 1
[*] AnoAnterior = Ano
[*]END SELECT
aqui eu tou montando o que vou colocar no link lá em baixo
ASP
-
[*]Proximo = "?Mes=" & MesProximo & "&Ano=" & AnoProximo
[*]Anterior = "?Mes=" & MesAnterior & "&Ano=" & AnoAnterior
eu fiz o calendario usando DIV, esta parte voces definem como fazer se com DIV ou tabelas
só lembro que com divs voces devem ajustar as medidas pra ficar tudo certo senão não vai nem ficar com cara de calendario, esta parte como diz o tio salgado é perfumaria, eu fui testando o layout pra ficar legal, vou mandar esta aprte na integra e cada um faz a adaptação
vou até colocar a parte do css que interessa, mas digo que ta com a minah cara, ou seja do meu jeito cada um faz do seu depois só estou colocando pra voce conseguirem visualizar pelo menos parecido com o que eu fiz
[CSS]
#centroopcao{
text-align:center;
width:100%;
height:auto;
margin:0px 0px 3px 0px;
}
#titulonormal{
text-align:left;
font-size:12px;
font-weight: normal;
padding:3px 5px 3px 5px;
border:1px solid #000000;
}
#descricaoagenda{
float:left;
text-align: center;
font-size:14px;
width:215px;
margin:0px;
padding:5px 30px 5px 5px;
border-:1px solid #000000;
}
#celulaagendames{
float:left;
width:210px;
height:30px;
font-weight: bold;
background:#FFFFFF;
color:#000000;
margin:0px;
padding:3px;
border:1px solid #000000;
}
#celulaagendadia{
float:left;
width:30px;
height:30px;
font-weight: bold;
background:#666666;
color:#000000;
margin:0px;
padding:3px;
border:1px solid #000000;
}
#celulaagenda{
float:left;
width:30px;
height:30px;
font-weight: bold;
background:#FFFFFF;
color:#000000;
margin:0px;
padding:3px;
border:1px solid #000000;
}[/CSS]
ASP
-
[*]<div id="centroopcao">
[*] <div id="titulonormal">[*]
[*] <div id="descricaoagenda">
[*]
[*] <div id="celulaagendames">
[*] <%=NomeMes(Mes) & " de " & Ano%>
[*] </div>
[*]
[*]<div id = "celulaagendadia">D</div>
[*]<div id = "celulaagendadia">S</div>
[*]<div id = "celulaagendadia">T</div>
[*]<div id = "celulaagendadia">Q</div>
[*]<div id = "celulaagendadia">Q</div>
[*]<div id = "celulaagendadia">S</div>
[*]<div id = "celulaagendadia">S</div>[*]
[*]<%
[*]I = 1
[*]WHILE I <= UltimoDia
[*]
[*]FOR J = 1 TO 7
[*] IF (I = 1 AND J < PrimeiroDiaSemana) OR (I > UltimoDia)THEN
[*]%>
[*] <div id = "celulaagenda"> </div>
[*]<%
[*] ELSE
[*]%>
[*] <div id = "celulaagenda"><%=I%></div>
[*]<%
[*]
[*] I = I + 1
[*] END IF
[*]NEXT
[*]
[*]WEND
[*]%>
[*]
[*]</div>
aqui volta a comentar que como fiz com DIV deve ta tudo bem feitinho pra parecer um calendario, com tabela o layout ficaria mais simples de fazer pois ai se define de cara 7 colunas e pronto e eu não fiz assim
vamos adiante
agora só faz os links pros outros meses né??
então tá ai
ASP
-
[*]<%
[*]Response.Write " <a href=agenda.asp" & Anterior & ">« Mês Anterior</a> "
[*]Response.Write " <a href=agenda.asp" & Proximo & ">Próximo Mês »</a> "[*]Response.Write " Outro Mês: "
[*]%>
[*] <select name="Mes" size="1" style="FONT-WEIGHT: bold; FONT-SIZE: 8px; COLOR: #000000; BACKGROUND-COLOR: #ffffff">
[*] <option value="1"<%IF Mes = 1 THEN response.write " selected" END IF%>>Janeiro</option>
[*] <option value="2"<%IF Mes = 2 THEN response.write " selected" END IF%>>Fevereiro</option>
[*] <option value="3"<%IF Mes = 3 THEN response.write " selected" END IF%>>Março</option>
[*] <option value="4"<%IF Mes = 4 THEN response.write " selected" END IF%>>Abril</option>
[*] <option value="5"<%IF Mes = 5 THEN response.write " selected" END IF%>>Maio</option>
[*] <option value="6"<%IF Mes = 6 THEN response.write " selected" END IF%>>Junho</option>
[*] <option value="7"<%IF Mes = 7 THEN response.write " selected" END IF%>>Julho</option>
[*] <option value="8"<%IF Mes = 8 THEN response.write " selected" END IF%>>Agosto</option>
[*] <option value="9"<%IF Mes = 9 THEN response.write " selected" END IF%>>Setembro</option>
[*] <option value="10"<%IF Mes = 10 THEN response.write " selected" END IF%>>Outubro</option>
[*] <option value="11"<%IF Mes = 11 THEN response.write " selected" END IF%>>Novembro</option>
[*] <option value="12"<%IF Mes = 12 THEN response.write " selected" END IF%>>Dezembro</option>
[*] </select>[*]
[*] <select name="Ano" size="1" style="FONT-WEIGHT: bold; FONT-SIZE: 8px; COLOR: #000000; BACKGROUND-COLOR: #ffffff">
[*]<%
[*]FOR I = 1900 TO YEAR(NOW()) + 5
[*]%>
[*] <option value="<%=I%>" <%IF Ano = I THEN response.write " selected" END IF%>><%=I%></option>
[*]<%
[*]NEXT
[*]%>
[*] </select>
[*] <input name="btnOk" type="image" id="btnOk" src="../imagens/ok.jpg" width="15" height="15" border="0">não esqueçam de criar o form...
ai em cima usei uma imagem pro submit mas pode-se usar um simples botão mesmo, e a action é pra propria pagina logico onde lá em cima (lembram??) nós verificamos o mes passado e montamos o calendario
Bem galera ta ai o nosso Calendario
By Mario Monteiro
Carregando comentários...