Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

buenolex

Mudar de posição os itens de um listbox

Por , em Javascript

Recommended Posts

buenolex    0

buenolex
Postado

Olá amigos, o que preciso é algo simples mas não encontrei aqui no fórum em minhas pesquisas...Numa listbox preciso que ao selecionar um item e cliar no botão "para cima" este item suba e conseqüentemente ao clicar no botão "para baixo" este item desça de forma que eu ordene os itens da forma que eu quiser.Após isto teria que pegar as informações deste ordenamento e gravar em uma tabela utilizando ASP, mas isto ficaria para outra etapa...Alguém tem um JavaScript que faça esta ordenação em listbox?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Amigo_zz    0

Amigo_zz
Postado

colega,

 

após muita investigação e perguntas, disseram-me que isso nao é possível ( exemplo completo, ordenar e guardar), mas desenvolvi isso pq realmente precisava. tem um errozito que estou a tentar solucionar, mas funciona.

 

function elm(obj){	return document.getElementById(obj);}function move(bDir,sName) {	var el = elm(sName);	var idx = el.selectedIndex;		if (idx==-1){		alert("Têm de seleccionar um menu para reordenar.");	}else {		var oldVal = el[idx].value;		var oldText = el[idx].text;				var nxidx = idx+( bDir? -1 : 1);			if (nxidx>=0 || nxidx<=el.length){			el.selectedIndex = 0			el[idx].value = el[nxidx].value			el[idx].text = el[nxidx].text			el[nxidx].value = oldVal			el[nxidx].text = oldText			el.selectedIndex = nxidx		}		 	}}function selectAll(cbList,bSelect) {	for (var i=0; i<cbList.length; i++) 		cbList[i].selected = cbList[i].checked = bSelect}function reOrder(){	selectAll(elm('cmbmenu'),true);	document.frmordem.submit();	}

 

agora a parte de HTML:

 

<div>Ordem dos Menus</div>	<div id="menus">		<div id="lista">		<select name="cmbmenu" id="cmbmenu" size="10" multiple>			<option>Sem Opções</option>		</select>		</div>		<div id="barrascroll">			<div id="setaa">				<a onclick="move(true,'cmbmenu');" alt="Subir Nível">					<img src="imagens/setaa.jpg" border="0" />				</a>			</div>			<div id="scroll"></div>			<div id="setab">				<a onclick="move(false,'cmbmenu');" alt="Descer Nível">					<img src="imagens/setab.jpg" border="0" />				</a>			</div>		</div>	</div><input type="button" onclick="reOrder();" value="Guardar Ordem" class="botao" />

Atenção: na listbox tens de ter a opçao multiple, pq quando gravar a posição dos registos, tens de seleccionar todos os registos, caso contrário nao consegues capturar os valores e respectivas posições.

 

ASP

For i = 1 to Request.Form("cmbmenu").Count	REDIM PRESERVE varArray(i)	varArray(i) = Request.Form("cmbmenu").Item(i)	strsql="update menus set ordem='" & i & "' where cod_menu='" & Request.Form("cmbmenu").Item(i) & "' and cod_idioma='" & Request.Form("lstidioma") & "'"	executaSql(strSQL)Next

o executasql(strsql) é uma função minha que executa a acção guardar do recordset.

 

é tudo

Compartilhar este post

Link para o post
Compartilhar em outros sites

www.imaginext.com.br    0

www.imaginext.com.br
Postado

Amigo_zz,

 

Seu código me ajudou bastante. Porém como você mesmo disse tem alguns probleminhas. O post é antigo e pode ser que tenha o corrigido, mas de qualquer forma vou postar uma melhoria e correção, pra que sirva também pra outras pessoas:

 

<html>
<head>

<style>
body { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif }
</style>

<script>
function E(obj){
	return document.getElementById(obj);
}

function move(direcao) {
	var el = E("lista");
	var idx = el.selectedIndex;
	
	if (idx == -1){
		return false }
	else {
		
		var nxidx = idx + direcao;
		
		if (nxidx >= 0 && nxidx <= (el.length - 1)){
			var oldValue = el[idx].value;
			var oldText = el[idx].text;
			el[idx].value = el[nxidx].value
			el[idx].text = el[nxidx].text
			el[nxidx].value = oldValue
			el[nxidx].text = oldText
			el.selectedIndex = nxidx
		}
	}
}


function selectAll(cbList,bSelect) {
	for (var i=0; i<cbList.length; i++) 
		cbList[i].selected = cbList[i].checked = bSelect
}

function reOrder(){
	selectAll(E('lista'),true);
	document.frmordem.submit();
}
</script>

</head>
<body>

<select name="lista" id="lista" size="10" multiple="multiple">
	<option value="um">Primeira</option>
	<option value="dois">Segunda</option>
	<option value="tres">Terceira</option>
	<option value="quatro">Quarta</option>
</select>

<p><a href="#" onClick="move(-1);" title="Subir Nível">ACIMA</a></p>
<p><a href="#" onClick="move(1);" title="Descer Nível">ABAIXO</a></p>
<p><input type="button" onClick="reOrder()" value="Salvar" /></p>

</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

klonder    14

klonder
Postado

Excelente código! Funcionou bem no Chrome. http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

Creio ser pertinente ao tópico, pois poderá ajudar muitas pessoas. Por isso, inicialmente deixarei como está.

 

Obrigado pela contribuição! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito