Page 1 of 2

Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 3:27 pm
by sandeepgumudelli
Hi,

Can this be possible to achive?

Background color of the field need to be changed after save based on the value selection from drop down.

Thank you very much for your help in advance.

Regards,
Sandeep

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 3:58 pm
by toms
Hi,

Place this code to your form’s Javascript section (Options Menu -> Form Properties -> Custom Code -> JS)

Code: Select all

function colorSelect(f) {
  
	var val = $('#' + f).val();
	var bgcolor;
  
	switch(val) {
		case '0':
			bgcolor = 'green';
			break;
		case '1':
			bgcolor = 'red';
			break;
		default:
			bgcolor = 'white';
	}
  
	$('#' + f).css('background-color', bgcolor);
	$('#' + f + ' option').css('background-color', 'white');
	$('#' + f + ' option').css('color', 'black');
  
}

if (nuFormType() == 'edit' && nuCurrentProperties().record_id != '-1') {
   colorSelect('YOUR_FIELD');  // <--------------  Replace with your field ID
}

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 4:47 pm
by sandeepgumudelli
Thank you very much quick response tom. It is working perfectly with in the form. However, when i tried it in subform nothing happening. any suggestion please?

I tried keeping the code in main form adding subform_id.field_id in thelast line of code. but no luck

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 4:58 pm
by toms
Is your subform type "Grid" or "Form" ?
subform_type.png

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 5:02 pm
by sandeepgumudelli
it's grid

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 5:23 pm
by toms
Try something like this (untested):

Code: Select all

function colorSelect(f) {
  
   var val = $('#' + f).val();
   var bgcolor;
  
   switch(val) {
      case 'OK':
         bgcolor = 'green';
         break;
      case '1':
         bgcolor = 'red';
         break;
      default:
         bgcolor = 'white';
   }
  
   $('#' + f).css('background-color', bgcolor);
   $('#' + f + ' option').css('background-color', 'white');
   $('#' + f + ' option').css('color', 'black');
  
}

if (nuFormType() == 'edit' && nuCurrentProperties().record_id != '-1') {

 $('[id ^=sub_monthly_emp_status][id $=emp_status]').each(function () {
         colorSelect($(this).attr('id'));
     }) 
}	 


Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 5:50 pm
by sandeepgumudelli
just removed on closing } and tried with code by replacing sub_form_id and field_id but no luck.

Code: Select all

function colorSelect(selector) {

   var val = $(selector).val();
   var bgcolor;

   switch (val) {
      case 'ABC':
         bgcolor = 'green';
         break;
      case 'DEF':
         bgcolor = 'red';
         break;
      default:
         bgcolor = 'white';
   }

   $(selector).css('background-color', bgcolor);
   $(selector + ' option').css('background-color', 'white');
   $(selector + ' option').css('color', 'black');

}

if (nuFormType() == 'edit' && nuCurrentProperties().record_id != '-1') {

   $('[id ^=sub_monthly_emp_status][id $=emp_status]').each(function () {
         colorSelect($(this).attr('id'));
      }
  ) }

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 6:33 pm
by toms
I corrected my post above

Re: Color of a field based on value selection from dropdown

Posted: Mon Aug 13, 2018 8:48 pm
by sandeepgumudelli
Thank you very much Tom. It is working perfect.. Once again thanks.

Re: Color of a field based on value selection from dropdown

Posted: Tue Aug 14, 2018 8:09 am
by toms
Nice!