mardi 20 avril 2021

Hide an accordion based on value from shortcode (value from database)

Im trying to hide an accordion based on the value of a check-box, but im lost since i dont have any id's or such to identify the values by.

So i have the code below and i want to hide elementor-tab-title-2471 if the value of the checkbox is "Ja" (Ja, is Yes in danish).

    <div id="elementor-tab-title-2471" class="elementor-tab-title eael-accordion-header" 
     tabindex="2471" data-tab="1" role="tab" aria-controls="elementor-tab-content-2471"><i class="fas 
     fa-hot-tub fa-accordion-icon"></i><span class="eael-accordion-tab-title">Spa</span><i class="fas 
     fa-arrow-down fa-toggle"></i></div><div id="elementor-tab-content-2471" class="eael-accordion- 
     content clearfix" data-tab="1" role="tabpanel" aria-labelledby="elementor-tab-title-2471"><p><p> 
     <!-- template: wp-content/participants-database-templates/pdb-single-single-value_custom.php -->
    
    <span class="pdb-value spa "><span  class="checkbox">Ja</span></span>

Thanks in advance :)

Best Regards Sandra




Use checkbox with label to toggle dropdown menu

I'm trying to use a checkbox input with a label to toggle the visibility (display) of a dropdown navigation menu. When the menu is shown, I need to move the label to the right in order to be able to still click it since it would otherwise be behind the menu, making it impossible to close.

<div class="topnav">
  <label for="dropdown-toggle" id="dropdown-toggle-label"><i class="fas fa-bars"></i></label>
  <input type="checkbox" id="dropdown-toggle">
  <ul class="dropdown">
    ...
  </ul>
</div>

However, with the way I have set it up, I'm trying to use the + selector to

  1. show the .dropdown menu when the checkbox is checked
  2. move the label out of the way to have it clickable

This is not possible of course, since not both can directly follow the input.

.topnav .dropdown {
  display: none;
  position: absolute;

  z-index: 10;
  width: 33%;
}

#dropdown-toggle-label {
  display: block;
}

#dropdown-toggle-label:hover {
  cursor: pointer;
}

/* move the checkbox out of the way of the menu */
/* this should be done with the label instead */
#dropdown-toggle:checked {
  margin-left: 36%;
}

/* display the menu when the checkbox is checked */
#dropdown-toggle:checked + .dropdown{
  display: block;
}

If at all possible, I'd like to solve this issue without using JavaScript. Should there be any important info missing let me know and I'll provide it.




WPF two-way binding does not work for checkboxes inside a combobox

I've tried lots of solutions online but I still get this issue. I have a combobox whose item source is a list of customized class. Each element in the source is displayed as a checkbox in the combobox. Now I have a button whose "Click" function is to uncheck all the checkboxes.

The customized class:

    public class LinkObject: INotifyPropertyChanged
    {
        public int index { set; get; }
        public string LO_Name { set; get; }
        private bool _checkStatus { set; get; }

        public event PropertyChangedEventHandler PropertyChanged;

        public void Notify(string propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        public bool checkStatus
        {
            get { return _checkStatus; }
            set
            {
                _checkStatus = value;
                Notify("IsChecked");
            }
        }
    }

The XAML:

<ComboBox Name="cbx1" Grid.ColumnSpan="2" HorizontalAlignment="Left" Margin="126,82,0,0" VerticalAlignment="Top" Width="50" Height="20" IsEditable="True" IsTextSearchEnabled="True" StaysOpenOnEdit="True" TextBoxBase.TextChanged="cbx1_TextChanged">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <CheckBox Name="cbk1" IsChecked="{Binding checkStatus, Mode=TwoWay}" CommandParameter="{Binding index}" Checked="chk_Checked"  Unchecked="chk_Unchecked">
                <CheckBox.Content>
                    <TextBlock Text="{Binding LO_Name}"/>
                </CheckBox.Content>
            </CheckBox>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

Main function by initialization:

cbx1.ItemsSource = LinkObjectsList_cbx1;

LinkObjectsList_cbx1 is a List<LinkObject>.

The button has a name "clearAllTopView", the click function is:

private void clearAllTopViewBtn_Click(object sender, RoutedEventArgs e)
{
    LinkObjectsList_cbx1.Where(l => l.checkStatus == true).ToList().ForEach(lo => lo.checkStatus = false);
}

But when I click the button, nothing happens. Could someone give me a hint or advice? Thank you.




How to toggle all checkboxes in all selected rows when one checkbox clicked in DataGridView

It took me a lot of time to find solution how to toggle all checkboxes of a DataGridViewCheckBoxColumn in all selected rows in DataGridView when one of them clicked.

I would like to share the solution with others (C++/CLI):

DataGridViewSelectedRowCollection ^previousDataGridView_SelectedRowCollection;

System::Void SetRedraw(Control ^control, Boolean value)
{
    SendMessage(static_cast<HWND>(control->Handle.ToPointer()), WM_SETREDRAW, value, 0);
}

System::Void SuspendDrawing(Control ^control)
{
    SetRedraw(control, false);
}

System::Void ResumeDrawing(Control ^control, Boolean redraw = true)
{
    SetRedraw(control, true);
    if (redraw)
        control->Refresh();
}

private: System::Void dataGridView_CellMouseDown(System::Object^ sender, System::Windows::Forms::DataGridViewCellMouseEventArgs^ e)
{
    if (e->RowIndex < 0 || e->ColumnIndex < 0)
        return;
    previousDataGridView_SelectedRowCollection =
        e->ColumnIndex == ColumnCheck->Index &&
        dataGridView->SelectedRows->Count > 1 &&
        dataGridView[e->ColumnIndex, e->RowIndex]->GetContentBounds(e->RowIndex).Contains(e->X, e->Y)
    ?
        dataGridView->SelectedRows
    :
        nullptr;
}

private: System::Void dataGridView_CellContentClick(System::Object^ sender, System::Windows::Forms::DataGridViewCellEventArgs^ e)
{
    if (e->RowIndex < 0
        || e->ColumnIndex < 0
        || e->ColumnIndex != ColumnCheck->Index)
        return;
    if (dataGridView->CurrentRow->Selected && (previousDataGridView_SelectedRowCollection || (previousDataGridView_SelectedRowCollection = dataGridView->SelectedRows)->Count > 1) && previousDataGridView_SelectedRowCollection->Contains(dataGridView->CurrentRow))
    {
        SuspendDrawing(dataGridView);
        try
        {
            DataGridViewCell ^currentCell = dataGridView->CurrentCell;
            Boolean isSelected;
            if (currentCell->ReadOnly)
                currentCell = nullptr;
            else
            {
                dataGridView->EndEdit();
                isSelected = safe_cast<Boolean>(currentCell->Value);
            }
            for each (DataGridViewRow ^dataGridViewRow in previousDataGridView_SelectedRowCollection)
            {
                DataGridViewCell ^dataGridViewCell = dataGridViewRow->Cells[e->ColumnIndex];
                if (currentCell && !dataGridViewCell->ReadOnly)
                    dataGridViewCell->Value = isSelected;
                dataGridViewCell->Selected = true;
            }
        }
        finally
        {
            ResumeDrawing(dataGridView);
        }
    }
    previousDataGridView_SelectedRowCollection = nullptr;
}

Here is a similar request

I hope this helps someone.




Create a custom button in Flutter

I would like to make a custom checkbox button with rounded corners.

Because I wasn't able to do it with a CheckBox widget, I simply created a container with rounded corners (and some styling depending on whether the "value" is true) and wrapped it in InkWell.

  • InkWell
  • Container

The problem is that the checkbox (container) is quite small and you have to tap precisely on the Container. When you use CheckBox or any other button, there is some tolerance (meaning that you can click slightly off the button). How can I achieve this with InkWell?

The only idea I have is to wrap the Container in Padding first:

  • InkWell
  • Padding
  • Container

Is this the only solution, or is there another way of making a "button" with InkWell, where the onTap function will execute even if you don't touch the button precisely?




How to test with Jasmine a checkbox that shows an html element

I'm pretty newbie on Angular test, and I think I have a stupid question, but despite a lot of tutorials and guides I can't find out a valid solution.

I have a checkbox that when it's checked it should show a div, and I want to test it with Jasmine. This is my HTML:

<div>
  Check this! <input #cb type="checkbox" (change)="1" id="checkboxToTest"/>

  <div id="divRevealed" *ngIf="cb.checked">Hello!</div>

</div>

And this is the code in spec file:

  it('should test checkbox', () => {
    const dElement = fixture.debugElement;
    const nElement = dElement.nativeElement;
    const checkBoxElement = nElement.querySelector('#checkboxToTest');
    const box = nElement.querySelector('#divRevealed');

    checkBoxElement.click();

    expect(checkBoxElement.checked);

    fixture.detectChanges();

    expect(box).toBeTruthy();
  });

Obviously the test passes without any problem if I remove the *ngIf statement in HTML...

But why it's not working?

Thanks for any help!




Get IDs of checkbox in jQuery and parse in PHP

We have a PHP page where we have multiple lines like this :

<tr><td><input type="checkbox" class="select_invoice" id="1"></td><td><span class="label label-info">TEST 1</span></td></tr>
<tr><td><input type="checkbox" class="select_invoice" id="2"></td><td><span class="label label-info">TEST2</span></td></tr>
<tr><td><input type="checkbox" class="select_invoice" id="3"></td><td><span class="label label-info">TEST 3</span></td></tr>
<tr><td><input type="checkbox" class="select_invoice" id="4"></td><td><span class="label label-info">TEST 4</span></td></tr>

We get the id via this jQuery function when we check one / multiple checkbox (#selected_download is a href button we show / hide if we have selected checkbox) :

$("#selected_download").hide();
$(".select_invoice").click(function(clicked_id) {
    if($('.select_invoice').is(":checked")) {
        $("#selected_download").show();
        var table_id = $('input[type=checkbox]:checked').map(function() {
        return this.id;
        }).get();
        console.log(table_id);
    } else {
        $("#selected_download").hide();
    }
});

The variable 'table_id' is an array of all IDs checked

How could we pass them to PHP ? We don't have any $_POST or form to send the array through AJAX.

Thanks and waiting you'r reply :)