Clearing selection options with javascript when changing

Question

Before you -1 this is in order to be such a simple question, read on, because I spent some time and looked for it. I have 5 boxes of choice. Each result depends on what was chosen before it. There is no submit button. I just need to change based on what is selected in the previous field, and for now I have it. Oh, and the results are output from the database. The problem is that when you select an option, it can be said that window 2 displays the options in window 1, but when you select the option in field 1 again, their parameters simply add up to others. I need them to clean when they change it again. I will send a js message, and if you need something else, just ask.

ps im get parameters using php-mysql. pss This site should be completed tomorrow, so I will be timid. Please do not waste time telling me that this is a stupid question and what is not.

Thanks in advance for your help.

$(function () { //When the page is finished loading run this code $('#country').change(function () { $.ajax({ url: "<!--Base url taken out-->/discovery/aLoad", success: function (data) { eval(data); }, error: function () { alert('failed'); }, data: { country: getSelectValues('#country') }, type: 'POST' }); }); }); function changeSearchBar (newBar) { //remove the crap function ClearOptions(country) { document.getElementById('country').options.length = 0; } for (var i = 0; i <= newBar.length; i++) { newBar[i].id = newBar[i][0]; newBar[i].name = newBar[i][1]; $('#group').append( $('<option></option>').attr('value', newBar[i].id).text(newBar[i].name) ); } } function getSelectValues (sId) { var str = ""; $(sId +" option:selected").each(function () { str += $(this).val() + ","; }); return str.replace(/.$/g, ''); } 

Answer 1

From what I understand from your long post, you just need to remove all child select before you start adding a new option from the AJAX request.

Try something like this before the for loop:

 $('#group').html('');​ 

Demo: http://jsfiddle.net/57TYu/2/

Answer 2

Here you go, I think this is basically what you are trying to do:

How to remove all parameters of a selection window and then add one parameter and select it using jQuery?

Basically, find the "option" tags inside the selection and remove them.

 $('select').find('option').remove() 

clears all selection fields.

This will add data that are supposedly options in their place:

 $('select').find('option').remove().end().append(data); 

I think this is what you are looking for.