Dependant dropdowns

Questions › Dependant dropdowns

Alberto asked 2 years ago

Hi,

I’m looking to have the following.

In the grid, have a column(1) with a dropdown A,B,C

Next column(2) will have a dropdown A11,A12,B11,B12,C11,C12.

And the next column(3) will have a dropdown A21,A22,B21,B22,C21,C22

When in the the first column 1, you select A

The other columns dropdowns (2,3) will only show options related to the value of the first.

For example:

Cal1 = A

Col 2 = A11,A12

Col3 = A21,A22

Any ideas on how to do this?

Kind regards,

Alberto.

2 Answers

Abu Ghufran Staff answered 2 years ago

Hi,

This can be done using javascript code.

$opt["add_options"]["afterShowForm"] = "function(){ setup_fields(); }";
$opt["edit_options"]["afterShowForm"] = "function(){ setup_fields(); }";

Now in JS code, you can connect onchange event on column1 and hide/show certain options on col2 using javascript OR jquery code.

function setup_fields()
{		
	if ($('#col1').val() == 'A') {
		// ...
	}
	else {
		// ...
	}

	$('#col1').change(function(){
		// ...
	});
}

If the dependent data is coming from database, you can review our demo of country-city-state dropdown
Demo and Code.

_________________________
Abu Ghufran - Dev Team
Grid 4 PHP Framework

Alberto answered 2 years ago

Hi Abu,

Thanks a lot for your help!!

I’ve sent you an email as a reply to this.

Kind regards,

Alberto.

Your Answer