Laion Camargo

11 de fevereiro de 2008

11/02/2008 - 19 anos ;D

Bom galera um post meio inútil, mas hoje completo 19 anos ;D

Estou passando meu dia de aniver inteiro para corrigir uma biblioteca de '.mask' em jquery pra poder fazer um post bem legal pra vocês!!

acho que até amanhã já resolvi todos os bugs e venho com o post aqui ;D

Intão acho que meu atraso semanal de post no blog ta perdoado néh. hehehhe

E para o pessoal que lembro do aniver, vlws!! fico contente por isso ;)

até mais ;x

29 de janeiro de 2008

Manipulando option na select com JQuery

Bom dia galera!

Bom cabei de montar um sistema aqui na empresa para jogar item de uma select para outra com JQuery.

Clique aqui para ver um exemplo

Bom agora vamos por a mão na massa

Eu criei com a versão 'jquery-1.1.3.1.mim.js'

Crie um arquivo chamado 'arquivo.html' e cole o seguinte código:

>CODE <<>

<html>
<head>
<title>Manipulando Select com JQuery</title>
<script type="text/javascript" src="jquery-1.1.3.1.min.js"></script>
<script type="text/javascript" src="mudarColuna.js"></script>
<style>
.tamanhoSelect{
width: 200px;
}
</style>
</head>

<body>
<form id="frm" name="frm">
<select id="select1" multiple="multiple" class="tamanhoSelect">
<option value="1">Item1</option>
<option value="2">Item2</option>
<option value="3">Item3</option>
</select>

<div id="add">
<a href="#" title="Mover para baixo">
<span>Mover para baixo</span>
</a>
</div>

<div id="remove">
<a href="#" title="Mover para cima">
<span>Mover para cima</span>
</a>
</div>

<select id="select2" multiple="multiple" class="tamanhoSelect">

</select>
</form>
</body>
</html>

Bom agora que temos nosso html vamos fazer nosso 'arquivo.js'

Crie um arquivo chamado 'mudarColuna.js' e coloque dentro da mesma pasta do html

abra o arquivo 'mudarColuna.js' e cole este código:

>CODE <<>

$(document).ready(function() {

$("#add").click(function(){
moverItem("select1", "select2");
});

$("#remove").click(function(){
moverItem("select2", "select1");
});
});

function adicionarItem(select, val, tex, cla){
$("#"+select).append("<option value=' "+val+" ' class=' "+cla+"
'>"+tex+"</option>");
}

function moverItem(de, para){
$("#"+de+" option:selected").each(function(){
adicionarItem(para, $(this).val(), $(this).text(), $(this).attr("class"));
$(this).remove();
});

}

Pronto!!
Muito facil néh ;D

Nosso tutorial da semana acaba por aqui..
Qualquer dúvida ou ajuda deixe no post.
Até mais galera
;x