How to disable other content based on two select option choices

Adem · July 5, 2021, 8:05am

Hello,
The following select option codes are the TV Channel selection option.
TV channels operate between 47-860 MHz
In the channel selection option below, only one of the highest number of Analogue or Digital channels can be selected.
If the highest value is selected in one and any value is selected in the other, it will exceed 860 MHz, which is not possible
I want to prevent this
Sample:
If 8 values are selected from the analog channel, values 68 and 72 from the Digital channel option will be disabled.
The important thing here is not to exceed 860 MHz.
Analog channels are incremented by 8 digits.
Digital channels are incremented by 4 digits.
When 12 values are selected from the digital channel, there are no 12 values in the Analog channel, but 16 can be disabled, no problem here. Rule total channel frequency should not exceed 860 MHz

Note: Normally disabled, When the checkbox is checked which channel system it wants to add, channel selection is enabled.

I ask for your help
Thanks

<select size="1" name="analog_channels" class="form-control" id="analog_channels" style="width: 140px;" disabled="">
<option value="-1">&nbsp;</option>
<option value="8">8 Analog Channels</option>
<option value="16">16 Analog Channels</option>
<option value="24">24 Analog Channels</option>
<option value="32">32 Analog Channels</option>
<option value="40">40 Analog Channels</option>
<option value="48">48 Analog Channels</option>
<option value="56">56 Analog Channels</option>
<option value="64">64 Analog Channels</option>
<option value="72">72 Analog Channels</option>
<option value="80">80 Analog Channels</option>
</select>

<select size="1" name="digital_channels" class="form-control" id="digital_channels" style="width: 140px;" disabled="">
<option value="-1">&nbsp;</option>
<option value="4">4 Digital Channels</option>
<option value="8">8 Digital Channels</option>
<option value="12">12 Digital Channels</option>
<option value="16">16 Digital Channels</option>
<option value="20">20 Digital Channels</option>
<option value="24">24 Digital Channels</option>
<option value="28">28 Digital Channels</option>
<option value="32">32 Digital Channels</option>
<option value="36">36 Digital Channels</option>
<option value="40">40 Digital Channels</option>
<option value="44">44 Digital Channels</option>
<option value="48">48 Digital Channels</option>
<option value="52">52 Digital Channels</option>
<option value="56">56 Digital Channels</option>
<option value="60">60 Digital Channels</option>
<option value="64">64 Digital Channels</option>
<option value="68">68 Digital Channels</option>
<option value="72">72 Digital Channels</option>
</select>

whispers · July 5, 2021, 5:39pm

I’m not clear what your asking for here?

You want to to a user to click on 1-many checkboxes… and then…?

Dynamically count the ‘value’ (frequency)… al off selected checkboxes in a certain group? and then disable others in a nother group?

If this is correct … what is the question/stuff you need help on? Setting up the dynamic functions to check the values/totals or something?

whispers · July 5, 2021, 5:43pm

explain this.

What ‘8’ values from analog channel disable the digital channel selections? Any 8? a specific 8? the highest 8? Is it a VALUE count? a QTY count?

Adem · July 6, 2021, 9:00am

Thank you for your answer,

This is the default, channel selection is disabled
kanalpasit

Checkbox for only one duct system is marked here
Since a channel system is selected, the highest number of channels can be selected from the selection option
birkanalaktif

The problem starts here
Because both systems channel selection has been made.
47-860 MHz band needs to be shared by selection
1 channel is 8 MHz
If 80 analog channels and 72 digital channels are selected as in the picture, a total of 1626 MHz is not available.
As many as the selected Analogue channel number, the number of digital channels must be unselectable from the end of the selection option.
or vice versa
Sample:
32 channel analog selected
72 channels cannot be selected from digital, because, it was used from 32 channel analog system
In the digital channel selection option, the following fields must be unselectable
or vice versa
(will be reduced from the number of other channels according to the first selected channel number)

<option value="44">44 Digital Channels</option>
<option value="48">48 Digital Channels</option>
<option value="52">52 Digital Channels</option>
<option value="56">56 Digital Channels</option>
<option value="60">60 Digital Channels</option>
<option value="64">64 Digital Channels</option>
<option value="68">68 Digital Channels</option>
<option value="72">72 Digital Channels</option>

