Page 1 of 2

Change label within grid cell on click

Posted: Tue Jan 13, 2015 5:16 am
by 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


Change label within grid cell on click

Posted: Tue Jan 13, 2015 5:44 am
by 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.


Change label within grid cell on click

Posted: Tue Jan 13, 2015 6:01 am
by 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


Change label within grid cell on click

Posted: Wed Jan 14, 2015 12:20 am
by juricin

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


Change label within grid cell on click

Posted: Wed Jan 14, 2015 12:46 am
by 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.


Change label within grid cell on click

Posted: Fri Jan 16, 2015 11:09 am
by juricin

Great! that worked.

one last thing regarding this:

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

thanks, ante


Change label within grid cell on click

Posted: Fri Jan 16, 2015 7:42 pm
by 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;
}


Change label within grid cell on click

Posted: Fri Jan 16, 2015 9:23 pm
by juricin

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

Ante


Change label within grid cell on click

Posted: Sat Jan 17, 2015 8:01 am
by Illya Stepanov

Hi Ante -

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


Change label within grid cell on click

Posted: Sun Jan 18, 2015 5:16 am
by 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