Question

I’ve to following question. I’ve a multiple listitem and i want show the three hidden tr i’ve set to display ‘hidden’ when the list item has a specific value.

the form elements have the following set up

<tr>
<td><label>bla</label></td>
<td><input id='bla'></td>
</tr>

i use the following javascript.

function checkValue(){

var verhuurdVan = document.getElementById('verhuurd_van_datepicker_field').parentNode.parentNode.style.display='none';
var verhuurdTot = document.getElementById('verhuurd_tot_datepicker_field').parentNode.parentNode.style.display='none';
var beschikbaar = document.getElementById('beschikbaar_verhuur_1').parentNode.parentNode.style.display='none'; 

var list = document.getElementById('productstatus_id_ListOn');

for(var i=0; i<list.options.length; i++){ 
    if(list.options[i].value == '1'){
      here the table rows has to be set to display block; 
    }
}

Ignore the HTML id name’s because this is parsed by the CMS i use.

thanks in advance.

Answer 1

Without knowing the exact layout of your DOM it’s not possible to give the exact lines of code required. However, it seems quite clear from the code block you posted that the elements are being hidden by lines 3-5.

Consequently, within your inner if block, all you have to do to make the elements reappear is to set the style of the corresponding elements back to ‘block’, e.g.:

document.getElementById('verhuurd_tot_datepicker_field').parentNode.parentNode.style.display='block';

Which of the three nodes you actually activate is up to you to decide, but that’s how you would go about it.