Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

clear optgroups from select 1

Status
Not open for further replies.
thompom

thompom

Technical User
Dec 4, 2006
395
GB
Hi - have googled this but cant find something that works for me.

Have a dynamic select that put optgroups in - which works fine, but before building the list it has to clear out existing options

Code: 
	for (var i = obj.length-1; i > 0; i--) {
		obj.options[i] = null;
	}
(obj = this.form.selectbox)

this doesnt clear optgroups - can someone advise plz?
 
Sort by date Sort by votes
Use, for instance, in place of the whole for statement.
[tt] obj.length=0;[/tt]
 
Upvote 0 Downvote
Or if you mean to stick to the same script:
>[tt] [/tt]i>0
[tt] i>[red]-1[/red][/tt]
 
Upvote 0 Downvote
hi cant seem to get it to work,

obj.length=0;

Code: 
	for (var i = obj.length-1; i > -1; i--) {
		obj.length=0; 
	}

gives me object doesnt support this property or method

full function

Code: 
function EW_updatecombo(obj, object_value_array, filter_value) {
	var value = obj.options[obj.selectedIndex].value;
	var grp = 0;
	for (var i = obj.length-1; i > 0; i--) {
		obj.options[i] = null;
	}
	
	for (var j=0; j<object_value_array.length; j=j+4) {

		if (object_value_array[j+3].toUpperCase() == filter_value.toUpperCase()) {
if (object_value_array[j+2] != grp && object_value_array[j+2] != '') {
var subject=document.createElement("OPTGROUP");
subject.setAttribute("label", object_value_array[j+2]);
obj.appendChild(subject);
grp = object_value_array[j+2];
}
	EW_newopt(obj, object_value_array[j], object_value_array[j+1], object_value_array[j+2]);			
		}	
	}
	EW_selectopt(obj, value);
}

// Create combobox option 
function EW_newopt(obj, value, text1, text2) {
	//var text = text1;
	if (text1 != "") {
		var text = text1 + " " + text2;
	} else {
		var text = "General" + " " + text2;
	}
		
	text = trim(text);
	var optionName = new Option(text, value, false, false)
	var length = obj.length;
	obj.options[length] = optionName;
}

html

Code: 
<!--1st combo-->
<select name='x_siteid' onChange='EW_updatecombo(this.form.x_deptid, ar_x_deptid, this.options[this.selectedIndex].value);' style="font-size:14px; width:295px" tabindex=1><option value=''>Please Select</option><option value='1'>Branksome</option><option value='2'>Christchurch</option><option value='3'>Blandford</option><option value='4'>Wallisdown</option><option value='5'>PartsCentre</option><option value='6'>AutoCentre</option></select> 

