diff --git a/app/views/messages/index.html.erb b/app/views/messages/index.html.erb
index 96de30f..a287fc6 100644
--- a/app/views/messages/index.html.erb
+++ b/app/views/messages/index.html.erb
@@ -164,16 +164,26 @@ $('#message_receiver_id').on('change', function() {
var selectedText = $select.find('option:selected').text();
var selectedValue = $select.val();
+ console.log('=== DROPDOWN DEBUG ===');
console.log('Selected recipient:', selectedText);
console.log('Selected value:', selectedValue);
- console.log('Current display:', $select.css('color'));
- console.log('Select element text:', $select.text());
console.log('Selected index:', this.selectedIndex);
console.log('Options count:', $select.find('option').length);
-
- // Log the actual option that should be selected
console.log('Option at selectedIndex:', $select.find('option')[this.selectedIndex].text);
+ // Check computed styles that might hide text
+ var computedStyle = window.getComputedStyle(this);
+ console.log('Font size:', computedStyle.fontSize);
+ console.log('Color:', computedStyle.color);
+ console.log('Background:', computedStyle.backgroundColor);
+ console.log('Text indent:', computedStyle.textIndent);
+ console.log('Overflow:', computedStyle.overflow);
+ console.log('Display:', computedStyle.display);
+ console.log('Visibility:', computedStyle.visibility);
+ console.log('Opacity:', computedStyle.opacity);
+ console.log('Width:', computedStyle.width);
+ console.log('Height:', computedStyle.height);
+
// Try forcing the selected attribute
$select.find('option').removeAttr('selected');
$select.find('option:selected').attr('selected', 'selected');
@@ -331,13 +341,19 @@ $("#submit_button").click(function(event) {
}
}
- /* Ensure dropdown displays selected value properly */
+ /* Force dropdown to display selected value */
#message_receiver_id {
color: #212529 !important;
background-color: #fff !important;
-webkit-appearance: menulist !important;
-moz-appearance: menulist !important;
appearance: menulist !important;
+ text-indent: 0 !important;
+ text-overflow: clip !important;
+ overflow: visible !important;
+ font-size: 1rem !important;
+ line-height: 1.5 !important;
+ padding: 0.5rem 2.25rem 0.5rem 0.75rem !important;
}
#message_receiver_id option {
@@ -354,4 +370,9 @@ $("#submit_button").click(function(event) {
border-color: var(--rg-success);
box-shadow: 0 0 0 3px rgba(6, 214, 160, 0.1);
}
+
+ /* Debug: Add a colored border to see the element boundaries */
+ #message_receiver_id {
+ border: 2px solid red !important;
+ }