Not able to get value from bootstrap select picker

I am using selectpicker first time and newbie to PHP so I don’t where I am wrong

I am using bootstrap selectpicker on edit modal selectpicker creating dynamically and data presented in the database selected and show on selectpicker but when I click on the update button I am not able to get select picker data

Page Where data is showing http://igaurav.co.in/starRatingSystem/first.php

click on edit sign and saved day and time will automatically select on popup modal click on update and see on console.log you will find day will be print but select picker selected data will not print.

So please help me out.

<?php 

error_reporting(E_ALL);

ini_set("display_errors",1);

require_once'configuration/config.php';

$hp_id = 'INRJAPPO2E381F220220';

date_default_timezone_set("Asia/Kolkata");

$startTime = strtotime(date("H:i:s",strtotime('00:00:00')));

$endTime = strtotime(date('H:i:s',strtotime('23:59:00')));

?>

<!DOCTYPE html>

<html lang="en">

<head>

    <title>Bootstrap Example</title>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

    

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

    <!-- Latest compiled and minified CSS -->

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css">

    <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

    <!-- Latest compiled and minified JavaScript -->

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/bootstrap-select.min.js"></script>

    <link rel="stylesheet" type="text/css" href="grow.css">

    <script type="text/javascript">

        

</script>

</head>

