0

i have been making a crud application using php , mysql and bootstrap. everything is working fine but when i click on edit option the model does not open.i can understand why this is happening.

this is happening when i click on edit button. no modal is showing Bootstrap modal not showing

code of edit button

<a href="#edit<?php echo $row['userid']; ?>" data-toggle="modal" class="btn btn-warning btn-sm"><span class="glyphicon glyphicon-edit" style="color: #fff;"></span> </a> 

modal code

    <div class="modal fade" id="edit<?php echo $row['userid']; ?>"  role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <center><h4 class="modal-title" id="myModalLabel">Edit</h4></center>
                </div>
                <div class="modal-body">
                <?php
                    $edit=mysqli_query($conn,"select * from customer_record where userid='".$row['userid']."'");
                    $erow=mysqli_fetch_array($edit);
                ?>
                <div class="container-fluid">
                <form method="POST" action="edit.php?id=<?php echo $erow['userid']; ?>">
            
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>NAME</label>
                                    <input type="text" name="name" class="form-control"   value="<?php echo $erow['name']; ?>">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>PHONE</label>
                                    <input type="text"  name="phone" class="form-control" value="<?php echo $erow['phone']; ?>" >
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>PRODUCT</label>
                                    <input type="text"  name="product" class="form-control" value="<?php echo $erow['product']; ?>" >
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>CLIENT NAME</label>
                                    <select type="text" name="client" class="form-control" value="<?php echo $erow['client']; ?>">
                                        <option>select</option>
                                        <option> Carrefour FORT - L </option>
                                        <option> Carrefour EMP  - L </option>
                                        <option> Carrefour PKJS - L </option>
                                        <option> Carrefour LYPR - F </option>
                                        <option> Carrefour WTC  - I</option>
                                        <option> Carrefour PAL  - K</option>
                                        <option> Carrefour L.ONE -K</option>
                                        <option> Hyundai  </option>
                                        <option> Kenwood  </option>
                                        <option> Canon    </option>
                                        <option> Cash     </option>
                                        <option> Multynet </option>
                                        <option> Panasonic</option>
                                    </select>
                                </div>
                            </div>
                            
                        </div>
                    
                            <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label>ADDRESS</label>
                                    <input type="text" name="address" class="form-control" value="<?php echo $erow['address']; ?>">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>ZONE AREA</label>
                                    <select name="zone_area" class="form-control" value="<?php echo $erow['zone_area']; ?>">
                                        <option>select</option>
                                        <option>A</option>
                                        <option>B</option>
                                        <option>C</option>
                                        <option>D</option>
                                        <option>E</option>
                                        <option>F</option>
                                        <option>G</option>
                                        <option>H</option>
                                        <option>I</option>
                                        <option>J</option>
                                        <option>NA</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>DELIVERY DATE</label>
                                    <input type="date"  name="delivery_date" class="form-control" value="<?php echo $erow['delivery_date']; ?>">
                                </div>                          
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>DELIVERY STATUS</label>
                                    <select  name="delivery_status" class="form-control" value="<?php echo $erow['delivery_status']; ?>">
                                        <option>select</option>
                                        <option> Self Carry </option>
                                        <option> Pending </option>
                                        <option> Lift Back</option>
                                        <option> Deliverd</option>
                                        <option> Deliverd in 2nd attempt</option>
                                    </select>
                                </div>
                            </div>
                        </div>

<div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>INVOICE #</label>
                                    <input type="text" name="invoice" class="form-control" value="<?php echo $erow['invoice']; ?>">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>VEHICLE #</label>
                                    <select type="text" name="vehicle" class="form-control" value="<?php echo $erow['vehicle']; ?>">
                                        <option>select</option>
                                        <option> RIN - 4546 </option>
                                        <option> LES - 2200 </option>
                                        <option> LES - 8732 </option>
                                        <option> LES - 5884 </option>
                                        <option> LES - 4964 </option>
                                        <option> LES - 2150 </option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>COUPAN #</label>
                                    <input type="text" name="coupan" class="form-control" value="<?php echo $erow['coupan']; ?>">
                                </div>
                            </div>
                        </div>
                        
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>INSTALLER NAME</label>
                                    <input type="text" name="installername" class="form-control" value="<?php echo $erow['installername']; ?>">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Installation Date</label>
                                    <input type="date" name="installationdate" class="form-control" value="<?php echo $erow['installationdate']; ?>">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>INSTALLATION STATUS</label>
                                    <select  name="installationstatus" class="form-control" value="<?php echo $erow['installationstatus']; ?>">
                                        <option>select</option>
                                        <option>PROCESSED</option>
                                        <option>COMPLETED</option>
                                        <option>FAILED</option>
                                        <option>Installed in 2nd Attempt</option>
                                    </select>
                                </div>
                            </div>
                        </div>

                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Remarks ( Delivery + installation )</label>
                                    <input type="text" id="remarks" name="remarks" class="form-control" value="<?php echo $erow['remarks']; ?>">
                            </div>
                        </div>
                    </div>  
                </div> 


                
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Cancel</button>
                    <button type="submit" class="btn btn-warning"><span class="glyphicon glyphicon-check"></span> Save</button>
                </div>
                </form>
            </div>
        </div>
    </div>

the plugins i used

Umar Raza
  • 31
  • 1
  • 8

2 Answers2

1

The following article is an answer to a similiar question, you might wanna take a look: https://stackoverflow.com/a/16095583/12739653

If it didn't help you. Please provide some general information; Did you import all required files, what's your Bootstrap version?

If you're using Bootstrap 5, you might need to use data-bs-target and data-bs-toggle instead. Learn more here: https://getbootstrap.com/docs/5.0/components/modal/#live-demo

Neeko
  • 121
  • 1
  • 8
0

Just make sure that your <div class="modal fade" ...> is inside the <body>.