Autor Zpráva
Stano
Profil *
Zdravim potrebujem prosím Vas pomoc :
Mam Js na pridávanie riadkov do tabulky http://besama.szm.sk/row2.htm je tam aj formular so select a prave v tom select-e by som potreboval v pridanych riadkoch aby sa dala zvyraznit ponuka nieco ako <optgroup label="XXXX"> v html formularoch.
Dakujem
peta
Profil *
Stano
select nemuzes menit. leda si udelat pomoci JS vlastni
Stano
Profil *
Asi sme sa nerozumeli tu je script .
Chcem aby v pridaných riadkoch v rozbalovacom menu select ktorý tvorí JS.Boli zvýraznené položky tak ako <optgroup label="XXXX"> v html formularoch
<table border="1" id="tblSample">
<form action="newriadok_sl.asp" method="post">
<p>
<input type="button" value="Add" onclick="addRowToTable1();" />
<input type="button" value="Remove" onclick="removeRowFromTable1();" />
<input type="button" value="Submit" onclick="validateRow(this.form);" />
<input type="checkbox" id="chkValidate" /> Validate Submit
</p>
<p>
<input type="checkbox" id="chkValidateOnKeyPress" checked="checked" /> Display OnKeyPress
<span id="spanOutput" style="border: 1px solid #000; padding: 3px;"> </span>
</p>

<tr>
<th colspan="3">Sample table</th>
</tr>
<tr>
<td>1</td>
<td><input type="text" name="txtRow1"
id="txtRow1" size="40" onkeypress="keyPressTest(event, this);" /></td>
<td>
<select name="selRow0">
<optgroup label="Volba1"> </optgroup>
<option value="value0">text zero</option>
<optgroup label="Volba2"> </optgroup>
<option value="value1">text one</option>
</select>
</td>
</tr>


<script>
// Last updated 2005-10-25
function addRowToTable1()
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
// if there's no header row in the table, then iteration = lastRow + 1
var iteration = lastRow;
var row = tbl.insertRow(lastRow);

// left cell
var cellLeft = row.insertCell(0);
var textNode = document.createTextNode(iteration);
cellLeft.appendChild(textNode);

// right cell
var cellRight = row.insertCell(1);
var el = document.createElement('input');
el.setAttribute('type', 'text');
el.setAttribute('name', 'txtRow' + iteration);
el.setAttribute('id', 'txtRow' + iteration);
el.setAttribute('size', '40');
el.onkeypress = keyPressTest;
cellRight.appendChild(el);

// select cell NIEKDE TU??????????????????????????????
var cellRightSel = row.insertCell(2);
var sel = document.createElement('select');
sel.setAttribute('name', 'selRow' + iteration);
sel.options[0] = new Option('text zero', 'value0');
sel.options[1] = new Option('text one', 'value1');
cellRightSel.appendChild(sel);
}
function keyPressTest(e, obj)
{
var validateChkb = document.getElementById('chkValidateOnKeyPress');
if (validateChkb.checked) {
var displayObj = document.getElementById('spanOutput');
var key;
if(window.event) {
key = window.event.keyCode;
}
else if(e.which) {
key = e.which;
}
var objId;
if (obj != null) {
objId = obj.id;
} else {
objId = this.id;
}
displayObj.innerHTML = objId + ' : ' + String.fromCharCode(key);
}
}
function removeRowFromTable1()
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}
function openInNewWindow(frm)
{
// open a blank window
var aWindow = window.open('', 'TableAddRowNewWindow',
'scrollbars=yes,menubar=yes,resizable=yes,toolbar=no,width=400,height= 400');

// set the target to the blank window
frm.target = 'TableAddRowNewWindow';

// submit
frm.submit();
}
function validateRow(frm)
{
var chkb = document.getElementById('chkValidate');
if (chkb.checked) {
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length - 1;
var i;
for (i=1; i<=lastRow; i++) {
var aRow = document.getElementById('txtRow' + i);
if (aRow.value.length <= 0) {
alert('Row ' + i + ' is empty');
return;
}
}
}
openInNewWindow(frm);
}

