mercredi 1 mars 2017

Why doesn't JQuery .append fully render my dynamic dependent dropdown feature?

I'm working on a dynamic dependent dropdown feature on my app that uses laravel, jquery, ajax, and json to pull the data from the DB... I have it functioning to a point. but it won't render the data back into the HTML element. would you mind eyeballing my code to see what I may be overlooking?

home.blade.php :

    <!-- Unit Select Form Group # 1 -->
    <div id="fg-fw-1" class="form-group">
    <label for="unit" class="col-md-4 control-label">Unit</label>
        <div class="col-md-4">
            <select title="unit" id="unit_id" class="units form-control select-picker show-tick" name="unit" data-style="btn-info" autofocus>
                <option value="0" disabled selected>Select A Unit</option>
                @foreach(App\Unit::all() as $unit)
                    <option value=""></option>
                @endforeach
    </select>
        </div>
    </div>
    <!-- Patient Name Select Form Group # 2 (JQuery Control) -->
    <div id="fg-fw-2" class="form-group">
    <label for="patient_name" class="col-md-4 control-label">Patient Name</label>
        <div class="col-md-4">
            <select title="patient_name" id="patient_name" class="patient_name form-control select-picker show-tick" name="patient_name" data-style="btn-info" autofocus>
            </select>
        </div>
    </div>

This is the JQuery code portion (on home.blade.php)

    // This block of JQuery code addresses SELECT tag group #2.
            $(document).ready(function() {
                $(document).on('change', '.units', function () {
                    var unit_id = $(this).val();
                    var div = $(this).parent();
                    var opt_tag = " ";
                   $.ajax({
                        type: 'get',
                        url: '{!!URL::to('findPatientName')!!}',
                        data: {'id': unit_id},
                        success: function (data) {
                            console.log('success');
                            console.log(data);
                            console.log(data.length);
                            opt_tag += '<option value="0" selected disabled>Select Patient</option>';
                            for (var i = 0; i < data.length; i++) {
                                opt_tag += '<option value="' + data[i].id + '">' + data[i].patient_name + '</option>';
                             }
                             div.find('.patient_name').html(" ");
                             div.find('.patient_name').appendTo(opt_tag);
                    console.log('it has passed here');
                },
                error: function () {
                }
            });
        });

And finally here is the HomeController.php

    <?php
    namespace App\Http\Controllers;
    use App\Gender;
    use App\InpatientDiagnosis;
    use App\InpatientWcBrand;
    use App\InpatientWcModel;
    use App\TherapistName;
    use App\PatientName;
    use App\Room;
    use Illuminate\Http\Request;
    class HomeController extends Controller {
        /**
         * Create a new controller instance.
         * @return void
         */
        public function __construct() {
            $this->middleware('auth:user');
        }
        /**
         * Show the application dashboard.
         * @return \Illuminate\Http\Response
         */
         /** This function controls the Select Fields for the   Dependant Dynamic Form Wizard:
          *  Select Fields 2, 3, 4, 5, 7, 9, 10 are controlled through the 'ajaxJsonResponse'
          *  Function.
          *
          **/
        public function index() {
                return view('home'); //sent data to view
        }
        public function findPatientName(Request $request) {
            // This variable controls the Rooms Select Field #2
            $inpatients = PatientName::select('patient_name','id')->where('unit_id',$request->id)->take(100)->get();
            return response()->json($inpatients); // Then sent this data to ajax success.
        }
        public function findRoom(Request $request) {
            // This variable controls the Rooms Select Field #3
            $rooms = Room::select('room','id')->where('inpatient_id',$request->id)->take(100)->get();
            return response()->json($rooms); // Then sent this data to ajax success.
        }
        public function findGender(Request $request) {
            // This variable controls the Rooms Select Field #4
            $gender = Gender::select('gender','id')->where('room_id',$request->id)->take(100)->get();
            return response()->json($gender); // Then sent this data to ajax success.
        }
        public function findDiagnosis(Request $request) {
            // This variable controls the Diagnosis Select Field #5
            $diagnosis =     InpatientDiagnosis::select('diagnosis_abbreviation','id')->where('gender_id',$request->id)->take(100)->get();
            return response()->json($diagnosis); // Then sent this data to ajax success.
        }
        public function therapistTitle(Request $request) {
            // This variable controls the Therapist Title Select Field #5
            $diagnosis = TherapistName::select('diagnosis_abbreviation','id')->where('gender_id',$request->id)->take(100)->get();
            return response()->json($diagnosis); // Then sent this data to ajax success.
        }
        public function findTherapistNames(Request $request) {
            // This variable controls the Rooms Select Field #7
            $therapist_names = TherapistName::select('therapist_names','id')->where('title_id',$request->id)->take(100)->get();
            return response()->json($therapist_names); // Then sent this data to ajax success.
        }
        public function findInpatientWcModels(Request $request) {
            // This variable controls the Rooms Select Field #9
            $wc_models = InpatientWcModel::select('inpatient_wc_model','id')->where('inpatient_wc_type_id',$request->id)->take(100)->get();
            return response()->json($wc_models); // Then sent this data to ajax success.
        }
        public function findInpatientWcBrands(Request $request) {
            // This variable controls the Rooms Select Field #10
            $wc_brands = InpatientWcBrand::select('inpatient_wc_brand','id')->where('wc_model_id',$request->id)->take(100)->get();
            return response()->json($wc_brands); // Then sent this data to ajax success.
        }



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire