Php change background color on different value

Question

So i have this code that creates a SELECT in a FORM, i was wondering how can i make it to add a different background color when $value is different.

Please have in mind that $value is not always the same text and may change.

PHP CODE:

<div class="line"><select style="width: 100%;" name="fields['.base64_encode('Itinerary - Days').']" class="required">
  <option value="">--- Select Deck & Itinerary ---</option>';

foreach($main_title_array as $key => $value):    
$f.= '<option style="background-color:" value="'.$value.'">'.$value.' / '.$type_array[$key].'</option>';
endforeach;

$f.='</select></div>';

RESULT:

 <select class="required" name="fields[SXRpbmVyYXJ5IC0gRGF5cw==]" style="width: 100%;">
      <option value="">--- Select Deck &amp; Itinerary ---</option>
      <option value="Lower Deck" style="background-color:">Lower Deck / Discovery Itin 4D &ndash; 3N</option>
      <option value="Lower Deck" style="background-color:">Lower Deck / Discovery Itin 5D &ndash; 4N</option>
      <option value="Lower Deck" style="background-color:">Lower Deck / Discovery Itin 8D &ndash; 7N</option>
      <option value="Main Deck" style="background-color:">Main Deck / Discovery Itin 4D &ndash; 3N</option>
      <option value="Main Deck" style="background-color:">Main Deck / Discovery Itin 5D &ndash; 4N</option>
      <option value="Main Deck" style="background-color:">Main Deck / Discovery Itin 8D &ndash; 7N</option>
      <option value="Upper Deck" style="background-color:">Upper Deck / Discovery Itin 4D &ndash; 3N</option>
      <option value="Upper Deck" style="background-color:">Upper Deck / Discovery Itin 5D &ndash; 4N</option>
      <option value="Upper Deck" style="background-color:">Upper Deck / Discovery Itin 8D &ndash; 7N</option>
    </select>

WANTED RESULT:

<select class="required" name="fields[SXRpbmVyYXJ5IC0gRGF5cw==]" style="width: 100%;">
  <option value="">--- Select Deck &amp; Itinerary ---</option>
  <option value="Lower Deck" style="background-color:red">Lower Deck / Discovery Itin 4D &ndash; 3N</option>
  <option value="Lower Deck" style="background-color:red"">Lower Deck / Discovery Itin 5D &ndash; 4N</option>
  <option value="Lower Deck" style="background-color:red"">Lower Deck / Discovery Itin 8D &ndash; 7N</option>
  <option value="Main Deck" style="background-color:white">Main Deck / Discovery Itin 4D &ndash; 3N</option>
  <option value="Main Deck" style="background-color:white">Main Deck / Discovery Itin 5D &ndash; 4N</option>
  <option value="Main Deck" style="background-color:white">Main Deck / Discovery Itin 8D &ndash; 7N</option>
  <option value="Upper Deck" style="background-color:black">Upper Deck / Discovery Itin 4D &ndash; 3N</option>
  <option value="Upper Deck" style="background-color:black">Upper Deck / Discovery Itin 5D &ndash; 4N</option>
  <option value="Upper Deck" style="background-color:black">Upper Deck / Discovery Itin 8D &ndash; 7N</option>
</select>

Ricardo Barros · Accepted Answer · 2014-03-10 17:24:22Z

1

Try this solution

// List of colors
$colors = array('red', 'white', 'black','blue');

//The lenght of the colors available
$lenght_colors = count($colors);

//store last deck
$last_deck = null;

//Counters
$count = 0;

// Avoid warnings
$f = null;

foreach($main_title_array as $key => $value)
{
    // Switch colors
    if($last_deck != $value)
    {
        // Check if you reached the limit of colors available if yes reset the count
        if($count != $lenght_colors)
        {
            $count++;
        }
        else
        {
            $count = 0;
        }
    }

    $f .= '<option style="background-color:'.$colors[$count].'" value="'.$value.'">'.$value.' / '.$type_array[$key].'</option>';
    $last_deck = $value;
}