<!--2nd dynamic combo-->
<select name='x_deptid' style="font-size:14px; width:295px" tabindex=2><option value=''>Please Select</option><option value='1'>1</option><option value='2'>1</option><option value='3'>1</option><option value='4'>1</option><option value='5'>1</option><option value='6'>1</option><option value='36'>1</option><option value='45'>1</option><option value='46'>1</option><option value='47'>1</option><option value='7'>2</option><option value='8'>2</option><option value='9'>2</option><option value='15'>2</option><option value='10'>3</option><option value='11'>3</option><option value='12'>3</option><option value='14'>3</option><option value='16'>4</option><option value='17'>4</option><option value='18'>4</option><option value='31'>4</option><option value='32'>4</option><option value='33'>4</option><option value='13'>5</option><option value='37'>5</option><option value='38'>5</option><option value='39'>5</option><option value='40'>5</option><option value='42'>5</option><option value='43'>5</option><option value='25'>7</option><option value='44'>13</option></select>
<script type="text/javascript">
<!--
var ar_x_deptid = new Array();
ar_x_deptid[0] = '1';ar_x_deptid[1] = 'Vauxhall';ar_x_deptid[2] = 'Sales';ar_x_deptid[3] = '1';ar_x_deptid[4] = '2';ar_x_deptid[5] = 'Saab';ar_x_deptid[6] = 'Sales';ar_x_deptid[7] = '1';ar_x_deptid[8] = '3';ar_x_deptid[9] = 'Chevrolet';ar_x_deptid[10] = 'Sales';ar_x_deptid[11] = '1';ar_x_deptid[12] = '4';ar_x_deptid[13] = 'Vauxhall';ar_x_deptid[14] = 'Sales';ar_x_deptid[15] = '2';ar_x_deptid[16] = '5';ar_x_deptid[17] = 'Hyundai';ar_x_deptid[18] = 'Sales';ar_x_deptid[19] = '2';ar_x_deptid[20] = '6';ar_x_deptid[21] = 'Vauxhall';ar_x_deptid[22] = 'Sales';ar_x_deptid[23] = '3';ar_x_deptid[24] = '36';ar_x_deptid[25] = 'MG';ar_x_deptid[26] = 'Sales';ar_x_deptid[27] = '2';ar_x_deptid[28] = '45';ar_x_deptid[29] = '';ar_x_deptid[30] = 'Sales';ar_x_deptid[31] = '1';ar_x_deptid[32] = '46';ar_x_deptid[33] = '';ar_x_deptid[34] = 'Sales';ar_x_deptid[35] = '2';ar_x_deptid[36] = '47';ar_x_deptid[37] = '';ar_x_deptid[38] = 'Sales';ar_x_deptid[39] = '3';ar_x_deptid[40] = '7';ar_x_deptid[41] = '';ar_x_deptid[42] = 'Service';ar_x_deptid[43] = '1';ar_x_deptid[44] = '8';ar_x_deptid[45] = '';ar_x_deptid[46] = 'Service';ar_x_deptid[47] = '2';ar_x_deptid[48] = '9';ar_x_deptid[49] = '';ar_x_deptid[50] = 'Service';ar_x_deptid[51] = '3';ar_x_deptid[52] = '15';ar_x_deptid[53] = '';ar_x_deptid[54] = 'Service';ar_x_deptid[55] = '6';ar_x_deptid[56] = '10';ar_x_deptid[57] = '';ar_x_deptid[58] = 'Parts';ar_x_deptid[59] = '1';ar_x_deptid[60] = '11';ar_x_deptid[61] = '';ar_x_deptid[62] = 'Parts';ar_x_deptid[63] = '2';ar_x_deptid[64] = '12';ar_x_deptid[65] = '';ar_x_deptid[66] = 'Parts';ar_x_deptid[67] = '3';ar_x_deptid[68] = '14';ar_x_deptid[69] = '';ar_x_deptid[70] = 'Parts';ar_x_deptid[71] = '5';ar_x_deptid[72] = '16';ar_x_deptid[73] = 'Vauxhall';ar_x_deptid[74] = 'Finance';ar_x_deptid[75] = '1';ar_x_deptid[76] = '17';ar_x_deptid[77] = 'Vauxhall';ar_x_deptid[78] = 'Finance';ar_x_deptid[79] = '2';ar_x_deptid[80] = '18';ar_x_deptid[81] = 'Vauxhall';ar_x_deptid[82] = 'Finance';ar_x_deptid[83] = '3';ar_x_deptid[84] = '31';ar_x_deptid[85] = 'Saab';ar_x_deptid[86] = 'Finance';ar_x_deptid[87] = '1';ar_x_deptid[88] = '32';ar_x_deptid[89] = 'Chevrolet';ar_x_deptid[90] = 'Finance';ar_x_deptid[91] = '1';ar_x_deptid[92] = '33';ar_x_deptid[93] = 'Hyundai';ar_x_deptid[94] = 'Finance';ar_x_deptid[95] = '2';ar_x_deptid[96] = '13';ar_x_deptid[97] = '';ar_x_deptid[98] = 'BodyShops';ar_x_deptid[99] = '4';ar_x_deptid[100] = '37';ar_x_deptid[101] = '';ar_x_deptid[102] = 'BodyShops';ar_x_deptid[103] = '7';ar_x_deptid[104] = '38';ar_x_deptid[105] = '';ar_x_deptid[106] = 'BodyShops';ar_x_deptid[107] = '8';ar_x_deptid[108] = '39';ar_x_deptid[109] = '';ar_x_deptid[110] = 'BodyShops';ar_x_deptid[111] = '10';ar_x_deptid[112] = '40';ar_x_deptid[113] = '';ar_x_deptid[114] = 'BodyShops';ar_x_deptid[115] = '11';ar_x_deptid[116] = '42';ar_x_deptid[117] = '';ar_x_deptid[118] = 'BodyShops';ar_x_deptid[119] = '13';ar_x_deptid[120] = '43';ar_x_deptid[121] = '';ar_x_deptid[122] = 'BodyShops';ar_x_deptid[123] = '14';ar_x_deptid[124] = '25';ar_x_deptid[125] = '';ar_x_deptid[126] = 'Business';ar_x_deptid[127] = '1';ar_x_deptid[128] = '44';ar_x_deptid[129] = '';ar_x_deptid[130] = 'MiSeward';ar_x_deptid[131] = '1';
//-->
</script>


 
Upvote 0 Downvote
Either this:
[tt] for (var i = obj.length-1; i > [red]-1[/red]; i--) {
obj.options = null;
}[/tt]
Or this replacing the above three lines.
[tt] obj.length=0;[/tt]

