Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

BikashKatwal's avatar

checkbox not working

<script>
   $('document').ready(function() {
    $('#isbooking_enabled').click(function (e) {
        alert("checked");
        // this.checked?$('#appointedd_appid').show(1000):$('#appointedd_appid').hide(1000);
    });
    });
</script>

@include( 'admin.partials.form_row', array( 'name'=>"isbooking_enabled", 'label'=>"Enable Booking", 'input' => Form::checkbox('isbooking_enabled', true, $data) ) )
@include( 'admin.partials.form_row', array( 'name'=>"appointedd_appid", 'label'=>"Appointedd AppId" ) )

I have "isbooking_enabled" checkbox which I have to make visible only when checkbox is checked. Can you please review the code and suggest what I am doing wrong>

0 likes
7 replies
Snapey's avatar

post the actual html. I can't decipher that Form:: crap

BikashKatwal's avatar
##details.blade.php
<h3>Hall Details</h3>

@include( 'admin.partials.form_row', array( 'name'=>"name", 'label'=>"Hall Name" ) )
@include( 'admin.partials.form_row', array( 'name'=>"capacity", 'label'=>"Capacity" ) )
@include( 'admin.partials.form_row', array( 'name'=>"email", 'label'=>"Email" ) )
@include( 'admin.partials.form_row', array( 'name'=>"website", 'label'=>"Website" ) )

<div class="row">
    <div class="small-3 columns {{ $errors->has('phone') ? 'error' : '' }}">
        <label for="phone" class="right">Phone</label>
    </div>
    <div class="small-1 columns">
        {{ Form::select('phone_area', Lang::get('geography.area_codes'), (isset($data->phone->area) && $data->phone->area ? $data->phone->area : "")) }}
    </div>
    <div class="small-8 columns {{ $errors->has('phone') ? 'error' : '' }}">
        {{ Form::text('phone', (isset($data->phone->body) && $data->phone->body ? $data->phone->body : ""), array('id'=>'phone')) }}
        {{ $errors->first('phone', '<small>:message</small>') }}
    </div>
</div>

<div class="row">
    <div class="small-3 columns {{ $errors->has('fax') ? 'error' : '' }}">
        <label for="fax" class="right">Fax</label>
    </div>
    <div class="small-1 columns">
        {{ Form::select('fax_area', Lang::get('geography.area_codes'), (isset($data->fax->area) && $data->fax->area ? $data->fax->area : "")) }}
    </div>
    <div class="small-8 columns {{ $errors->has('fax') ? 'error' : '' }}">
        {{ Form::text('fax', (isset($data->fax->body) && $data->fax->body ? $data->fax->body : ""), array('id'=>'fax')) }}
        {{ $errors->first('fax', '<small>:message</small>') }}
    </div>
</div>

<hr/>
@include( 'admin.partials.form_row', array( 'name'=>"location", 'label'=>"Address" ) )
@include( 'admin.partials.form_row', array( 'name'=>"street_number", 'label'=>"Street Number" ) )
@include( 'admin.partials.form_row', array( 'name'=>"route", 'label'=>"Street" ) )
@include( 'admin.partials.form_row', array( 'name'=>"locality", 'label'=>"City" ) )
@include( 'admin.partials.form_row', array( 'name'=>"state", 'label'=>"State", 'input' => Form::select('state', Lang::get('geography.states'), object_get($data, 'state') ) ) )
@include( 'admin.partials.form_row', array( 'name'=>"postcode", 'label'=>"Postcode" ) )
{{ Form::hidden('latitude', object_get($data, 'latitude')) }}
{{ Form::hidden('longitude', object_get($data, 'longitude')) }}

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places&key=AIzaSyAvO7MxTw05aBK7YJzhPvHg3SVfqBJW-Bs"></script>

