Multiselect Grid widget: change background of the widget

Hi,

I am trying to develop a form where soccer/football referees can mark on a picture of the field the location where a foul or incident occurs and where they were standing when they stopped play (blew the whistle).

I came across the multiselect grid which would do what I want, providing I can set an image similar to the one below as the background image.  They would then select the appropriate grids.

Is this possible?  Or is there another tool I can use?

Thanks.

you may inject the following CSS in your widget's CSS tab.

 #tablegrid{ background: url("https://cms.jotform.com/uploads/image_upload/image_upload/global/68011_foot.png") no-repeat; } 

#tablegrid td{

background: None !important;

}

Please note that the file must be uploaded in a server and the URL of your file must be pointed here. Also, you may adjust the dimensions of your file according to the size of the widget.

Follow this screenshot:

You may refer to my form.

https://www.jotform.com/82632982584973

Hope this helps!

Thanks.

Hi Roneet,

Thanks for that.

Just one more question.

I have set the width of the columns and will work on getting the image to the right scale/size.

However, it seems that this widget only allows each grid to be selected once unless you clear the submissions.  This won't work in our case where more than one referee will be completing a report at a time.

https://form.jotform.co/82557436137866

Is there any tool or widget that allows me to have someone select multiple "grids"?

Please note that when the form with "MultiSelect Grid" widget is submitted, the selected cell of the grid will not be available to any other user. That is how the MultiSelect Grid widget works. 

I have moved your question related to input table widget to a new thread so that we can address it separately. You will be answered in the following thread:   https://www.jotform.com/answers/1590487