</script>
peta
Profil *
Jinymi slovy, na prvnim radku je SELECT s OPTgroup, ale kdyz se klikne pridat, tak tam nevis, jak to optgroup zapsat do JS, tak to tam neni.

1. chybka:
<SELECT name="ComOS">
<OPTION selected label="none" value="none">None</OPTION>
<OPTGROUP label="PortMaster 3">
<OPTION label="3.7.1" value="pm3_3.7.1">PortMaster 3 with ComOS 3.7.1</OPTION>
<OPTION label="3.7" value="pm3_3.7">PortMaster 3 with ComOS 3.7</OPTION>
<OPTION label="3.5" value="pm3_3.5">PortMaster 3 with ComOS 3.5</OPTION>
</OPTGROUP>
<OPTGROUP label="PortMaster 2">
<OPTION label="3.7" value="pm2_3.7">PortMaster 2 with ComOS 3.7</OPTION>
<OPTION label="3.5" value="pm2_3.5">PortMaster 2 with ComOS 3.5</OPTION>
</OPTGROUP>
<OPTGROUP label="IRX">
<OPTION label="3.7R" value="IRX_3.7R">IRX with ComOS 3.7R</OPTION>
<OPTION label="3.5R" value="IRX_3.5R">IRX with ComOS 3.5R</OPTION>
</OPTGROUP>
</SELECT>

Opt group se pise pro skupinu inputu, kteer jsou v nem. Coz ti muze docela zasadne mozna zmenit funkcnost.

2. chyba, jestli chces, aby se dalo na to optgroup klikat, tak to myslim fakt nejde. To je proste dane selectem, pro win byl tak spatne vymyslen.

3. chyba, kdyz neco hledam, zkusim vyhledavac:
www.google.com
select optgroup javascript
naslo mi to presne 73,000 odkazu
treba takovato stranka se mi tam nasla jako treti...
http://news.hping.org/comp.lang.javascript.archive/3249.html
V podstate je to mozna ono, jestli to funguje.

Jinak pekny script, fakt. Mozna to taky nekde pouziji.
Fred
Profil
Tohle jsem nedávno hledal, v IE je problém, že sice umí optgroup, ale neumí ho manipulovat a není nic čím by to šlo obejít. Je to v podstatě to samé jako http://www.sovavsiti.cz/css/abbr.html , jenže do selectu nic jiného než option a optgroup nedáš. Možná by to šlo nahradit nějakým spanem jen po dobu vykonávání toho scriptu a pak to hodit zase zpátky. Ten příklad co našel Peta je něco podobného jako jsem našel já http://www.faqts.com/knowledge_base/view.phtml/aid/8001/fid/178. Oba mají stejnou potíž musí se tam ten obsah vypisovat v těch polích.
Oswald
Profil
v IE je problém, že sice umí optgroup, ale neumí ho manipulovat a není nic čím by to šlo obejít

Tenhle problém je akorát v MSIE 5.
Fred
Profil
show/hide na optgroup se mi nepodařilo ani v IE6
Fred
Profil
Oswald V IE6 nejde ani

<select>
<optgroup style="display:none" label="1">
<option>a</option>
</optgroup>
<optgroup label="2">
<option>b</option>
</optgroup>
Oswald
Profil
Aha jasně, já myslel pomocí DOM (něco jako tohle). Stylovat jsem to nikdy nezkoušel.
Fred
Profil
To je velmi pěkné :-)
Stano
Profil *
Dakujem Vam vsetkym velmi ste mi pomohli.
Stano.
Stano
Profil *
Skusal som script na tejto stranke http://news.hping.org/comp.lang.javascript.archive/3249.html a nejako neviem ho pochopiť .To čo sa zobrazuje je predsa html kód a načo je tam potom ten js?.resp. ako ho mam aktivovať aby mi vytvoril select box ? skúšal som zavolať funkciu constructArray ale nefunguje mi to.
Ďakujem.
http://news.hping.org/comp.lang.javascript.archive/3249.html
Kod:

