How do I insert a (star rating) html within a grid?

[Louis Adekoya]

I followed Mark B's instructions in https://getsatisfaction.com/apperyio/... to create a star rating as an html component.

When the html component is on its own in the page, the star rating looks and works fine. When I put the html component in a grid however, I cannot get the star rating to work properly - it is all greyed out and clicking it does nothing.

Is there perhaps a way to do this dynamically with Javascript? I'm thinking I could remove the html component from the grid in design mode and instead append it with JS, but I can't figure out how to do that.

Any help would be most appreciated. Thanks.

[Serhii Kulibaba]

Hello Louis,

It seems like CSS/JS problem. Can you provide more details, screenshots or exact steps to reproduce this problem?

[Louis Adekoya]

Hi Sergiy,

Mark B posted some steps at the link above. I followed them - copied the css and JS files to my project, edited the source as he suggested and entered the html he prescribed into a html component. When the component is outside the grid, it works (except that there are more stars than I expect - but that's another issue). See screenshot.

When I place the html component inside my grid (where I have the youtube videos that need to be rated), the stars are greyed out. See other screenshot.

Note that at this stage I have no mapping going into my html component.

[Serhii Kulibaba]

Please check if there are any errors in the browser console. You can learn here: https://devcenter.appery.io/documenta... how to open the console.

[Louis Adekoya]

Hi Sergiy,

There was an error - that a css file could not be loaded. I have now dealt with that by reinstalling the files. The error no longer comes up but the the original problem remains. No more errors in the console.

As I said before it is interesting that when placed outside the grid, the ratings image looks better. What sort of css/js issue would affect it in the grid but not outside?

Edit: By the way, one thing that I did differently (this time around) to what Mark B prescribed is that I didn't edit the css file from the source tab. Instead I just edited the css from within the project tab. Does this make a difference? I doubt it because I can see that my change is reflected in the source tab anyway.

[Serhii Kulibaba]

No, it doesn't matter how to add CSS.

Unfortunately custom JS/CSS is something outside the scope of standard Appery.io platform support. You may consider purchasing Advisory Pack to get more in-depth help on this question. Here is more information about Advisory Pack (http://appery.io/services/#Advisory_Pack).

[Louis Adekoya]

Sergiy, it is an assumption at this point that it is a JS/CSS issue and I'm not entirely convinced it is. The issue could well be with the grid component. I upgraded recently to the Pro version, is this advisory pack not included in that? I'd be disappointed if it wasn't.

[Illya Stepanov]

Hi Louis - Pro plan is a subscription, Advisory pack options are provided on demand, you can purchase it whenever you need in your Account tab - click on “Support Packs” on the left side.

Please read details here: http://appery.io/services/#Advisory_Pack