Change label within grid cell on click

[juricin]

Hi, im stuck.

I am mapping from storage to a label within a grid cell. I'd like to click on the grid cell which will map something different from storage and have the grid cell background change color.

thanks in advance, ante

[Yurii Orishchuk]

Hi juricin,,

Here is plan for this goal:

1. Add grid cell "click" JS event handler.

2. Populate it with following JS code:

   pre

   var cell = jQuery(this);

   //Change cell background
   cell.css("background", "#f00");

   //Where "labelName" is your label name.
   var label = cell.find('[name="labelName"]');

   //Change label background
   label.css("background", "#0f0");

   /pre

   Regards.

[juricin]

thanks Yurii, sort of there.

grid cell background is changing, great.

unresolved:

I have two labels in this grid cell. One label is simple text with the word 'Good' this needs to change to 'Received' on click in same position

the second label 'good_count' is currently mapping from storage 'received_count' and this needs be replaced with a new label to map 'received_amount' in the same position. do i even need a new label? or just target the same label?

and return click takes back to previous

thanks, ante

[juricin]

Am i supposed to comment directly? see below. thanks, ante

[Yurii Orishchuk]

HI Juricin,

It seems you just need hide "good_count" and show "received_count" label.

Here is code:

pre

Apperyio("good_count").hide();
Apperyio("received_count").show();

/pre

Regards.

[juricin]

Great! that worked.

one last thing regarding this:

if you click on the grid cell again it returns to previous state.

thanks, ante

[Ihor Didevych]

Hello,

You should add a flag that will store the state
var flag_checked;
if (flag_checked){
Apperyio("good_count").hide();
Apperyio("received_count").show();
flag_checked = true;
}else{
Apperyio("good_count").show();
Apperyio("received_count").hide();
flag_checked = false;
}

[juricin]

Hi Ihor, thanks but this has now disabled the click event and its not working.

Ante

[Illya Stepanov]

Hi Ante -

Could you please clarify what exactly is not working? How you implemented the above code?

[juricin]

Hi Illya,

On the grid cell component there is a click event that runs javascript as per Ihor's suggestion

var flag_checked;
if (flag_checked){
Apperyio("good_count_label").hide();
Apperyio("good_amount_label").show();
Apperyio("textGood").hide();
Apperyio("textRaised").show();
flag_checked = true;
}else{
Apperyio("good_count_label").show();
Apperyio("good_amount_label").hide();
Apperyio("textGood").show();
Apperyio("textRaised").hide();
flag_checked = false;
}

This is to show and hide labels within the grid cell when a user clicks to display different text and different storage from mapping.

Yurri's suggestion further above works but once I added flag_checked it no longer executes the click on event or show/hide labels.

thanks, ante