Fixes #3119 (#3163)

Added readOnly support to RecordFinder, Switch widget and relation widget including dropdown Fixes #3119. Credit to @romaldyminaya

modules/backend/formwidgets/recordfinder/partials/_container.htm

@@ -1,6 +1,6 @@
 <?php if ($this->previewMode && !$value): ?>
 
-    <span class="form-control"><?= e(trans('backend::lang.form.preview_no_record_message')) ?></span>
+    <span class="form-control" disabled="disabled"><?= e(trans('backend::lang.form.preview_no_record_message')) ?></span>
 
 <?php else: ?>
 
@@ -8,4 +8,4 @@
         <?= $this->makePartial('recordfinder') ?>
     </div>
 
-<?php endif ?>
+<?php endif ?>

modules/backend/formwidgets/recordfinder/partials/_recordfinder.htm

@@ -1,10 +1,16 @@
+<?php
+    $previewMode = false;
+    if ($this->previewMode || $field->readOnly) {
+        $previewMode = true;
+    }
+?>
 <div
     id="<?= $this->getId() ?>"
     class="field-recordfinder loading-indicator-container size-input-text"
     data-control="recordfinder"
     data-refresh-handler="<?= $this->getEventHandler('onRefresh') ?>"
     data-data-locker="#<?= $field->getId() ?>">
-    <span class="form-control">
+    <span class="form-control" <?= $previewMode ? 'disabled="disabled"' : '' ?>>
         <?php if ($value): ?>
             <span class="primary"><?= e($nameValue) ?: 'Undefined' ?></span>
             <?php if ($descriptionValue): ?>
@@ -15,7 +21,7 @@
         <?php endif ?>
     </span>
 
-    <?php if (!$this->previewMode): ?>
+    <?php if (!$previewMode): ?>
         <?php if ($value): ?>
             <button
                 type="button"

modules/backend/widgets/form/partials/_field_dropdown.htm

@@ -4,8 +4,16 @@
     $emptyOption = $field->getConfig('emptyOption', $field->placeholder);
 ?>
 <!-- Dropdown -->
-<?php if ($this->previewMode): ?>
-    <div class="form-control"><?= (isset($fieldOptions[$field->value])) ? e(trans($fieldOptions[$field->value])) : '' ?></div>
+<?php if ($this->previewMode || $field->readOnly): ?>
+    <div class="form-control" <?= $field->readOnly ? 'disabled="disabled"' : ''; ?>>
+        <?= (isset($fieldOptions[$field->value])) ? e(trans($fieldOptions[$field->value])) : '' ?>
+    </div>
+    <?php if ($field->readOnly): ?>
+        <input
+             type="hidden"
+             name="<?= $field->getName() ?>"
+             value="<?= $field->value ?>">
+    <?php endif; ?>
 <?php else: ?>
     <select
         id="<?= $field->getId() ?>"

modules/backend/widgets/form/partials/_field_switch.htm

@@ -1,3 +1,9 @@
+<?php
+    $previewMode = false;
+    if ($this->previewMode || $field->readOnly) {
+        $previewMode = true;
+    }
+?>
 <!-- Switch -->
 <?php
     $on = isset($field->config['on']) ? $field->config['on'] : 'backend::lang.form.field_on';
@@ -14,15 +20,15 @@
     type="hidden"
     name="<?= $field->getName() ?>"
     value="0"
-    <?= $this->previewMode ? 'disabled="disabled"' : '' ?>>
+    <?= $previewMode ? 'disabled="disabled"' : '' ?>>
 
-<label class="custom-switch" <?= $this->previewMode ? 'onclick="return false"' : '' ?>>
+<label class="custom-switch" <?= $previewMode ? 'onclick="return false"' : '' ?>>
     <input
         type="checkbox"
         id="<?= $field->getId() ?>"
         name="<?= $field->getName() ?>"
         value="1"
-        <?= $this->previewMode ? 'readonly="readonly"' : '' ?>
+        <?= $previewMode ? 'readonly="readonly"' : '' ?>
         <?= $field->value == 1 ? 'checked="checked"' : '' ?>
         <?= $field->getAttributes() ?>>
     <span><span><?= e(trans($on)) ?></span><span><?= e(trans($off)) ?></span></span>

modules/system/assets/ui/less/form.base.less

@@ -140,7 +140,7 @@ output {
     &[readonly],
     fieldset[disabled] & {
         cursor: not-allowed;
-        background-color: @input-bg-disabled;
+        background-color: @input-bg-disabled !important;
         color: @input-color-disabled;
         opacity: 1; // iOS fix for unreadable disabled content
     }