hepsiaktif

Thank you

whispers · July 7, 2021, 3:14pm

I’m not seeing any factual, math stuff here? Such as what criteria/logic is need to be used to disable the other entries in the other drop down.

if you have 2 drop downs

drop1: (analog)
32
36
40
44
48
52
56
60
68
72

drop2: (digital)
32
36
40
44
48
52
56
60
68
72

if: ‘32’ is selected from analog drop… then what? Logically?

Any value/entry in the digital dropdown ABOVE 32 needs to be disabled?
Any value/entry in the digital dropdown ABOVE (32 + 8) needs to be disabled?

What happens when a change/selection in the digital dropdown is made then? The analog option/selection is always going to control the Digital one… if certain options are disabled in the digital dropdown due tot he selection in the analog dropdown… you will never be able to update the analog dropwdown unless you select an option that enables all digital entries again.

The code to to do this is not hard… it you defining the logic on what needs to be disable/enabled that needs clarification.

Adem · July 7, 2021, 3:47pm

Operates from 48.25 MHz to 860.75 MHz
1 Analog channel band is 7 MHz
1 Digital channel band is 8 MHz
These differences do not matter,
The important thing is not to let the 47-860 be selected more than the channel that will fit inside.
It can’t be more than it will fit, but a few channels may be missing, no problem here

The demodulator and modulator devices for the analog channel contain 8 channels
8+8+8+8+8+8… as; 8,16,24,32,40…as

For the digital channel, the devices contain 4 channels
4+4+4+4+4…as; 4,8,12,16,20,24…as

Sample:
If 32 channel analog is selected
32 bands used with analog

The last value of the digital channel is 72
72-32 = 40
In the digital channel selection list, the options after 40 should be disabled.

Up to 40 channels can be selected from the digital channel

The first selected restricts the other

Thank you for your attention

whispers · July 8, 2021, 4:54pm

This is more what we are looking for… the math/facts:

Sample:
If 32 channel analog is selected
32 bands used with analog

The last value of the digital channel is 72
72-32 = 40

So whatever (value) is selected in the first drop down (analog) + 8

anything ABOVE that value is what should be disabled in the digital dropdown…is this correct?

whispers · July 8, 2021, 5:19pm

Are they are limits in the analog selection… that need to be met before triggering (disabling) anything in the digital selections?

Such as the analog selection needs to be higher/equal to 32 to trigger any change?

heres one way to approach it:

//dropdown listener
$("#analog_channels").change(function(){
	var selectedFreq = parseInt(this.value);
	var digitalLimit = (selectedFreq + 8);				
	console.log("Value Check: " + selectedFreq);
	console.log("Digital Limit: " + digitalLimit);
	
	if(selectedFreq != ''){		
		//reset
		$("#digital_channels option").prop('disabled', false);					
		//set
		$("#digital_channels option").each(function () {						
			var digitalFreq = this.value;						 
			if (digitalFreq >= digitalLimit) {
				this.disabled = true;
			}						
		}); 
	}

});

Adem · July 9, 2021, 2:24pm

yes, it’s a bit of math
I haven’t tried your code yet
but an idea came to my mind
The maximum number of analog and digital channels is 72. (for convenience)

Yes, create a select option list with javascript when the add channel checkbox is checked
Digital or Analogue whichever is chosen
If analog is 8.16,24,32,40,48,56,64,72 (start 8 end 72)
If digital, 4,8,12,16,20,24,28,32…72 (start 4 end 72)

if checkbox is checked to add other channel
The last selected channel list will be as missing as the previous selected channel number.
if the first channel is analog selected: for digital (start 4 end 48 (72-24) )
if the first channel is digital selected: for analog (start 8 end 56 (72-16) )
AND if there is a change ± in the first selected channel number, the other channel select option will be recreated

https://jsfiddle.net/ademgenc/u3dstq85/7/

I don’t know if this idea is right or wrong you know better

Thank you

Adem · July 10, 2021, 10:26am

I tried the code and made changes in two places