edited Mar 10, 2014 at 17:24

answered Mar 10, 2014 at 17:04

Ricardo Barros

2051 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Ered Over a year ago

ok ur code adds the background color...the problem is $step = 3; it telling the code to change color after 3 lines...when it should change the color for the values that are the same... if $value equals Lower Deck than print RED...just have in mind the text could change

Ricardo Barros Over a year ago

So you need, to have a comparison table where you say Lower Deck == 'red' , Main Deck == 'white' and so on, give me a sec I will write another answer based on this

Ered Over a year ago

yes thats what im looking for...the only problem like i told u is that $value is not always the same...Lower Deck could change to other text like FRONT DECK...the code should change the color only if the $value is not the same

Ered Over a year ago

thanks, your other post is really close...only thing to fix is that values could change in $decks_color

Ered Over a year ago

hey sorry for the dely, ur code worked! quick question it starts with white color instead of RED...

|

Ricardo Barros · Accepted Answer · 2014-03-10 17:19:17Z

1

Try this one

// Decks Color
$decks_color = array('Lower Deck' => 'red', 'Main Deck' => 'white', 'Upper Deck' => 'black');

// Avoid warnings
$f = null;

foreach($main_title_array as $key => $value)
{
    $f .= '<option style="background-color:'.$decks_color[trim($value)].'" value="'.$value.'">'.$value.' / '.$type_array[$key].'</option>';
}

answered Mar 10, 2014 at 17:19

Ricardo Barros

2051 silver badge8 bronze badges

1 Comment

Ered Over a year ago

now thats what im taking about...only problem is that text changes

superUntitled · Accepted Answer · 2014-03-10 16:49:31Z

0

I have not tested this, but here is the gist...

You need to create an array of colors, then in your loop, check to see if the value has changed. If it has, increase the index, set a the color variable, and keep moving...

<?
$valCheck = "";
$colors = array('red', 'white', '#023');
$count = 0;
$color = $colors[$count];

foreach($main_title_array as $key => $value):    

    if($valCheck != $value){
    $color = $colors[$count];
    $valCheck = $value;
    $count++;
    }
    $f.= '<option style="background-color:'.$color.'" value="'.$value.'">'.$value.' / '.$type_array[$key].'</option>';

endforeach;

edited Mar 10, 2014 at 16:49

answered Mar 10, 2014 at 16:39

superUntitled

22.6k30 gold badges86 silver badges113 bronze badges

2 Comments

superUntitled Over a year ago

yes, if you want more colors, add them to the colors array.

superUntitled Over a year ago

$colors = array('red', 'blue', 'green', 'yellow', '#789899', 'rgba(200, 54, 54, 0.5)', '#023');

Brandon Kiefer · Accepted Answer · 2014-03-10 16:58:16Z

0

$f.= "<option style=background-color:".[YOUR VALUE VARIABLE]."
value='".$value."'>".$value
/$type_array[$key]."</option>";

Personally enclosing all non-php with " " instead of ' ' is easier to maintain. Also using ' ' in side of non-php for the HTML to process.

Your code does not produce any value for "background-color". It seems you forgot a variable after "background-color" and instead moved on to the value property.

answered Mar 10, 2014 at 16:58

Brandon Kiefer

3493 silver badges9 bronze badges

4 Comments

Ered Over a year ago

does not answer mi inquiry

Brandon Kiefer Over a year ago

<option style="background-color:" value="'.$value.'"> is <option style=background-color:; value="RED"> instead you need to define a variable for the background-color itself. <option style="background-color:RED" value="'.$value.'">

Ered Over a year ago

i did not forget the background-color value...its just an example of how the output is at the moment...

Brandon Kiefer Over a year ago

<option style='"background-color:".$color."'> Where is the $color variable in your code? I am trying to help you out. But you are not giving clear responses as to what you actually need.

Collectives™ on Stack Overflow

Php change background color on different value

4 Answers 4

7 Comments

1 Comment

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

7 Comments

1 Comment

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related