Array
(
)

Controle de criar menu personalizado em ASP.NET

Claudiomagalhaes
   - 20 ago 2008

Bom dia galera!

Alguém aí conhece um bom controle (freeware é claro) para criação de Menus Personalizados (estáticos e dinâmicos) no ASP.NET?

É que não gosto (acho muito feio) daquele que vem no Visual Studio 2005/2008.

Alguém sabe onde posso baixar um bem legal?

Ricardo Silva
   - 20 ago 2008

ve se vc gosta desse...

http://www.extjs.com/deploy/dev/examples/menu/menus.html

Claudiomagalhaes
   - 20 ago 2008

Gostar até que gostei!

Mas como uso?

É que sou novo na linguagem!
Sabe como é né?

Pode me dar uma dica?

Ricardo Silva
   - 20 ago 2008

na verdade o Extjs é um FrameWork em JavaScript Puro, não tem nada de PHP ou asp.Net ao contrario, o Php, aspNet e outras tantas linguagens que as utiliza, pois este frameWork tem varisas funçoes ja implementadas....
a documentação dele é bem vasta porem em ingles, tem um forum brasileiro

os cara são bons
http://extjs.com.br/forum/

Ricardo Silva
   - 20 ago 2008

bom...

vc primeiro precisade de tres arquivos principais...
- ext-all.css
- ext-base.js
- ext-all.js
para manter o visual elegante do ext vc precisa tambem das imagens dele que esta na pasta imageseste tambem tem que estar no seu projeto

adicione em seu projeto para que fiquem com essa hierarquia
-> Nomeprojeto
-> css
-> ext-all.css
-> images
-> default
-> //todas as imagens
-> js
-> ext-all.js
-> ext-base.js
-> Default.aspx

até aqui axo q naum tem nenhum segredo....
agora adicione na pasta js um arquivo do tipo js xamado menu.js
e acresente esse codigo

Citação:

Ext.onReady(function(){
Ext.QuickTips.init();

// Criando o menu
var menuPrincipal = new Ext.Toolbar();
// Local onde será rederizado o menuPrincipal
menuPrincipal.render(´menuRender´);

//SubMneu
var subMenuCadatasro = new Ext.menu.Menu({
id: ´menuLancamentos´,
items: [
{text: ´Clientes´ , handler: function(){ openCadCli(); }},
{text: ´Empresas´ , handler: function(){ }},
{text: ´Fornecedores´, handler: function(){ }},
{text: ´Produtos´ , handler: function(){ }},
{text: ´Vendedores´ , handler: function(){ }}
]
});

// adicionando botões no painel
menuPrincipal.add(
{text: ´Cadastros´, menu: subMenuCadatasro}
);
});
function openCadCli(){
var win = new Ext.Window({
title : ´Cadasdro de Clientes´,
layout : ´fit´,
width : 500,
height : 300,
closeAction :´hide´,
plain : false,
buttons: [{
text : ´Submit´,
disabled : true
},{
text : ´Close´,
handler : function(){
win.close();
}
}]
});
win.show();
}

Blz???

agora altere o arquivo Default.aspx para:
#Código

<¬@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" ¬>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    [b]<link rel="stylesheet" type="text/css" href="css/ext-all.css" />
    <script type="text/javascript" src="js/ext-base.js"></script>
    <script type="text/javascript" src="js/ext-all.js"></script>
        
    <script type="text/javascript" src="js/menu.js"></script>[/b]
</head>
<body>
    <form id="form1" runat="server">
    [b]<div id="menuRender"></div>[/b]
    </form>
</body>
</html>

normalmente vc soh vai precisar adicionar o que estiver em negrito

execute seu projeto e ve o que acontece...
espero que funcione, pois praticamente fiz de cabeça

na duvida soh posta

Ricardo Silva
   - 20 ago 2008

o site deu uma bagunçada no meu post

hierarquia do projeto
#Código

-> Nomeprojeto
   -> css
      -> ext-all.css
   -> images
      -> default
         -> //todas as imagens
   -> js
      -> ext-all.js
      -> ext-base.js
      -> menu.js
-> Default.aspx