Gurgy
Gurgy

Reputation: 95

Make checkbox return false when unchecked

I have a form looking like:

<form>
    <input type"checkbox" name="checked[(unique_id)]">
    <input type"checkbox" name="checked[(unique_id)]">
    <input type"checkbox" name="checked[(unique_id)]">
    <input type"checkbox" name="checked[(unique_id)]">
</form>

The number of checkboxes will variate from time to time so when processing this data with PHP I have to loop the _POST['checked'] array.

My problem is that I want to take actions both when a checkbox is checked and when it's not. But only the the checked checkboxes will be added to the _POST['checked'] array.

Upvotes: 7

Views: 15502

Answers (6)

Bryan Irvin
Bryan Irvin

Reputation: 1

this worked for me using REACT

<input type="checkbox" name="check" value="true" onChange={changeCheck}/>

then use this function

let checked = useRef(false)

const changeCheck = (e) => {
  checked.current = checked.current === (e.target.value === 'true') ? false : true
  setData(prevState => {
    const state = {...prevState}
    state.checked = checked.current
    return state
  }
}

This works because the first user click in the handler function will not evaluate to true setting the local let to true when the checkbox is put in a true state. On the user's next click, the local value is equal to the box's true state (because the box never undoes true) setting the local to false, and back to true on the next click and so on.

Upvotes: 0

Ayat UR Rehman
Ayat UR Rehman

Reputation: 1

This is best approach according to my experience

<input type="hidden" name="check" value="false">
<input type="checkbox" name="check" value="true">

Upvotes: 0

Armin Ghasemi
Armin Ghasemi

Reputation: 381

Another Solution is server-side solution that I think is too fast and easy.

client side: Just use fresh HTML :

<input type="checkbox" name="checked1" value="value_checked" ... />

server side:

make global function like this:

function getVal(&$var, $default = '') {
    if (!isset($var) || empty($var) || is_null($var))
        $var = $default;
    return $var;
}

then use where you want to read some value that you don't know is set or not. like this:

$checked_value = getVal($_POST["checked1"],false);

or

$checked_value = getVal($_POST["checked1"],"value_not_checked");

I hope useful to another one.

Upvotes: 0

Robert
Robert

Reputation: 2824

<form>
    <input type="checkbox" key="1"/>
    <input type="hidden" name="checked[1]" value="false">
    <input type="checkbox" key="2"/>
    <input type="hidden" name="checked[2]" value="false">
    <input type="checkbox" key="3"/>
    <input type="hidden" name="checked[3]" value="false">
    <input type="checkbox" key="4"/>
    <input type="hidden" name="checked[4]" value="false">
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
    $(document).ready(function () {
        $('[key]').change(function () {
            var key = $(this).attr('key');
            $($('[name="checked[' + key + ']"]')).val($(this).is(':checked') ? 'true' : 'false');
        });
    });
</script>

here is what i'm doing

i'm using two inputs one is checkbox without name so it won't be sent to php , the other is hidden won't be shown to the user but it is what will be sent to php

then with jquery when the user check the box jquery change the value of the hidden input to true and when uncheck it change the value to false

so the value will always be send to the php with value true or false as string

you can change the value you want to send to php by changing this .is(':checked')?'true':'false') to something like that .is(':checked')?1:0) to send 1 and 0 instead of true and false

another solution is rybo111 solution

<input type="hidden" name="check" value="false">
<input type="checkbox" name="check" value="true">

it will send the two options but if the checkbox is checked it will override the first option

but it is not reliable 100% and it will send more data to the server

read more about that in POSTing Form Fields with same Name Attribute

so if you want to use simple solution without js use the "html only" if you want 100% reliable solution use the "js"

Upvotes: 4

rybo111
rybo111

Reputation: 12588

Here's a technique I've seen before:

<input type="hidden" name="check" value="false">
<input type="checkbox" name="check" value="true">

The reason this works is because when values with the same name are sent more than once, only the last value is accepted.

In my opinion, a better way is to simply use isset($_POST['...']) or in_array($_POST['...']).

Upvotes: 4

Pancake_M0nster
Pancake_M0nster

Reputation: 265

Add value="true" to each checkbox input element. And change your PHP code to :

$checked_arr = [];
foreach($_POST["checked"] as $checked){
    if($checked == "true"){
        // do what you want to do 
    }
}

Upvotes: 0

Related Questions