How do I have to say to make it clearer?
 
Upvote 0 Downvote
Hi

Setting [tt]options[/tt] and/or [tt]options.length[/tt]
[ul]
[li]in Presto and Webkit will remove both [tt]option[/tt] and [tt]optgroup[/tt] elements[/li]
[li]in Gecko the [tt]options[/tt] will be removed and [tt]optgroup[/tt]s will remain[/li]
[li]in KHTML if there are [tt]optgroup[/tt]s neither the [tt]option[/tt]s nor [tt]optgroup[/tt]s will be removed[/li]
[/ul]
Code: 
[gray]// remove what can be remove as tsuji suggested[/gray]
opt[teal].[/teal]options[teal]=[/teal][purple]0[/purple]
[gray]// remove the optgroups and their children if still exists[/gray]
[b]var[/b] ogl[teal]=[/teal]obj[teal].[/teal][COLOR=darkgoldenrod]getElementsByTagName[/color][teal]([/teal][green][i]'optgroup'[/i][/green][teal])[/teal]
[b]for[/b] [teal]([/teal][b]var[/b] i[teal]=[/teal]ogl[teal].[/teal]length[teal]-[/teal][purple]1[/purple][teal];[/teal]i[teal]>=[/teal][purple]0[/purple][teal];[/teal]i[teal]--)[/teal] obj[teal].[/teal][COLOR=darkgoldenrod]removeChild[/color][teal]([/teal]ogl[teal][[/teal]i[teal]])[/teal]

Feherke.
 
Upvote 0 Downvote
hi - thanks to both of you

this did it

Code: 
for (var i = obj.length-1; i > 0; i--) {
     obj.options[i] = null;
}
	
// remove the optgroups and their children if still exists
var ogl=obj.getElementsByTagName('optgroup')
for (var i=ogl.length-1;i>=0;i--) obj.removeChild(ogl[i])

would appear the list needed at least 1 option in it
otherwise errors on this line

Code: 
var value = obj.options[obj.selectedIndex].value;

should have investigated the error better - debugging javascript in IE with a .js file is a pain
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
322
lexer
lexer
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
331
malpa
malpa
MDGarcia
  • Locked
  • Question
Connection to ORACLE from OutSystems
Replies
0
Views
75
MDGarcia
MDGarcia
berkshirea
  • Locked
  • Question
Dropdown, Select, Required 1
Replies
8
Views
180
berkshirea
berkshirea
RailBatyrshin
  • Locked
  • Question
Back on the Node(ExpressJS) fetch API from WEB Browser
Replies
0
Views
88
RailBatyrshin
RailBatyrshin

Part and Inventory Search

Sponsor

Back
Top