►HOWTO◄ Dynamic colors of Query output cells

customaware

No John,

I get the Color Picker pop up and I change the Color and press either Enter (Or apply after I changed the //buttons:false) and the ColorPicker
disappears and the Color cell stays exactly the same (yes,I have tried refreshing.

I can do a mini recording if it would help.

Jaymer

Badd Asss DUDE!!!

Screen Shot 2016-04-04 at 2.28.32 AM.png

I haven't taken time to go put correct colors in, but i added a field in the lineitems table and typed in random "#445567" color strings and VOILA!!!
Was a bitch figuring out how to do it though, cause its not a simple 2 column deal like in your example. Plus, I had no freaking idea what was going on. I do now. Ready to cause all sorts of havoc on kendo query templates!!!
Only issue is that I have 3 buttons in those last 3 columns - have no idea what they're called to use in the template.

thanks again John--- you da man!
jaymer...

Jaymer

JOHN
Having same results as Mark.

Popup mode, or not.
Value will not stick into the field.
Tried your BSV.
Tried mine, after the hack to show colors in my grid, thought it would be fun to colorize them with the picker, but no joy.
Both BSVs will not show any sign of getting a value back from the JS

Actually, thats not correct.
Not using the popup, the new color DOES return - but when you leave the field it reverts back. And the NEW value is there if you activate the picker again (as opposed to original value).
The grid or Aware doesn't think the value changed. It DID change, but its lost after focus.

johntalbott

I created a new BS and imported the BSV that I sent. It's working for me there and my original BS that I exported.

Note: The extent of what I did was focused on Editing the ColorCode in an existing rows. The ColorName will never switch even if you change the color using the picker. And I didn't do anything to handle New rows, so it may not work at all for that.

So for editing a color ....

I click on a row and get the pop-up
I select a different color and click Apply. At this point see the color switch in the pop-up AND the cell in the grid behind the pop-up.
I close the pop-up and the new color is saved.
I refresh the grid the new color is still there.

For troubleshooting .... If you haven't already open the browser dev tools (F12) and watch the console to see if there are js errors.

Jaymer

johntalbott wrote
I created a new BS and imported the BSV that I sent.

So for editing a color ....

I click on a row and get the pop-up

I select a different color and click Apply. At this point see the color switch in the pop-up AND the cell in the grid behind the pop-up.

I close the pop-up and the new color is saved.

I refresh the grid the new color is still there.

For troubleshooting .... If you haven't already open the browser dev tools (F12) and watch the console to see if there are js errors.

1. Yes

2. Have "Update", not Apply. Click Update and it closes

3. Already closed

4. Same 'ol colors

5. No errors.

IF I REMOVE the path to Custom/JS (temporarily), refresh and try again, then I DOO SEE the cell behind the popup change when I alter the text field (ie. #eeddff) to something else and tab off. But it doesn't do that using Colorpicker.

jaymer...

johntalbott

Jaymer wrote
johntalbott wrote
I created a new BS and imported the BSV that I sent.

Have "Update", not Apply. Click Update and it closes

jaymer...

If there isn't an Apply button check your js file. The buttons line below needs commented out or removed.

// buttons: false

The color picker should look like this ...

Jaymer

No Joy
Imported fresh
Deleted the line (and comma at end of prior line)
Apply button now shows, so we KNOW we are hitting the correct JS
Click apply, no change to window behind
Update closes the window
Same 'ol color

Screen Shot 2016-04-04 at 6.07.15 PM.png
See how I've changed color to black, and clicked Apply. That closed the Picker.
Blue color still behind.

johntalbott

Change the 2nd line in your custom js file to this ...

    // set its name to the field to which the column is bound ('name' in my case)
    input.attr("name", options.field);

customaware

PERFECTO!!!!!
Thanx John..... Bloody Fantastic!

Jaymer

oh sure,
that works!

customaware

John,

Just one issue.....

If you have any operations buttons on the Query roes when you apply the Row template in the Advanced properties then they are wiped out.

Any idea how to overcome that?

johntalbott

Not yet .. I messed with on this very issue the other day, but ran out of time. I'm hoping that support will jump in regarding this topic to save us some time.

My colorpicker thinkering cycles are all used up for now.

customaware

Well, we are certainly grateful. Thanx.

aware_support

Please see this thread that contains the script you need:
Integration of color picker on a form

« Previous Page