{{--<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places&key=AIzaSyBD6gUIw3u6iNBQOkGMv6_EYYKBae5Fn88"></script>--}}
<script>
    var placeSearch, map, autocomplete;

    function setPlace(place) {
        var latitude = place.geometry.location.lat(),
            longitude = place.geometry.location.lng();

        $('input[name=latitude]').val(latitude);
        $('input[name=longitude]').val(longitude);

        console.log(place);

        $.each(place.address_components, function (index, value) {
            if ($.inArray("street_number", value.types) >= 0) $('input[name=street_number]').val(value.long_name);
            if ($.inArray("route", value.types) >= 0) $('input[name=route]').val(value.long_name);
            if ($.inArray("locality", value.types) >= 0) $('input[name=locality]').val(value.long_name);
            if ($.inArray("administrative_area_level_1", value.types) >= 0) $('select[name=state]').val(value.short_name);
            if ($.inArray("postal_code", value.types) >= 0) $('input[name=postcode]').val(value.long_name);
        });
    }

    $('document').ready(function () {
        if ($('input[name=location]').length) {
            var bounds = new google.maps.LatLngBounds(
                new google.maps.LatLng(-47.5765257137462, 106.259765625),
                new google.maps.LatLng(-9.6, 179.359375)
            );

            var options = {
                bounds: bounds,
                types: ['geocode'],
                offset: 5,
                componentRestrictions: {country: 'AU'}
            };

            var autocomplete = new google.maps.places.Autocomplete(document.getElementById('location'), options);
            var geocoder = new google.maps.Geocoder();

            google.maps.event.addListener(autocomplete, 'place_changed', function () {
                var place = autocomplete.getPlace();
                setPlace(place);
            });

            $('input[name=location]').blur(function () {
                if (!$('input[name=location]').val()) {
                    var firstResult = $(".pac-container .pac-item:first").text();

                    setTimeout(function () {
                        $('input[name=location]').val(firstResult)
                    }, 50);
                    $(this).val(firstResult);
                    geocoder.geocode({"address": firstResult}, function (results, status) {
                        if (status === google.maps.GeocoderStatus.OK) {
                            setPlace(results[0]);
                        }
                    });
                    return false;
                }
            });

            $("input[name=location]").focusin(function () {
                $(document).keypress(function (e) {
                    if (e.which === 13) {
                        $("input[name=location]").blur();
                        return false;
                    }
                });
            });
        }

        geocoder = new google.maps.Geocoder();
        $('button.submit').click(function (e) {
            e.preventDefault();
            var address = $('input[name=street_number]').val() + " " +
                $('input[name=route]').val() + ", " +
                $('input[name=locality]').val() + ", " +
                $('input[name=state]').val() + " " +
                $('input[name=postcode]').val() + ", Australia";
            geocoder.geocode({'address': address}, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    $('input[name=latitude]').val(results[0].geometry.location.lat());
                    $('input[name=longitude]').val(results[0].geometry.location.lng());
                }
                $('form').trigger('submit');
            });
        });


        $('isbooking_enabled').change(function () {
            alert('checked');
            if (this.checked)
                $('appointedd_appid').fadeIn('slow');
            else
                $('appointedd_appid').fadeOut('slow');

        });


    });
</script>

@if($current_user->hasAccess('Admin'))
    <hr/>
    @include( 'admin.partials.form_row', array( 'name'=>"featured", 'label'=>"Featured", 'input' => Form::checkbox('featured', true, $data) ) )
    @include( 'admin.partials.form_row', array( 'name'=>"isbooking_enabled", 'label'=>"Enable Booking", 'input' => Form::checkbox('isbooking_enabled', true, $data) ) )
    @include( 'admin.partials.form_row', array( 'name'=>"appointedd_appid", 'label'=>"Appointedd AppId" ) )
@endif



##form_row.blade.php  


<div class="row">
    <div class="small-3 columns {{ $errors->has($name) ? 'error' : '' }}">
        <label for="{{ $name }}" class="right">{{ $label }}</label>
    </div>
    <div class="small-9 columns {{ $errors->has($name) ? 'error' : '' }}">
        @if(isset($input) && $input)
            {{ $input }}
        @else
            {{ Form::text($name, (isset($data->{$name}) && $data->{$name} ? $data->{$name} : ""), array('id'=>$name)) }}
        @endif
        {{ $errors->first($name, '<small>:message</small>') }}
    </div>
</div>

BikashKatwal's avatar

Thank you, It worked for me to hide the textbox but I also have to hide 'label'

 @include( 'admin.partials.form_row', array( 'name'=>"appointedd_appid", 'label'=>"Appointedd AppId" ) )

How can I get id/name in this case like I did $('input[name=appointedd_appid]').hide(); to hide the textbox.

Tray2's avatar
Tray2
Best Answer
Level 73

You can wrap both the label and the input in a div and give it a id then in the javascript reference that instead when you show or hide the element.

Please or to participate in this conversation.