Form with images and events.

I need a form, where:

1. A checkbox grup have an custom image next to the option.

2. When one box is checked a dropdown shows up under that checkbox.

Hope you can help.

ps, not very good at coding.

Hi bunthu,

1. You can do this with a Custom Code element from the advanced elements group:

<div class="form-group gcore-form-row" id="form-row-fruit_picker">
  <label for="fruit_picker" class="control-label gcore-label-left gcore-label-checkbox">Pick a fruit</label>
  <div class="gcore-input gcore-display-table" id="fin-fruit_picker">
    <div class="gcore-single-column" id="fclmn">
      <div class="gcore-checkbox-item" id="fitem">
        <input name="fruit_picker[]" id="fruit_picker" class="A" title="" style="" data-load-state="" data-tooltip="" type="checkbox" value="apple">
        <label class="control-label gcore-label-checkbox" for="fruit_picker">Apple <img src='/images/apple.png' /></label>
      </div>
      <div class="gcore-checkbox-item" id="fitem1">
        <input name="fruit_picker[]" id="fruit_picker1" class="A" title="" style="" data-load-state="" data-tooltip="" type="checkbox" value="orange">
        <label class="control-label gcore-label-checkbox" for="fruit_picker1">Orange <img src='/images/orange.png' /></label>
      </div>
      <div class="gcore-checkbox-item" id="fitem2">
        <input name="fruit_picker[]" id="fruit_picker2" class="A" title="" style="" data-load-state="" data-tooltip="" type="checkbox" value="banana">
        <label class="control-label gcore-label-checkbox" for="fruit_picker2">Banana  <img src='/images/banana.png' /></label>
      </div>
    </div>
  </div>
</div>

See the second checkbox in my test form here

2. If you use a Custom Code element it doesn't have an Events tab like the Checkbox group element. You can though use the Events sub-tab on the Designer tab to do the same thing.

Bob