Menu
I'm trying to work on an existing website and I've found a bug, but I'm not sure why it's a bug or how to work around it.
The website basically lists some commercial properties that are for lease in one city. There's a class which grabs the listings from the database and creates an object out of each. In each object is an array of images which are associated with that property.
When the user edits a listing, they get an edit page which has a list of the images, and a "delete" checkbox next to them. The checkboxes all have the same name, so that when they are submitted back to the server, the app gets an array of the images to be deleted.
What's supposed to happen, is that the app has this array of on/off values (where on = delete), and the index of each value in the array corresponds to the index of an image in the listing object -- when one of the values is "on", the filename in the images array corresponding to that "on" value is deleted from the filesystem, and that image is removed from the database.
However, when the form is submitted, the app gets a 0-indexed array of only the checked checkboxes. So if I set three arbitrary images for deletion, the app would get
Array {
[0] => "on",
[1] => "on",
[2] => "on"
}
This obviously doesn't work, the first 3 images in the listing will be deleted regardless of which checkboxes are set.
How can I fix this? I would like to avoid naming each checkbox (delete_1, delete_2, delete_3, etc) as the system is already built to work with all the checkboxes having the same name. Is there a way I can force all of the checkboxes to be submitted with either "on" or "off?"
405
How do you submit a form when a checkbox is checked? If you need to submit a form when a checkbox is checked or when it is unchecked like when you are using a switch, a good way is to create an hidden input. If you try to submit the checkbox argument if the checkbox is unchecked the form will not be submitted at all.
If the checkbox has the required attribute, but is not checked, then ValidityState.valueMissing will be true .
The checked attribute is a boolean attribute. When present, it specifies that an <input> element should be pre-selected (checked) when the page loads. The checked attribute can be used with <input type="checkbox"> and <input type="radio"> . The checked attribute can also be set after the page load, with a JavaScript.
A checkbox HTML element doesn't have a "readonly" property.
There is no way to force, but you could just add a hidden right before checkbox with the same name and needed value:
<input type="hidden" name="delete[42]" value="off" />
<input type="checkbox" name="delete[42]" value="on" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
