مشکل در نمایش یا عدم نمایش المنت ها در جی کوئری

2 ماه پیش
توسط سعید مطرح شد
سعید ( 12240 تجربه )
2 ماه پیش

با سلام
بنده با مشکلی روبرو شده ام. یک فرم دارم که میخام از طریق jquery یک سری المنت div رو با توجه مقدار select تغییر بدم
وقتی از select۲ استفاده میکنم کدهای jquery کار نمیکنه. از لاراول میکس استفاده کردم. ممنون میشم راهنمایی کنید

کد html

<form method="post" action="{{route('employees.soldiering.store' , [$employee])}}">
                                @csrf
                                <div class="row">
                                    <div class="col-sm-۶">
                                        <label class="text-muted">وضعیت نظام وظیفه</label>
                                        <select class="form-control select" id="status" name="status">
                                            @foreach(config('global.soldiering.status') as $value)
                                                <option value="{{$value}}">{{$value}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-sm-۶ form-card-id">
                                        <label class="text-muted">شماره کارت نظام وظیفه</label>
                                        <input type="text" class="form-control" id="card_id" name="card_id" placeholder="لطفا شماره کارت نظام وظیفه را وارد نمایید." autocomplete="off">
                                    </div>
                                </div>
                                <div class="row mt-۳">
                                    <div class="col-sm-۶ form-order">
                                        <label class="text-muted">رسته</label>
                                        <input type="text" class="form-control" id="order" name="order" placeholder="لطفا رسته نظام وظیفه را وارد نمایید." autocomplete="off">
                                    </div>
                                    <div class="col-sm-۶ form-card-at">
                                        <label class="text-muted">تاریخ صدور کارت معافیت</label>
                                        <input type="hidden" id="card_at" name="card_at" value="۰">
                                        <input type="text" class="form-control" id="soldiering_card_at" name="card_at" placeholder="لطفا تاریخ صدور کارت معافیت را وارد نمایید." autocomplete="off">
                                    </div>
                                </div>
                                <div class="row mt-۳">
                                    <div class="col-sm-۶ form-start-at">
                                        <label class="text-muted">تاریخ شروع خدمت</label>
                                        <input type="hidden" id="start_at" name="start_at" value="۰">
                                        <input class="form-control date-enter" type="text" id="soldiering_start_at" name="start_at" placeholder="لطفا تاریخ شروع خدمت را وارد نمایید." autocomplete="off">
                                    </div>
                                    <div class="col-sm-۶ form-end-at">
                                        <label class="text-muted">تاریخ پایان خدمت</label>
                                        <input type="hidden" id="end_at" name="end_at" value="۰">
                                        <input class="form-control date-enter" type="text" id="soldiering_end_at" name="end_at" placeholder="لطفا تاریخ پایان خدمت را وارد نمایید." autocomplete="off">
                                    </div>
                                </div>
                                <div class="row mt-۳">
                                    <div class="col-sm-۶ form-eyes-color">
                                        <label class="text-muted">رنگ چشم</label>
                                        <select class="form-control select" id="eyes_color" name="eyes_color">
                                            @foreach(config('global.soldiering.eyes-color') as $value)
                                                <option value="{{$value}}">{{$value}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-sm-۶ form-hair-color">
                                        <label class="text-muted">رنگ مو</label>
                                        <select class="form-control select" id="hair_color" name="hair_color">
                                            @foreach(config('global.soldiering.hair-color') as $value)
                                                <option value="{{$value}}">{{$value}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="row mt-۳">
                                    <div class="col-md-۱۲ form-group mb-۰ form-description">
                                        <label class="text-muted">توضیحات</label>
                                        <textarea class="form-control-custom" id="description" name="description" placeholder="لطفا توضیحات لازم را وارد نمایید."></textarea>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-۱۲">
                                        <div class="submit-section text-center btn-add">
                                            <button type="submit" class="btn btn-theme text-white ctm-border-radius button-۱ mt-۳">ایجاد</button>
                                        </div>
                                    </div>
                                </div>
                            </form>

کد جی کوئری

$('#status').on('change',function() {
            if(this.value == 'خدمت نکرده')
            {
                $('.form-card-id,.form-order,.form-start-at,.form-card-at').hide();
                $('.form-eyes-color,.form-hair-color,.form-description').show();
            }
            else if (this.value=='معافیت دائم')
            {
                $('.form-order,.form-start-at,.form-end-at,.form-card-id').hide();
                $('.form-card-at,.form-eyes-color,.form-hair-color,.form-description').show();
            }
            else if (this.value=='معافیت پزشکی')
            {
                $('.form-order,.form-start-at,.form-end-at,.form-card-id').hide();
                $('.form-card-at,.form-eyes-color,.form-hair-color,.form-description').show();
            }
            else if (this.value=='پایان خدمت')
            {
                $('.form-card-at').hide();
                $('.form-card-id,.form-order,.form-start-at,.form-end-at,.form-eyes-color,.form-hair-color,.form-description').show();
            }
            else if (this.value=='نامشخص')
            {
                $('.form-eyes-color,.form-hair-color,.form-description').show();
                $('.form-card-id,.form-order,.form-start-at,.form-card-at').hide();
            }
        });
برای ارسال پاسخ باید وارد سایت شوید