<body>

    <div class="row">

        <div class="col-sm-5">

            <div class="panel-heading bg-info">

                <h4 class="panel-title">View Doctor's</h4>

            </div>  

        </div>

        <div class="col-sm-5">

            <div class="form-group" style="margin-right: 10px;">

                <input type="text" class="form-control" id="myInput" placeholder="Search" name="search">

            </div>

        </div>

        <div class="col-sm-2">

            <div class="form-group" style="margin-right: 10px;">

      

                <!-- Edit Modal -->

                <div class="modal" id="editModal">

                    <div class="modal-dialog">

                        <div class="modal-content" style="width: 130%">

                            <!-- Modal Header -->

                            <div class="modal-header">

                                <h4 class="modal-title">Edit Doctor</h4>

                                <button type="button" class="close" data-dismiss="modal">&times;</button>

                            </div>

                            <!-- Modal body -->

                            <div class="modal-body">

                                <div class="row">

                                    <div class="col-sm-6">

                                        <div class="form-group">

                                            <label>Doctor ID</label>

                                            <input type="text" name="edit_docId" class="form-control" id="edit_doctor_ID" placeholder="Doctor ID" disabled>

                                        </div>

                                    </div>

                                    <div class="col-sm-6">

                                        <div class="form-group">

                                            <label >Doctor Name</label>

                                            <input type="text" name="edit_docName" class="form-control" id="edit_doctor_Name" placeholder=" Doctor Name" disabled>

                                        </div>

                                    </div>

                                    <table class="table table-hover">

                                        <thead class="bg-primary">

                                            <tr>

                                                <th>Days</th>

                                                <th>Timings</th>

                                            </tr>

                                        </thead>

                                        <tbody id="display">

                                        </tbody>

                                    </table>

                                    <div class="col-sm-12" style="float: right;">

                                        <button type="submit" class="btn btn-info pull-right" id="update_doc">Update</button>

                                        <!-- <button type="button" class="btn btn-danger pull-right" data-dismiss="modal">Close</button> -->

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

                <!--End Edit Modal-->

            </div>

        </div>

    </div>

    <table class="table table-stripped table-responsive">

        <thead class="bg-info">

            <tr>

                <th>Sno.</th>

                <th>Doctor ID</th>

                <th style="width: 230px">Days</th>

                <th style="width: 310px">Morning Timings</th>

                <th>Evening Timings</th>

                <th>Actions</th>

            </tr>

        </thead>

        <tbody>

            <?php 

            $count=1;

            $stmt = $con->prepare('SELECT tb_doc_loc.doc_id AS doc_id,tb_doc_loc.days AS days,tb_doc_loc.mtimings AS mtimings,tb_doc_loc.etimings AS etimings FROM tb_doc_loc WHERE tb_doc_loc.hp_id = ?');

            $stmt->bind_param('s',$hp_id);

            $stmt->execute();

            $res = $stmt->get_result();

            while($row = $res->fetch_array()):

                ?>

                <tr>

                    <td><?php echo $count;?></td>

                    <td><?php echo $row['doc_id']; ?></td>

                    <td><?php

                    $col = '#F694C1,#D59BF9,#F694C1,#D59BF9,#F694C1,#D59BF9,#E71D36';

                    $colors = explode(',',$col);

                    $day = explode(',',$row['days']);

                    for($i=0;$i<count($day);$i++):?>

                        <button class="btn "  style="width:72px;font-size: small;color:#fff;padding: 1.5%;background-color:<?php echo $colors[$i];?>"><?php echo $day[$i]?></button>

                    <?php endfor ?>

                </td>

                <td><?php

                $col = '#F694C1,#D59BF9,#F694C1,#D59BF9,#F694C1,#D59BF9,#E71D36';

                $colors = explode(',',$col);

                $mtime = array_chunk(explode(',',$row['mtimings']),2);

                for($i=0;$i<count($day);$i++):?>

                    <?php if($mtime[$i][0] == '--' && $mtime[$i][1] == '--'):?>

                        <button class="btn"  style="width:auto;font-size: small;color:#fff;padding: 1.5%;background-color:<?php echo $colors[$i];?>"><?php echo 'No Schedule'?></button>

                        <?php else: ?>

                            <button class="btn"  style="width:auto;font-size: small;color:#fff;padding: 1.5%;background-color:<?php echo $colors[$i];?>"><?php echo date('h:i a',strtotime($mtime[$i][0])) ." TO ". date('h:i a',strtotime($mtime[$i][1]))?></button>

                        <?php endif; ?>

                    <?php endfor ?>

                </td>

                <td><?php

                $col = '#F694C1,#D59BF9,#F694C1,#D59BF9,#F694C1,#D59BF9,#E71D36';

                $colors = explode(',',$col);

                $etime = array_chunk(explode(',',$row['etimings']),2);

                for($i=0;$i<count($day);$i++):?>

                    <?php if($etime[$i][0] == '--' && $etime[$i][1] == '--'):?>

                        <button class="btn"  style="width:auto;font-size: small;color:#fff;padding: 1.5%;background-color:<?php echo $colors[$i];?>"><?php echo 'No Schedule'?></button>

                        <?php else: ?>

                            <button class="btn"  style="width:auto;font-size: small;color:#fff;padding: 1.5%;background-color:<?php echo $colors[$i];?>"><?php echo date('h:i a',strtotime($etime[$i][0])) ." TO ". date('h:i a',strtotime($etime[$i][1]))?></button>

                        <?php endif; ?> 

                    <?php endfor ?>

                </td>

                <td>

                    <i class="fa fa-pencil-square-o fa-2x editModals" id="<?php echo$row['doc_id'];?>" aria-hidden="true" style="color:green" data-toggle="modal" data-target='#editModal'></i>

                    <a href="#"><i class="fa fa-trash fa-2x" aria-hidden="true" style="color:red"></i></a>

                </td>

            </tr>

            <?php $count++;?>

        <?php endwhile;?>

    </tbody>

</table>

</div>

</div>

<!-- for Search box -->

<script>

    $(document).ready(function(){


        //Edit Modal

        $('.editModals').on('click',function(){

            docId = $(this).attr('id');

            $.ajax({

                url:'doc_timings2.php',

                data:{doc_id:docId},

                type:'POST',

                success:function(data){

                    $('#display').html(data);

                    $('select').selectpicker();

                }

            })
        });

        var checkBox = $(' #editModal input[name="edit_days"]');

        checkBox.on('click',function(){

            if(checkBox.is(':checked')){

                checkedBox = $(this).val();

                $('#'+checkedBox+'_Morning_time').prop("disabled",false);               

                $('.selectpicker').selectpicker('refresh'); 

                $('#'+checkedBox+'_Evening_time').prop("disabled",false);

                $('.selectpicker').selectpicker('refresh');

            }else{

                $('#'+checkedBox+'_Morning_time').prop("disabled",true);

                $('#'+checkedBox+'_Morning_time').prop("selectedIndex",-1);

                $('.selectpicker').selectpicker('refresh');

                $('#'+checkedBox+'_Evening_time').prop("disabled",true);

                $('#'+checkedBox+'_Evening_time').prop("selectedIndex",-1);

                $('.selectpicker').selectpicker('refresh');

                

            }

        });

        $('#update_doc').on('click',function(e){

            e.preventDefault();

            var day     = [];

            var morning = [];

            var evening = [];

            var comb    = [];

            var mor     = [];

            var eve     = [];

            var data    = [];

            var id = $('#edit_doctor_ID').val();

            function get1DArray(arr){

                return arr.join().split(",");

            }

            $('input[name="edit_days"]').each(function(){ 

                    if(this.checked){

                        checkBoxName = ($(this).val()).toString();

                            // var count = $('#'+checkBoxName+'_Morning_time').val().length;

                            // console.log(count)

                            morning.push($('#'+checkBoxName+'_Morning_time').val().toString());

                            evening.push($('#'+checkBoxName+'_Evening_time').val().toString());

                            day.push(checkBoxName);

                            mor  = get1DArray(morning);

                            eve  = get1DArray(evening); 

                            comb.push(checkBoxName,$('#'+checkBoxName+'_Morning_time').val(),$('#'+checkBoxName+'_Evening_time').val());

                        }

                    });

                    console.log(day);

                    console.log(mor);

                    // console.log(eve);

                    data = get1DArray(comb);

                    //console.log(data);

            // $.ajax({

            //  url:'update_doctor.php',

            //  type:'POST',

            //  data:{doc_id:id,days:day,Morning:mortime,Evening:evetime,Combine:comb},

            //  success:function(data){

            //      if(data == 'updated'){

            //          swal('Data Updated','','success');

            //      }else{

            //          swal('Erro Occured','','error');

            //      }

            //  }

            // });

        });

    });

</script>

  
</body>

</html>
1 Like

I think you need to ask the question in here, not just post a link to where you might have asked it somewhere else. Cut it down to the minimum you need to duplicate the problem and post your code along with a good description of what the problem is.

If you open the developer console log and open your page, there’s an error message “unmatched end tag” - might that be causing a problem?

2 Likes

You can use direct link of the page which i given above

1 Like

i all ready posted

1 Like

second thing the link i am talking about is not stack overflow link
the link i shared is that page where error occurred u can find directly where i am wrong

OK, I apologise, I didn’t see that. I’ve deleted my diatribe.

Now, how about that error message on the console log when your page opens? Maybe that will help.

I also now get an “Invalid HTML DOCTYPE” error.

Too much code for me. In any case, I suspect it might be more of a JavaScript question than a PHP one.

sorry by mistake i place ; after page link now you can use that page link

Have you fixed the problem? I clicked on the Edit icon for the first row of data, checked “Friday” and selected 09:30 for “Morning Timings” and 19:00 for “Evening Timings”. Then I clicked the Update button.
This is what I see in the console:

first.php:1145 (3) ["Monday", "Tuesday", "Friday"]
first.php:1146 (5) ["08:00", "10:00", "09:00", "11:30", "09:30"]
first.php:1147 (5) ["16:00", "17:30", "16:30", "18:30", "19:00"]
first.php:1149 (13) ["Monday", "08:00", "10:00", "16:00", "17:30", "Tuesday", "09:00", "11:30", "16:30", "18:30", "Friday", "09:30", "19:00"]

It seems like you’re getting the new data from the select and they’re printing out okay. If not, please explain what is expected.

@fullstackdev yes i manged to fix things but thanks for responding

Perhaps you could share how you fixed it, in case it helps anyone in the future.