<html>
<head>
<script type="text/javascript">
var selectOptions = new Array(
new Array('Group One',
new Array('Option One', 21),
new Array('Option Two', 22),
new Array('Option Three', 23)),
new Array('Group Two',
new Array('Option Four', 24),
new Array('Option Five', 25),
new Array('Option Six', 26)),
new Array('Group Three',
new Array('Option Seven', 27),
new Array('Option Eight', 28),
new Array('Option Nine', 29)));


function constructArray(list)
{
selectOptions = new Array();
var optgroups = list.childNodes;
var m = 0;
for(i = 0 ; i < optgroups.length ; i++)
{
var n = 1;
if(optgroups[i].nodeName == 'OPTGROUP')
{
selectOptions[m] = new Array(optgroups[i].label);
var options = optgroups[i].childNodes;
for(j = 0 ; j < options.length ; j++)
{
if(options[j].nodeName == 'OPTION')
{
selectOptions[m][n++] =
new Array(options[j].text, options[j].value);
}
}
m++;
}
}
reConstructSelectBox(list);
}


function reConstructSelectBox(list)
{
// Javascript re-indexs after each null or removeChild()
// so we have to count backwards
for(i = list.options.length - 1 ; i >= 0 ; i--)
{
list.options[i] = null;
}
var optgroups = list.childNodes;
for(i = optgroups.length - 1 ; i >= 0 ; i--)
{
list.removeChild(optgroups[i]);
}
var k = 0;
for(i = 0 ; i < selectOptions.length ; i++)
{
var group = selectOptions[i];
var optgroup = document.createElement('optgroup');
optgroup.label = group[0];
list.appendChild(optgroup);
for(j = 1 ; j < group.length ; j++)
{
var option = new Option(group[j][0], group[j][1]);
list.options[k++] = option;
}
}
}
</script>
</head>
<body onload="constructArray(this.form.list);">
<form method="post" action="" name="form">
<select name="list" size="15" id="list">
<optgroup label="Group One">
<option value="21">Option One</option>
<option value="22">Option Two</option>
<option value="23">Option Three</option>
</optgroup>
<optgroup label="Group Two">
<option value="24">Option Four</option>
<option value="25">Option Five</option>
<option value="26">Option Six</option>
</optgroup>
<optgroup label="Group Three">
<option value="27">Option Seven</option>
<option value="28">Option Eight</option>
<option value="29">Option Nine</option>
</optgroup>
</select>
</body>
</html>
peta
Profil *
Co k tomu nechapes?
constructArray(this.form.list) - vezme select a prepise jej do pole do promenne
reConstructSelectBox(this.form.list) - smaze puvodni select, pak vezme pole a vytvori z nej select, ktery zapise misto prvku s name=list
a je to teda zapsane JS-DOMem, takze to bude fungovat tak nejak od IE5.5 tusim

vsechno to vidis ve scriptu, ne?
peta
Profil *
Jo, proc to tam je? Protoze je to demo-priklad. Autor, zrejme v jinem scriptu, aby usetril, tak pracuje uz s hotovym selectem, ktery pri onload prenese do promenne. Nebo chtel pouze demonstrovat oba zpusoby, vytvoreni i rekonstrukce.
Mas pravdu, v tomto pripade je to tam zbytecne.
Stano
Profil *
Prosím bližšie vysvetliť ako sa to da použiť................. - chcem aby mi js vytvaral select v ktorom by boli zvyraznené niektore položky ked tam vlozim input tlačítko a zavolam constructArray nefunguje to ?
peta
Profil *
Stano viz Zasláno: 9.1.2006 17:13:09 , nema smysl to opisovat
pozorne cti a plac... Array je anglicky pole, construct = zkonstruovat, sestrojit, postavit
pouzivas nespravnou funkci!
Stano
Profil *
Nejako takto ? <input type="button" value="button" onclick="reConstructSelectBox();">
ziadna zmena popis mi prosim ta co to ma urobit.
D.
PerToon
Profil
function reConstructSelectBox(list) - Tahle funkce vyžaduje zadání parametru list.

onclick="reConstructSelectBox();" - což tady nemáš.
Toto téma je uzamčeno. Odpověď nelze zaslat.