jeudi 2 décembre 2021

checkboxes wont align to the right

Ive got a custom CheckBox widget where it returns a label and a checkbox field,

@override
Widget build(BuildContext context) {
 return Padding(
  padding: const EdgeInsets.all(16.0),
  child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: [
      Text(widget.label, style: Theme.of(context).textTheme.headline4),
      Checkbox(
        activeColor: LightSeaGreen,
        checkColor: White,
        value: _checkbox,
        onChanged: (value) {
          setState(() {
            _checkbox = !_checkbox;
          });
          widget.onChanged(value);
        },
      ),
    ],
  ),
);

}

So right now,It looks like this,

enter image description here

what I want is for the checkboxes to align to the right like this

enter image description here

Ive tried the Align fuction,Spacer,MainAxisAlignment.spaceBetween but nothing works

please help me




Storing Drupal Form Checkboxes in a Database

Working on a form that will have 25 checkboxes in a checkboxes set. I need to store the checked keys in a database, and be able to restore the Edit form to it's checked state. I do have a solution, but it just seems odd. This is my first effort at a form and am looking for a best practice on how to solve this problem.

A prototype of my checkboxes set:


$form['medical'] = [
      '#type' => 'checkboxes',
      '#title' => $this->t('Medical Conditions you currently or have previously suffered.'),
      '#options' => [
        'Asthma' => $this->t('Asthma'),
        'Anxiety' => $this->t('Anxiety'),
        'Diabetes' => $this->t('Diabetes'),
        'Schizophrenia' => $this->t('Schizophrenia'),
        'Low Blood Sugar' => $this->t('Low Blood Sugar'),
        'High Blood Pressure' => $this->t('High Blood Pressure'),
        'Stroke' => $this->t('Stroke'),
        'HIV' => $this->t('HIV'),
        'IBS' => $this->t('IBS'),
      ],
      '#default_value' => $savedArray,

I get the checked keys using

$medical = $form_state->getValue('medical');
$chked = implode(',', $medical);

This gives me a comma separated string, something like something like 'Asthma,Diabetes,Low Blood Sugar,Stroke,IBS,0,0,0,0'.

I get the portion before the first ',0', the first unchecked checkbox and save that to the database.

$chked = substr($chked, 0, strpos($val, ',0'));

So the database is storing a comma separated list of Key values that represent the checked boxes.

To restore the state of the form, I get that string value from the database and explode it into an array, and use that array as the #default_value of the checkbox set.

 $savedArray = explode(',', $chked)
 #default_value => $savedArray

This all works, but it just seems pretty weird. I am new to Drupal and php. Is this an reasonable solution? Is there some built in functionality that manages this? This feels a lot like Jr programmer hackery to me!




Click in checkbox gives me undefined

I am new in php and I have problem whith checkbox. Infact when I check one of the checkboxs in table it should gives me my data but unfortunately it gives me undefined.

here is my code befor click in checkbox enter image description here

and after click for exemple in the checkbox in the first line enter image description here

and this is my code :

$(document).on('click', '.check_box', function(){
    var html = '';
    if(this.checked)
    {
        html = '<td><input type="checkbox" id="'+$(this).attr('id')+'" data-Projet="'+$(this).data('Libelle_Projet')+'" data-Num-Produit="'+$(this).data('Num_Produit')+'" data-Libelle-Produit="'+$(this).data('Libelle_Produit')+'" data-Titre-Foncier-Produit="'+$(this).data('Titre_Foncier_Produit')+'" data-Superficie-Produit="'+$(this).data('Superficie_Produit')+'" data-Date-Reception-Administratif-Temp="'+$(this).data('Date_Reception_Administratif_Temp')+'" data-Date-Contrat-Temp="'+$(this).data('Date_Contrat_Temp')+'" class="check_box" checked /></td>';
        html += '<td>'+$(this).data("Libelle_Projet")+'</td>';
        html += '<td>'+$(this).data("Num_Produit")+'</td>';
        html += '<td>'+$(this).data("Libelle_Produit")+'</td>';
        html += '<td>'+$(this).data("Titre_Foncier_Produit")+'</td>';
        html += '<td>'+$(this).data("Superficie_Produit")+'</td>';
        html += '<td><input type="date" name="Date_Reception_Administratif_Temp[]" class="form-control" value="'+$(this).data("Date_Reception_Administratif_Temp")+'" /></td>';
        html += '<td><input type="date" name="Date_Contrat_Temp[]" class="form-control" value="'+$(this).data("Date_Contrat_Temp")+'" /><input type="hidden" name="hidden_id[]" value="'+$(this).attr('id')+'" /></td>';
    }
    else
    {
        html = '<td><input type="checkbox" id="'+$(this).attr('id')+'" data-Projet="'+$(this).data('Libelle_Projet')+'" data-Num-Produit="'+$(this).data('Num_Produit')+'" data-Libelle-Produit="'+$(this).data('Libelle_Produit')+'" data-Titre-Foncier-Produit="'+$(this).data('Titre_Foncier_Produit')+'" data-Superficie-Produit="'+$(this).data('Superficie_Produit')+'" data-Date-Reception-Administratif-Temp="'+$(this).data('Date_Reception_Administratif_Temp')+'" data-Date-Contrat-Temp="'+$(this).data('Date_Contrat_Temp')+'" class="check_box" /></td>';
        html += '<td>'+$(this).data('Libelle_Projet')+'</td>';
        html += '<td>'+$(this).data('Num_Produit')+'</td>';
        html += '<td>'+$(this).data('Libelle_Produit')+'</td>';
        html += '<td>'+$(this).data('Titre_Foncier_Produit')+'</td>';
        html += '<td>'+$(this).data('Superficie_Produit')+'</td>';
        html += '<td>'+$(this).data('Date_Reception_Administratif_Temp')+'</td>';    
        html += '<td>'+$(this).data('Date_Contrat_Temp')+'</td>';         
    }
    $(this).closest('tr').html(html);
});

my table code :

<form method="post" id="update_form">
        <div id="divShow" class="table-responsive">
          <table class="table table-bordered table-striped">
            <thead>
              <th width="2%"></th>
              <th width="15%">Projet</th>
              <th width="10%">Numéro Produit</th>
              <th width="15%">Dénomination</th>
              <th width="10%">Titre Foncier</th>
              <th width="5%">Superficie</th>
              <th width="15%">Date Réception Admin</th>
              <th width="15%">Date Contrat</th>
            </thead>
            <tbody></tbody>
          </table>
        </div>
        
        <br />

        <div align="left">
          <input type="submit" name="multiple_update" id="multiple_update" class="btn btn-info" value="Valider"  style="display: none;" />
        </div>

        <br />

        <div id="msgSelectProduit" style="display: none;"></div>
        <div id="msgSelectDateContrat" style="display: none;"></div>
      </form>

$.ajax({
        url:"selectTOUT.php",
        method:"POST",
        dataType:"json",
        success:function(data)
        {
            var html = '';
            for(var count = 0; count < data.length; count++)
            {
                html += '<tr>';
                html += '<td><input type="checkbox" id="'+data[count].id+'" data-Projet="'+data[count].Libelle_Projet+'" data-Num-Produit="'+data[count].Num_Produit+'" data-Libelle-Produit="'+data[count].Libelle_Produit+'" data-Titre-Foncier-Produit="'+data[count].Titre_Foncier_Produit+'" data-Superficie-Produit="'+data[count].Superficie_Produit+'" data-Date-Reception-Administratif-Temp="'+data[count].Date_Reception_Administratif_Temp+'" data-Date-Contrat-Temp="'+data[count].Date_Contrat_Temp+'" class="check_box"/></td>';
                html += '<td>'+data[count].Libelle_Projet+'</td>';
                html += '<td>'+data[count].Num_Produit+'</td>';
                html += '<td>'+data[count].Libelle_Produit+'</td>';
                html += '<td>'+data[count].Titre_Foncier_Produit+'</td>';
                html += '<td>'+data[count].Superficie_Produit+'</td>';
                html += '<td>'+data[count].Date_Reception_Administratif_Temp+'</td>';
                html += '<td>'+data[count].Date_Contrat_Temp+'</td></tr>';
            }
            $('tbody').html(html);
        }
    });



Checkbox disabling an input

I want to make it so when the user clicks the checkbox , the player Two input goes disabled. My problem is that the input remains disabled in both cases, doesn't matter if checkbox is checked or not.

const Initialization = (function() {
  p1 = '';
  p2 = '';

  const playerOne = document.querySelector('#player1')
  const playerTwo = document.querySelector('#player2')
  const checkAI = document.querySelector('#computer')
  const startButton = document.querySelector('#start')

  startButton.addEventListener('click', () => {
    p1 = Player(playerOne.value)
    p2 = Player(playerTwo.value)
  })

  if (checkAI.checked = true) {
    playerTwo.disabled = true;
  } else {
    playerTwo.disabled = false;
  }

  return {
    p1,
    p2,

  }
})();
<label>Computer: <input type="checkbox" id="computer"></label><br/>
<input type="text" id="player1"><br/>
<input type="text" id="player2"><br/>
<input type="button" id="start" value="Start" />



Record identification in Gridview checkbox onclick event

I have a checkboxs column in asp:gridview. How can i identify which record i clicked on in a JS onclick event of the checkbox? (how can i know which row i clicked on?).

the grid and the checkbox column:

<asp:GridView ID="gvBakashot" Style="margin-top: 0%; table-layout: fixed; margin-right: 3%;" runat="server" HeaderStyle-BorderStyle="none" CssClass="GridClass box_border"
Width="94%" AutoGenerateColumns="false" CellPadding="2" RowStyle-CssClass="row1" EnableEventValidation="true" ClientIDMode="Static" Visible="true">
<Columns>
<asp:TemplateField HeaderText=" " ItemStyle-BorderWidth="1" HeaderStyle-Width="3%" ItemStyle-Width="3%" HeaderStyle-CssClass="box_border table_title" ItemStyle-CssClass="box_border ">
<ItemTemplate>               
<input type="checkbox" id="chkHaktzaa" onclick="chkHaktzaa_click()" />
</ItemTemplate>
</asp:TemplateField>

Thank you for the help.




mercredi 1 décembre 2021

Tick checkbox for timestamp in google sheet

I'm creating a request/problem form in google form and responses are viewable and editable in google sheet. In the google sheet, I would like to have a timestamp checkbox for myself to whenever I'm done with the problem.

It is look like this

...

Also, This is the function I put in column K(the timestamp) and the column J is the checkbox column.

=ArrayFormula(IF(ROW(K:K)=1,"DATE",IF(ISBLANK(K:K),"DATE",IF(J:J = true,IF(K:K<>"",K:K,NOW()),""))))

The column K function in sheet

The function for column K work as intended and I just need to manually add the checkbox in column J which is fine enough.

But, the problem is happen when a new form is submitted and update the google sheet. Error message appear " "array result was not expanded because it would overwrite data in K81."

The problem

My objective as I mention above is to have a timestamp checkbox for each problem submitted by google form. Is there are any way to work around this?




Create Checkbox on table with JavaScript

I'm building an app and on this app I have to add items on a table, and I would like to add a checkbox on each line that I add, but I'm having troubles on trying to do that. Would you know how to add a checkbox on each line that I add on the table?

below is the code where I add line per line to my table

function addDataToTbody(nl, data) { // nl -> NodeList, data -> array with objects
  data.forEach((d, i) => {
    var tr = nl.insertRow(i);
    Object.keys(d).forEach((k, j) => { // Keys from object represent th.innerHTML
      var cell = tr.insertCell(j);
      cell.innerHTML = d[k]; // Assign object values to cells   
    });
    nl.appendChild(tr);
  })
}

I tried to do something like

tr.append("<td> <div class='form-control'>\
    <input type='checkbox' /> \
    <label for='chk'/>select</div>\
</td>");

But that just adds a text to my table and not the checkbox itself.

<div id="table-wrapper" class="table-responsive">
      <table class="table table-hover" id="PartData">
           <thead>
               <tr>
                   <th scope="col">#</th>
                   <th scope="col">FUNÇÃO</th>
                   <th scope="col">DESCRIÇÃO</th>
                   <th scope="col">QUANTIDADE</th>
                   <th scope="col">FABRICANTE DO PAINEL</th>
                   <th scope="col">PEÇA</th>
                   <th scope="col">REVISÃO</th>
               </tr>
           </thead>
           <tbody>
               <tr>
               </tr>
           </tbody>
       </table>
   </div>

above is my HTML code.

Thanks in advance!