Inserting list option checkbox data with different name

How can i insert data in sql table for the following example html code

class Vclass VI

ul id="opt1"
li- All
li- science [] input type="hidden" value="1" class="chk" name="chk_1">
li- maths []input type="hidden" value="1" class="chk" name="chk_3">

How to filter data with checkbox in Vuejs with API

I would like to filter data in table using checkbox and outoput data will be shown based on checked/unchecked, for example when i'm checked "Show All" will ouput all data, and when i'm unchecked then output only will show some data. but when i'm trying to do this, the result showing nothing

here for vue html:

<div class="col-md-8">
  <input type="checkbox" id="checkboxOrder" v-model="checkedValue" value="Onloading Complete" >
  <label for="checkboxOrder">Show All</label>
</div>
<table class="table table-bordered">
  <thead>
    <tr>
      <th>#</th>
      <th>code</th>
      <th>price</th>
      <th>status</th>
      <th>transporter</th>
      <th>driver</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
      <tr v-for="(item, index) in showOrderDetail" :key="index">
        <td ></td>
        <td></td>
        <td></td>
        <td :class="statusBackground(item)">
          <template v-if="item.t_tour">
            <span v-if="!_.isEmpty(item.t_tour.t_tour_detail)"> 
                
            </span>
            <span v-else>Unproccess</span>
          </template>
          <span v-else>Unproccess</span>
        </td>
        <td class="bg-warning"></td>
        <td></td>
        <td><span class="btn btn-primary" @click="showModal(item.t_tour)"><i class="fas fa-search"></i></span></td>
      </tr>
  </tbody>
</table>

and my vue.js :

import axios from "axios";
import accounting from "accounting";
import ShowTourDetail from "~/pages/transaction/order/ShowTourDetail";
export default {
  props: {
    rowData: {
      type: Object,
      required: true
    },
    rowIndex: {
      type: Number
    }
  },
  data() {
    return {
      t_order_detail: {},
      checkedValue:[]
    };
  },
  mounted() {
    this.fetchData();
  },
  computed:{
    showOrderDetail(){
      if(!this.checkedValue)
        return this.t_order_detail
      return this.t_order_detail.filter(o => this.checkedValue.includes(o.t_tour.t_tour_detail[0].status))
    }
  },
  methods: {
    async fetchData() {
      this.t_order_detail = {
        ...(
          await axios.get(`/api/order-details`, {
            params: { t_order_id: this.rowData.id }
          })
        ).data
      };
    }
};

Unwanted space on top and bottom of checkbox

I'm trying to remove unwanted space above and below a checkbox. I'm using Contact Form 7 on a WordPress site, writing in the template's custom CSS field. I've already tried to modify the display, line-height, margin, padding and vertical-align attributes, both of the checkbox and of the span class. This is the current situation:

Obviously I'd like the text and the checkbox to be aligned. Can you help me?

The page is here

And here is the code:

<p>
  <span class="wpcf7-form-control-wrap acceptance-845">
    <span class="wpcf7-form-control wpcf7-acceptance">
      <span class="wpcf7-list-item">
        <label>
          <input type="checkbox" name="acceptance-845" value="1" aria-invalid="false">
          <span class="wpcf7-list-item-label">I agree to the processing of my personal data (GDPR/ Privacy Reg. 2018 EU 2016/79)</span>
        </label>
      </span>
    </span>
  </span>
</p>

Thank you

checkbox react-native on api array

These checkboxes are working returning the values correctly, the problem is that after selecting the first one, I need to click 3 times on the one I want to select to be marked

function onChecked(id,valor){
    const data = adc
    const index = data.findIndex(x => x._id === id)
    data[index].checked = !data[index].checked

    
    setCheck(data[index].checked)

    //alert(valor)
}
...
<TouchableOpacity key={a._id} onPress={() => {this.onChecked(a._id)}} style=>
                                        <CheckBox value={a.checked} onValueChange={() => {onChecked(a._id,a.valorA)}}/>
                                    </TouchableOpacity>

the rest works normally only when checking this problem

Checkbox to hide columns in Google Charts

I have a chart I am working on HERE that I am trying to use checkboxes to selectively show data columns. I've used this code:

$('#series').find(':checkbox').change(function () {
    var cols = [0];
    $('#series').find(':checkbox:checked').each(function () {
        console.log(this);
        cols.push(parseInt($(this).attr('value')));
    });
    view.setColumns(cols);
    dashboard.draw(view, {strictFirstColumnType: true})

});

But its not working in the previously linked fiddle and I can't figure out what I'm doing wrong. I'm sure its probably something silly I've missed. Any help would be greatly appreciated!

Checkbox using xpath not accessible

I am trying to access a checkbox titled "Cooperative Agreement (968)" on a website (grants.gov). The URL is this.

It looks like there are two HTML elements on the HTML page. The second HTML is contained in #document.

I don't know what #document means, but I think it is where the issue is, because, I can get anything outside of #document, but nothing inside of it.

This is my current code:

driver.maximize_window()
driver.implicitly_wait(20)
driver.get('https://www.grants.gov/web/grants/search-grants.html')

time.sleep(3)
print('go')
cooperative_agreement = driver.find_element_by_xpath(
'/html/body/table[1]/tbody/tr/td[1]/div/div[1]/div/div/table/tbody/tr[2]/td/input')

print(cooperative_agreement.text)

I am using dev tools on chrome to get the XPath for everything. If you go to the URL and go to dev tools on chrome and try to get the XPath for the checkbox titled "Cooperative Agreement (968)" you will see the issue I am having.

This is my first question on StackOverflow. Please let me know if you need more info on something! Thank you all for your help!

CheckBox React Native com api rest checando todos ao inves de selecionado [closed]

Estou com problema na seleçao de um array com checkbox, ele retorna o index certo, marca o selecionado, só que seleciona todos e o restante selecionado fica com o value={false}

o código é esse

function onChecked(id){
    const data = adc
    const index = data.findIndex(x => x._id === id)
    data[index].checked = !data[index].checked
    
    setCheck(data[index].checked)

    alert(index)
}
...

<TouchableOpacity key={a._id} onPress={() => {this.onChecked(a._id)}} style=>
     <CheckBox value={check} onValueChange={() => {onChecked(a._id)}}/>
</TouchableOpacity>

os valores retornam normal, o problema só é que ao inves de marcar só o selecionado ele marca todos, mas os valores continuam como false nos que não foram marcados