Добре дошли!

Добре дошли в нашите форуми, пълни с полезна информация. Имате проблем с компютъра или телефона си? Публикувайте нова тема и ще намерите решение на всичките си проблеми. Общувайте свободно и открийте безброй нови приятели.

Моля, регистрирайте се за да публикувате тема и да получите пълен достъп до всички функции.

JavaScript listbox

Последователи

8 юли 200620 г.

Здравейте. Трябва ми скрипт, който да прави следното:

Имате два листбокс-а един до друг единия пълен, а другия празен.

При цъкване на някой ред от пълния лист самия ред автоматично да се прехвърля на новия и да се маха от първия. При цъкане на вече прехвърлен ред във втория, да се случва обратното.

Има подобни скриптове, но те са с бутони за прехвърляне, а аз държа това да става автоматично. Ето пример с бутони, ако някой има желание да го модифицира (убеден съм че е лесно, но просто не мога да се справя сам):

<html>

<head>

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

/* Visit http://www.yaldex.com/ for full source code

and get more free JavaScript, CSS and DHTML scripts! */

<!-- Begin

function move(fbox, tbox) {

var arrFbox = new Array();

var arrTbox = new Array();

var arrLookup = new Array();

var i;

for (i = 0; i < tbox.options.length; i++) {

arrLookup[tbox.options[i].text] = tbox.options[i].value;

arrTbox[i] = tbox.options[i].text;

}

var fLength = 0;

var tLength = arrTbox.length;

for(i = 0; i < fbox.options.length; i++) {

arrLookup[fbox.options[i].text] = fbox.options[i].value;

if (fbox.options[i].selected && fbox.options[i].value != "") {

arrTbox[tLength] = fbox.options[i].text;

tLength++;

}

else {

arrFbox[fLength] = fbox.options[i].text;

fLength++;

   }

}

arrFbox.sort();

arrTbox.sort();

fbox.length = 0;

tbox.length = 0;

var c;

for(c = 0; c < arrFbox.length; c++) {

var no = new Option();

no.value = arrLookup[arrFbox[c]];

no.text = arrFbox[c];

fbox[c] = no;

}

for(c = 0; c < arrTbox.length; c++) {

var no = new Option();

no.value = arrLookup[arrTbox[c]];

no.text = arrTbox[c];

tbox[c] = no;

   }

}

//  End -->


</script>



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

<!--


var store = new Array();



//Списъци със квартали и стойности

//Числото в [] трябва да съвпада със числото, подавано от формата за град

//Първия низ е надписа, втория стойността (вероятно)


store[0] = new Array(


);


store[1] = new Array(

	'Красно село','12',

	'Дианабад','13',

	'Младост','14',

	'Мусагеница','16',

	'Иван Вазов','17'


	);


store[2] = new Array(

	'Долна майна','12',

	'Горна майна','13',

	'Трите баира','14',

	'Голямата дупка','16',

	'Циганската махала','17'

);



store[3] = new Array(

	'Някой квартал','12',

	'Някой втори','13',

	'Някой трети','14',

	'Някой четвърти','16',

	'Някой пети','17'

);



function init()

{

	optionTest = true;

	lgth = document.forms[0].kvartali.options.length - 1;

	//document.forms[0].kvartali.options[lgth] = null;

	//if (document.forms[0].kvartali.options[lgth]) optionTest = false;

}



function populate()

{

	if (!optionTest) return;

	var box = document.forms[0].grad;

	var number = box.options[box.selectedIndex].value;

	if (!number) return;

	var list = store[number];

	var box2 = document.forms[0].kvartali;

	box2.options.length = 0;

	for(i=0;i<list.length;i+=2)

	{

		box2.options[i/2] = new Option(list[i],list[i+1]);

	}

}


function go()

{

	if (!optionTest) return;

	box = document.forms[0].kvartali;

	destination = box.options[box.selectedIndex].value;

	if (destination && confirm('Do you really want to go to this site?')) top.location.href = destination;

}


// -->

</script>

</head>

<BODY onLoad="init()">



<!--Градове със стойности-->

<form action="#">

<select name="grad" onchange="populate()">

	<option value="0">Изберете Град</option>

	<option value="1">София</option>

	<option value="2">Пловдив</option>

	<option value="3">Стара Загора</option>

</select>

<br />


<table><tr><td>

<select multiple size="10" name="kvartali" style="width:150">

</select>

</td>

<td align="center" valign="middle">

<input type="button" onClick="move(this.form.izbranikvartali,this.form.kvartali)" value="<<">

<input type="button" onClick="move(this.form.kvartali,this.form.izbranikvartali)" value=">>">

</td>

<td>

<select multiple size="10" name="izbranikvartali" style="width:150">

</select>

</td></tr></table>



</form>




<form name="combo_box">


</form>

8 юли 200620 г.

Така добре ли е ?

<html>
<head>
<script language="javascript" type="text/javascript">
/* Visit http://www.yaldex.com/ for full source code
and get more free JavaScript, CSS and DHTML scripts! */


</script>

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

</script>
</head>
<BODY onLoad="init()">


<form action="#">
<select name="grad" onchange="populate()">
<option value="0">Èçáåðåòå Ãðàä</option>
<option value="1">Ñîôèÿ</option>
<option value="2">Ïëîâäèâ</option>
<option value="3">Ñòàðà Çàãîðà</option>
</select>
<br />

<table><tr><td>
<select multiple size="10" name="kvartali" style="width:150" onchange="move(this.form.kvartali,this.form.izbranikvartali)">
</select>
</td>
<td align="center" valign="middle">
<input type="button" onClick="move(this.form.izbranikvartali,this.form.kvartali)" value="<<">
<input type="button" onClick="move(this.form.kvartali,this.form.izbranikvartali)" value=">>">
</td>
<td>
<select multiple size="10" name="izbranikvartali" style="width:150" onchange="move(this.form.izbranikvartali,this.form.kvartali)">
</select>
</td></tr></table>

</form>

<form name="combo_box">

</form>