FlavioMuniz » Blog

Combobox de Estados e Cidades com jQuery

flaviomuniz — Fri, 30 Jul 2010 01:03:26 +0000

Olá,
Eu sei que todo mundo ja teve uma vez, algum problema com combobox de estados e cidades brasileiras,
utilizamos varias técnicas com ajax para fazer isso, mas hoje, vou mostra uma maneira muito mais simples
e muito mais rapida, utilizando a jQuery.

Primeiramente, não precisa ser nenhum expert em jQuery para fazer isso, basta conhecer as funções
e saber para que elas server, e com isso, só botar a criatividade em prática.

Bom, vamos la, primeiro, vou postar o código da jQuery, que é o mais facil.”colocar dentro de estados.php”

<script type="text/javascript">// 

    $(document).ready(function(){

        $('#uf').change(function(){

            $('#cidades').load('cidades.php?uf='+$('#uf').val());

        });

    });

// ]]>

change, load e val();,

Agora, vamos montar o combobox de estado. “estados.php”

<select name="uf" id="uf">

    <option>Selecione o Estado</option>

    <option value="AC"> Acre</option>

    <option value="AL"> Alagoas</option>

    <option value="AP"> Amapá</option>

    <option value="AM"> Amazonas</option>

    <option value="BA"> Bahia</option>

    <option value="CE"> Ceará</option>

    <option value="DF"> Distrito Federal</option>

    <option value="GO"> Goiás</option>

    <option value="ES"> Espírito Santo</option>

    <option value="MA"> Maranhão</option>

    <option value="MT"> Mato Grosso</option>

    <option value="MS"> Mato Grosso do Sul</option>

    <option value="MG"> Minas Gerais</option>

    <option value="PA"> Pará</option>

    <option value="PB"> Paraiba</option>

    <option value="PR"> Paraná</option>

    <option value="PE"> Pernambuco</option>

    <option value="PI"> Piauí</option>

    <option value="RJ"> Rio de Janeiro</option>

    <option value="RN"> Rio Grande do Norte</option>

    <option value="RS"> Rio Grande do Sul</option>

    <option value="RO"> Rondônia</option>

    <option value="RR"> Rorâima</option>

    <option value="SP"> São Paulo</option>

    <option value="SC"> Santa Catarina</option>

    <option value="SE"> Sergipe</option>

    <option value="TO"> Tocantins</option>

</select>

Agora que temos todos os estados, incluindo o distrito federal,
vamos montar o option de cidades.
“cidades.php”

$valor_uf = $_GET['uf'];

mysql_connect('localhost','root','');

mysql_select_db('test');

$query = mysql_query("SELECT * FROM cidades WHERE uf = '".$valor_uf."'");

while($rs = mysql_fetch_array($query)){

echo "]."'>".$rs['nome']."";

}

?>

Pronto, temos um combobox de estado e cidade montado em menos de 10 minutos.

Veja o exemplo.

é isso ae, espero que tenham gostado, é bem simples, mas bem funcional.

Simples assim

Marcar e Desmarcar checkbox com a jQuery.

flaviomuniz — Thu, 15 Apr 2010 13:42:57 +0000

Olá, hoje vou mostrar uma forma simples de se trabalhar com checkbox com a jquery. Lembrando de sempre prestar atenção nos códigos que não tem erro.
Vamos lá, como sempre, vou postar o código e explicar em comentários o que cada linha faz, acho essa técnica muito mais eficaz.
Primeiramente vamos ao nosso html.

        <input type="checkbox" id="checkCheckbox"/>

        <br />

        <ul>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

            <li><input type="checkbox" name="checkbox[]" class="checkboxes" value=""/></li>

        </ul>

Depois de termos definido as classes e os id`s, vamos criar a nossa jquery.

$(document).ready(function(){

            $("#checkCheckbox").click(function()

            {

                //Verifica se esta checado ou não.

                var check_uncheck = this.checked;

                //Essa função each serve pra fazer iterações entre arrays.

                $(".checkboxes").each(function()

                {

                    //Check/Uncheck, cada clique no #checkCheckbox define o status, se é check ou uncheck

                    this.checked = check_uncheck;

                });

            });

        });

Bem simples não?
Veja um exemplo do código em funcionamento, aqui.

Cookie com jQuery

flaviomuniz — Thu, 18 Mar 2010 14:28:41 +0000

Olá, hoje vou mostrar como é simples trabalhar com cookie usando a jQuery.

Primeiro, vamos baixar o framework ja na nova versão 1.4 e o jquery.cookie.

Pronto, ja tendo os plugins, vamos por a mão na massa.
Abaixo no código, as linhas do js estão comentadas de acordo com a sua ação,
não tem segredo, não é copiar e colar, prestar atenção nos comentários e alem de tudo, entender.

            
            <script type="text/javascript">

                $(document).ready(function(){

                    //Usamos a função find para buscar o "a" dentro da div "link" na ação do click

                    $("#link").find("a").click(function(){

                        //Declaramos que idBg vai ter o mesmo valor do ID do link clicado

                        var idBg = $(this).attr("id");

                        //Setamos o cookie com o nome de bg_fundo e passamos o valor do idBg, expirando em 7 dias.

                        $.cookie("bg_fundo", "" + idBg + "", { expires: 7 });

                        //Adicionamos uma classe ao body ou alguma div que você queira, passando o nome

                        //do cookie que no nosso caso é o bg_fundo.

                        $("body").addClass($.cookie("bg_fundo"));

                    });

                    //Ao abrir a página ou recarregar, ele traz o cookie adicionando a classe bg_fundo.

                    $("body").addClass($.cookie("bg_fundo"));

                });

            script>

Background preto

Background verde

Background vermelho

Veja o exemplo

Qualquer coisa, postem que eu tiro dúvidas.

Até a próxima.

Instalando e configurando o macport no leopard

flaviomuniz — Sat, 06 Feb 2010 13:46:00 +0000

Olá,
Hoje vou mostrar como é simples instalar e configurar o macport.

Primeirmente vamos instalar o xcode na versão mais atual.
Instale tambem o x11.
Depois que tudo estiver instalado, abra o terminal e crie um arquivo com ~/.profile

sudo nano ~/.profile

Depois coloque embaixo da linha

export PATH=/opt/local/bin:/opt/local/sbin:$PATH

Esse comando

export DISPLAY=:0.0

Salve e feche o arquivo command+q.

Depois abra o terminal de novo e digite

sudo port -v selfupdate

Isso faz um update direto do site oficial com os pacotes mais recentes.
Agora que temos todo o pacote instalado e atualizado, vamos as instalações.
Para instalar programas use o comando.

sudo port -v install nomedoprograma

Para remover o programa instalado use

sudo port -f uninstall nomedoprograma

Não são todos os programas que podem ser baixados pelo macport,
Para ver o que foi instalado pelo macport
use o comando

port installed

Pronto
agora é só diversão =).

Até a próxima.

Alternativa para o uso do siFR com o cakephp

flaviomuniz — Sat, 06 Feb 2010 03:42:35 +0000

Olá,
Recentemente em alguns projetos, a nossa equipe precisou usar fontes que não são de sistemas em titulos e textos espalhados pelo site, tentamos usar o siFR mas não deu muito certo, pois a gente precisava trocar algumas labels com ajax e não funcionaria ja que ele cria o embed da font assim que o site é carregado.
Então, devido a esse grande problemas que encontramos pela frente, resolvi utilizar um helper do cakephp para transformar aquele texto em imagens de 4k cada.
Depois da ideia ter sido aprovada, então começei a criar, vamos la.

Primeiramente vamos utilizar 2 helpers do cakephp encontrados no bakery do cakephp
text_image.php e o font_site.php.
Depois de ter baixado os helpers acima e colocado no diretório helpers dentro de views,
vamos chamar o nosso helper na controller da página que vamos usar, eu precisei colocar na app_controller
pois precisei usar em todo site, mas para página especificas, o bom é usar somente na controller da página.

var $helpers = array("...", "FontSite");

Bom, continuando…
Depois de chamar o helper na app_controller, precisamos criar um diretório “fonts” dentro do diretório da nossa app

Dentro desse diretório, vamos colocar as fontes que vamos usar no projeto no meu caso foi a ITC Avant Garde PRO, mas podemos usar qualquer uma, claro, não vamos usar uma fonte de sistema para fazer isso.
Depois de criado, vamos criar dentro do nosso diretório “webroot -> img” um diretório para deixar as imagens geradas, eu criei um font_site, isso a gente altera dentro do helper.

//Nome do diretório onde vão ficar as imagens geradas.

var $__imagePath = 'font_site';

Depois de tudo certo, vamos chamar o helper para gerar a nossa imagem.
A gente pode criar um método no nosso helper para não precisar chamar em todas as páginas a função que gera a imagem, mas vou postar aqui do modo simples, ai fica de cada um fazer de um modo melhor.
Vamos la,

//Nome da fonte

$textImage->fontFile = "Avant.ttf";

//Tamanho da fonte

$textImage->setPointSize(36);

//Cor da fonte

$textImage->setColor("#818181");

//BG da fonte

$textImage->setBgColor("#ffffff");

//Texto para ser transformado em imagem

echo $textImage->image("www.flaviomuniz.com");

Podemos tambem, utilizar um background, setBgColor.

Vejam alguns resultados com as fontes geradas.

Não é necessário instalar as fontes, basta copiar para dentro do diretório fonts sitado a cima.

Espero ter ajudado.
Até a próxima.

[ad] Empty ad slot (#1)!

15 plugins da jquery que não podem faltar no seu projeto.

flaviomuniz — Fri, 18 Dec 2009 16:46:09 +0000

Lightbox;
http://leandrovieira.com/projects/jquery/lightbox/

Accordion;
http://bassistance.de/jquery-plugins/jquery-plugin-accordion/

Form Validate;
http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Pagination;
http://plugins.jquery.com/project/pagination

DataTables
http://www.datatables.net/examples/example_zero_config.html

Jquery Flash
http://jquery.lukelutman.com/plugins/flash/

jCarrousel
http://sorgalla.com/jcarousel/

Stylish Select Box
http://www.scottdarby.com/2009/05/jquery-plugin-stylish-select-unobstrusive-select-box-replacement/

Feature List
http://jqueryglobe.com/article/feature-list

Masked Input
http://digitalbush.com/projects/masked-input-plugin/

Password Strength Meter
http://mypocket-technologies.com/jquery/password_strength/

Custom Check Box and Radio Buttons
http://mypocket-technologies.com/jquery/cust_radio_buttons/

AutoComplete
http://dyve.net/jquery/?autocomplete

DatePicker
http://www.jqueryui.com/demos/datepicker/

File Upload
http://www.fyneworks.com/jquery/multiple-file-upload/

Ta ai, alguns plugins que não podem faltar nos nossos projetos.
Até a próxima.

[ad] Empty ad slot (#2)!

Helper para data em pt_BR

flaviomuniz — Thu, 05 Nov 2009 21:05:58 +0000

Alguns programadores criam funções gigantes para deixar o formato da data em português não é errado, mas esquecem de funções default do php para fazer isso.
Vou mostrar agora uma maneira simpeles de se fazer isso, transformando a data de November, 05, 2009 para 05 de Novembro de 2009.

Vamos primeiro criar nosso helper.

function data($data)

{

setlocale(LC_TIME,"pt_BR");

return strftime("%d de %B de &Y", strtotime($data));

}

strftime
strtotime

pronto, temos o helper, agora na nossa view, vamos chamar essa função.

data($page["Page"]["created"])?&gt;

Detalhe que se você tem uma versão atualizada do Base, o Helper não se chama mais Application e sim “h”,
caso ainda use a versão antiga, ao invés de $h-> use $application->.

Atualize o seu base, tem algumas correções do fck entre outros.

Bom é isso, simples assim.

Removendo caracteres especiais com php

flaviomuniz — Thu, 22 Oct 2009 21:12:12 +0000

Ola, hoje vou mostrar como é simples remover caracteres especiais com uma função default do php.

É muito facil achar na internet, pessoas que criam funções gigantescas como essa abaixo, para remover os caracteres de uma string.

        function RemoveAcentos($Msg)

        {

            $a = array(

                ''/[ÂÀÁÄÃ]/''=>''A'',

                ''/[âãàáä]/''=>''a'',

                ''/[ÊÈÉË]/''=>''E'',

                ''/[êèéë]/''=>''e'',

                ''/[ÎÍÌÏ]/''=>''I'',

                ''/[îíìï]/''=>''i'',

                ''/[ÔÕÒÓÖ]/''=>''O'',

                ''/[ôõòóö]/''=>''o'',

                ''/[ÛÙÚÜ]/''=>''U'',

                ''/[ûúùü]/''=>''u'',

                ''/ç/''=>''c'',

                ''/Ç/''=> ''C'');

            return preg_replace(array_keys($a), array_values($a), $Msg);

        }

        echo RemoveAcentos("Amanhã não irei caçar")

    ?>

Ou então desta maneira,

        function trataTxt($var) {

            $var = strtolower($var);

            $var = ereg_replace("[áàâãª]","a",$var);   

            $var = ereg_replace("[éèê]","e",$var);   

            $var = ereg_replace("[óòôõº]","o",$var);   

            $var = ereg_replace("[úùû]","u",$var);   

            $var = str_replace("ç","c",$var);

            return $var;

        }

        echo "Texto com acento:" . "á é í ó ú";

        echo "
";

        echo "Texto sem acento:" . trataTxt("á é í ó ú");

    ?>

As duas maneiras acima funcionam, porém, porque não usar uma maneira simples, e default do php?

            $strig = iconv('UTF-8', 'ASCII//TRANSLIT', $string);

        ?>

Leia mais sobre ICONV no br2.php.net
Esta maneira é a mesma coisa que as duas funções acima, só que de uma maneira mais limpa, e de certa forma correta.

Esta é uma maneira simples de remover caracteres especiais de uma string, só lembrando que, palavras com acento ou cedilha ele troca pela palavra sem o caracter,
pontos de interrogação, virgulas, parênteses ou qualquer outro, ele simplesmente remove.

Ta ai a dica, espero que aproveitem melhor o seus códigos.

Até a próxima.

Trabalhando com Checkbox + Array no CakePHP

flaviomuniz — Fri, 11 Sep 2009 16:31:20 +0000

Olá, depois de algum tempo sem postar por motivos de FALTA DE TEMPO.
Hoje vou mostrar como é simples trabalhar com checkbox no cakephp para deletar varios registros.

É muito simples, nem preciso ficar explicando muito, basta entender o que é para ser feito.
Bom, vamos la…
Primeiramente, vamos contruir nosso formulario

// Criamos o formulario e demos o nome de NomeFormulario, e na url, vamos apontar para a nossa function.

 echo $form->create('NomeFormulario',array('url'=>'deleta_selecionado', "id" => "deleta_selecionado"));?>

     foreach($nossoloop as $obj):?>

        //Criamos o nosso input checkbox com o name de nomeDoCampo[] e passamos o ID do conteudo dentro dele, ficando como abaixo.

         echo $form->input("nomeDoCampo[{$obj[$model]["id"]}]",array("type"=>"checkbox","label" => false, "value"=>$obj[$model]["id"]))?>

     endforach; ?>

 echo $form->end();?>

Agora criaremos a nossa controller, que é simples também.

// o nome da função é o mesmo nome que passamos na URL do form...

// se não for, vai dar erro.

function deleta_selecionado()

{

    //No nosso foreach, nós pegamos todo o valor que foi passado no array, que esteja dentro de nosso formulario NomeFormulario.

    foreach($this->data["NomeFormulario"] as $value){

        //Verificamos se o valor é diferente de 0 para ser deletado.

        if($value != 0){

            //Chamamos a model com o metodo deletaSelecionado e passamos o valor para ele, 

            //que no caso é o $value, como no  loop fizemos que o $this->data["..."] as $value.

            $this->NossaModel->deletaSelecionado($value);

        }

    }

}

Agora vamos para a nossa model, que é mais simples do que se imagina.

//criaremos a function com o nome de deletaSelecionado, e passaremos o nosso $value para ela.

    function deletaSelecionado($value)

    {

        // E por ultimo, passaremos o $value para o metodo "delete" que é default do cakephp

        return $this->delete($value);

    }

Pronto, simples assim.

Ler RSS com PHP

flaviomuniz — Fri, 14 Aug 2009 14:28:20 +0000

Olá, hoje vou mostrar uma maneira simples de ler RSS com php, e apresenta-los como quiser.

Vamos la…
Usei o meu rss como teste, mas vocês podem usar o de qualquer um.
Criei uma variavel chamada $rss para colocar o nosso link.

$rss = 'http://flaviomuniz.com/blog/?feed=rss2';

Depois, vamos usar uma função para converter em XML o nosso rss

“simplexml_load_file”
Então, definiremos uma váriavel para montar o XML eu chamei ela de $geraXml, e passaremos o nosso $rss para a função.

$geraXml = simplexml_load_file( $rss );

A primeira parte ja temos que é o XML, agora vamos listar os resultados, a partir do nosso XML.
Abaixo, usaremos um foreach simples, passando os itens do XML.
/* Inicio do foreach */

foreach ($geraXml-&gt;channel-&gt;item as $rs){

Channel é como se fosse o “body” no html.
Item, é onde começa o nosso rss.

Defini que $geraXml->channel->item vai ser $rs ( recordset )
mais por padrão mesmo.

echo $rs-&gt;title;

Title, é o nome do post.

echo $rs-&gt;link;

Link, ja sabem né?

}

/* fechando foreach */

Código completo

<ul> channel-&gt;item as $rs){

?&gt;

    <li><a href="<?=$rs->link?>">title?&gt;a>li>

ul>

Fiz a estrutura em UL LI, mas crie do jeito que achar melhor.
Demo