You are viewing limited content. For full access, please sign in.

Question

Question

Form Field Color on Approvers Form

asked on October 6, 2017

I have this JavaScript (below) that changes the field background if the users enters some text.

$(document).ready(function(){
  $('.collection').on('change', 'input', changeColor);
  $('.normalField').on('change', 'input', changeColor);
  $('.collection .cf-collection-append').hide();
  $('.dropdown').on('change', 'select', changeColor); 
  function changeColor () {
    if ($(this).val() != '') {
      $(this).css('background','#ffff99');
    }
    else {
      $(this).css('background','none');
    }     
  }
});

However, I need to find a way to change the color of the field on the "approvers" second form. Maybe their is some JavaScript that changes the field background if there is text already in the field?

Thanks in advance

Jonathan

0 0

Answer

SELECTED ANSWER
replied on October 9, 2017

@████████

Thanks for your JS. It does work, however, it would have meant that I would have to write it out for each field i.e. all 100+ of them

A (very busy) colleague of mine did this for me.. 

$( document ).ready(function() {
;
  $('li.Color input').each(function() { 
   var element = $(this);
    if(element.val().length > 0) {
      element.css('background','#ffff99');
    }
});
});  

All you need then, is to enter 'Color' in to the CSS of the fields.

1 0

Replies

replied on October 6, 2017

An old-school way would be to do this. I'm sure there is a better cleaner way though. Just replace the (@@) with the actual Field Number like Field30. It's in 3 places.

$( document ).ready(function() {

setTimeout(function(){  

  var i = 0;
    
    $(".normalField input").each(function() {
      
    i++; 

var normalField = $('#Field@@\\(' + i + '\\)').val(); // replace the @@with the actual field number
 
if (normalField  > '') {

 $('#Field@@\\(' + i + '\\)').css('background', '#ffff99');  // replace the @@with the actual field number

}
else
{
  $('#Field@@\\(' + i + '\\)').css('background', 'none');  // replace the @@with the actual field number
}

});   

}, 0); //end setTimeout 

});

 

2 0
SELECTED ANSWER
replied on October 9, 2017

@████████

Thanks for your JS. It does work, however, it would have meant that I would have to write it out for each field i.e. all 100+ of them

A (very busy) colleague of mine did this for me.. 

$( document ).ready(function() {
;
  $('li.Color input').each(function() { 
   var element = $(this);
    if(element.val().length > 0) {
      element.css('background','#ffff99');
    }
});
});  

All you need then, is to enter 'Color' in to the CSS of the fields.

1 0
You are not allowed to follow up in this post.

Sign in to reply to this post.