Kelvin Halim Kelvin Halim - 1 year ago 90
jQuery Question

jquery show and hide dropdown, if checkbox is checked based on value of database a

i am trying to make a simple jquery, with 1 checkbox, and 4 option in dropdown menu.
with this html code :

<div class="checkbox checkbox-info checkbox-inline">
<input type="checkbox" name="box" id="busy" <?=($restaurant_info["restaurant_busy"] != 0)? "checked":""?> / >
<label for="busy">Busy</label>
<div class="row">
<div class="col-md-6">
<select id="dropdownHolder" name="restaurant_busy">
<option value="0" <?php if ($restaurant_info["restaurant_busy"] == '0') echo 'selected = "selected"'; ?>>No busy</option>
<option value="1" <?php if ($restaurant_info["restaurant_busy"] == '1') echo 'selected = "selected"'; ?>>30 minute</option>
<option value="2" <?php if ($restaurant_info["restaurant_busy"] == '2') echo 'selected = "selected"'; ?>>60 minute</option>
<option value="3" <?php if ($restaurant_info["restaurant_busy"] == '3') echo 'selected = "selected"'; ?>>90 minute</option>
<option value="4" <?php if ($restaurant_info["restaurant_busy"] == '4') echo 'selected = "selected"'; ?>>120 minute</option>

and this my jquery that i have tried to do, but i cant get it

$(function() {
var selected = $('#dropdownHolder option:selected');
$('#busy').change(function () {
if ($('#busy').is(':checked')) {
$('#dropdownHolder ').show();
}else if (selected.val() !== "0") {
$('#busy').prop('checked', true);
$('#dropdownHolder ').show();
$('#busy').prop('checked', false);
$('#dropdownHolder ').hide();

this my submit form

$("#edit_restaurant").attr('action', '/VENDOR/Vendor/change_restaurant/');

i want if, my database the value of restaurant_busy is 0 the checkbox will be not checked, and the dropdown menu will not be showed. i am really new in jquery please help me

than i am trying to make, if the checkbox is not checked the value of the checkbox is 0 and send the value to the database, but i don't know how to make it, so i put the value of "0" in the dropdown menu, can u help me on this too?

this is my controller for update data

function change_restaurant(){

if(!isset($_COOKIE["vendor_login"])){ redirect("/VENDOR",'refresh'); }
setcookie('vendor_login', '', time() - 3600, '/');
if ($this->input->cookie('vendor_login') != null) {
$admin_name = $this->input->cookie('vendor_login');

setcookie('vendor_login', $admin_name, time() + 28800, '/');
$msg = $this->input->cookie('vendor_token');
setcookie('vendor_token', $msg, time() + 28800, '/');

if($vendorname = $_COOKIE["vendor_login"]) {

$check_login = $this->Vendor_m->m_get_user_by_vendor($vendorname);
$restaurant_id = $check_login["restaurant_id"];

if ($_POST == NULL){
$data = array(
"restaurant_busy" =>$this->input->post("restaurant_busy"),
"restaurant_active" =>$this->input->post("restaurant_active"),
"delivery_active" =>$this->input->post("delivery_active"),
"takeaway_active" =>$this->input->post("takeaway_active"),
"voucher_active" =>$this->input->post("voucher_active"),


thank you very much, sorry if my request is so many, u can choose what u want trying to answer

Answer Source

Lemme know how this works for ya ;)

$(function() {
    var selected = $('#dropdownHolder option:selected'), // Seems to be unused
        $busy = $('#busy'), // Always cache your queries
        $dropdown = $('#dropdownHolder'); // Caching queries

    $dropdown.hide(); // Hidden by default initially

    $busy.change(function () {
        if ($busy.prop('checked')) {
        } else{
            $busy.prop('checked', false);

    $busy.change(); // This sets initial state
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download