var digitalLimit = (72 - selectedFreq);

if (digitalFreq > digitalLimit) {

When the analog channel is selected in this format, the digital channel restriction does exactly what I want.
OK, if first selected channel is Analog
What should I do if the first selected channel is digital?
Note: Example: if digital 12 channels are selected,
72-12= gives 60 results but there are no 60 values in the analog channel, how to apply 56 in such a case?
Or can it be done with an array?
[72=>8,68=>8,64=>16,60=>16,56=>24,52=>24,48=>32,44=>32,40=>40,36=>40,32=>48,28=>56,24=>56,20=>64,16=>64,12=>72,8=>72=>4=>72] as, taking all options into array

Thank you

whispers:

//dropdown listener
$("#analog_channels").change(function(){
	var selectedFreq = parseInt(this.value);
	var digitalLimit = (72 - selectedFreq);				
	console.log("Value Check: " + selectedFreq);
	console.log("Digital Limit: " + digitalLimit);
	
	if(selectedFreq != ''){		
		//reset
		$("#digital_channels option").prop('disabled', false);					
		//set
		$("#digital_channels option").each(function () {						
			var digitalFreq = this.value;						 
			if (digitalFreq > digitalLimit) {
				this.disabled = true;
			}						
		}); 
	}

});

your code works very well, Just missing analog from digital
https://jsfiddle.net/ademgenc/5ckye20o/11/

whispers · July 11, 2021, 12:16am

I’m not really understanding the logic still…

but you could use a look up array if you wanted?

OK… so if ‘Analog’ is working as you want…

lets re-visit the digital dropdown.

If a value is selected… how does that affect the analog options?

Why does it matter if there is NOT a ‘60’ option specifically? It will disable all values 60 -and- UNDER … (or should that be anything 60 -and- ABOVE? ) … and your saying that it should start as 56 -and- ABOVE to be disabled?

add code for another listener… and make the question line do whatever you need it to do:

//dropdown listener
$("#digital_channels").change(function(){
	var selectedFreq = parseInt(this.value);
	var analogLimit = (selectedFreq + 8);				
	console.log("Value Check: " + selectedFreq);
	console.log("Analog Limit: " +analogLimit);
	
	if(selectedFreq != ''){		
		//reset
		$("#analog_hannels option").prop('disabled', false);					
		//set
		$("#analog_channels option").each(function () {						
			var analogFreq = this.value;						 
			if (analogFreq >= analogLimit) {
				this.disabled = true;
			}						
		}); 
	}
});

Adem · July 11, 2021, 8:28am

I added a link that works from analog to digital, you can understand the logic by looking at it.your code

I used array instead of minus math and it turned out much nicer

works perfectly

It would be good

The logic here is this.
Let there be a maximum of 10 numbers, the first selected number will be subtracted from 10. In the other option, this remaining number can be selected.
It will not exceed 10 values when one is selected.will not exceed 10 values when both are selected

No no there is no 60 value rule
if 3 is selected, 10-3= 7, in the other, maximum 7 can be selected

JSFIDDLE

Adem · July 11, 2021, 9:25am

I tried the same code for digital to analog but it works on the first selection but when selecting from analog channel it restricts the digital channel list

I don’t know if it’s possible
If the first selected is Analog, this code should not work even if digital is selected.
$("#digital_channels").change(function(){

If the first selected is Digital, this code should not work even if Analog is selected.
$("#analog_channels").change(function(){

whispers · July 11, 2021, 8:45pm

Remove the listener.

ie: something like: (each line in its own, correct section of course)

//remove listenr on other dropdown
$("#digital_channels").off('change');

//remove listenr on other dropdown
$("#analog_channels").off('change');

Adem · July 12, 2021, 10:36am

I don’t fully understand because I don’t know Javascript.

I tried as below none worked

//$("#digital_channels").change(function(){
$("#digital_channels").off('change');

//});

//$("#analog_channels").change(function(){
$("#analog_channels").off('change');

//});

I tried as below none worked

//$("#digital_channels").change(function(){
$("#digital_channels").off('change'){

}
//});

//$("#analog_channels").change(function(){
$("#analog_channels").off('change'){

}
// });

whispers · July 12, 2021, 1:20pm


//dropdown listener
$("#analog_channels").change(function(){
	var selectedFreq = parseInt(this.value);
	var digitalLimit = (selectedFreq + 8);				
	console.log("Value Check: " + selectedFreq);
	console.log("Digital Limit: " + digitalLimit);
	
	if(selectedFreq != ''){		
		//reset
		$("#digital_channels option").prop('disabled', false);					
		//set
		$("#digital_channels option").each(function () {						
			var digitalFreq = this.value;						 
			if (digitalFreq >= digitalLimit) {
				this.disabled = true;
			}						
		}); 
		//remove listenr on other dropdown
		$("#digital_channels").off('change');
	}

}); 

//dropdown listener
$("#digital_channels").change(function(){
	var selectedFreq = parseInt(this.value);
	var analogLimit = (selectedFreq + 8);				
	console.log("Value Check: " + selectedFreq);
	console.log("Analog Limit: " +analogLimit);
	
	if(selectedFreq != ''){		
		//reset
		$("#analog_hannels option").prop('disabled', false);					
		//set
		$("#analog_channels option").each(function () {						
			var analogFreq = this.value;						 
			if (analogFreq >= analogLimit) {
				this.disabled = true;
			}						
		}); 
		
		//remove listenr on other dropdown
		$("#analog_channels").off('change');
	}
});

Adem · July 13, 2021, 10:11am

It works exactly as I want in my test trials.
Thank you so much

But there is a small problem, I don’t know if there is a solution, If not, what would your suggestion be?
Any checkbox, Digital or Analog, selected AND selected in the channel
When I select the other checkbox and look at the select option list, all channels are active, no channels are disabled
It restricts when another channel is selected in the first selected option.
In other words, when the user selects the first channel, checks the checkbox of the other and selects the channel, there is a situation where more channels are selected than the total number of channels allowed

I wonder if I should check for popups with alert() for such cases?

whispers · July 13, 2021, 1:54pm

I dont understand what your trying to say the problem is. (sorry)

I dont know what purpose a ‘checkbox’ has here… (it was in none of the examples)

Starting with Analog choice first:

You make a selection from the Analog dropdown… - that works as intended…yes?
After selection from Analog dropdown… it does disables the correct Digital options…yes?

Starting with Digital choice first:

You make a selection from the Digital dropdown… - that works as intended…yes?
After selection from Digital dropdown… it does disables the correct Analog options…yes?

This comment:
“I chose second box. No channels restrictions”… doesnt seem accurate.

In the example provided:

Demo 1:

I selected ‘16’ from Analog dropdown
In Digital dropdown, all entries above 20+ we disabled

Demo 2:

I selected ‘24’ from Digital dropdown
In Analog dropdown, all entries above 24+ we disabled

Dont talk about any other ‘terms’ outside of the dropdowns… the selection(s), and the expected results.

Adem · July 14, 2021, 1:09pm

Sorry I can’t explain well due to language.

If he wants to add which channel or both channel systems to the system, he activates the channel selection option by selecting the box.
If the box is not selected, it means there is no channel.

It works exactly as I want,
I will try to explain briefly what I am trying to explain.

For analog I chose box and then channel.(no problem here)
Note: box not selected for digital channel
For dijital I chose box and then channel.(no problem here)
Note: box not selected for analog channel

No problem so far

I selected a box for Analogue or Digital channel (It doesn’t matter which one I choose, this applies to both.)
AND I chose the channel
the problem starts right here
Since the other channel selection is not active, when I selected the channel above, it could not restrict the list.
Now I choose the other box, Now I select the other box and there are no disabled in the channel list
Because I had selected channel above before activating this
Now, while this second one is active, when I change the channel above, it disables the list. because it is active
I will try to make a screen video
Sorry again, I made you so busy.

whispers · July 15, 2021, 3:30pm

OK…

I am understanding the issue a little better.

Question: Again… WHY the checkboxes? What is the purpose? (especially if you have to pick from both)

As a suggested solution… perhaps add some code to the checkbox that checks if the other dropdown is selected/activated already… and if so… run the same function/actions…