Cách cập nhật dữ liệu bằng modal trong php

Xin chào các bạn trong bài đăng này, chúng ta sẽ thảo luận về cách chúng ta có thể cập nhật dữ liệu vào dữ liệu bảng mysql bằng Bootstrap Modal bằng cách sử dụng tập lệnh php với Ajax jquery mà không cần làm mới trang. Trong hướng dẫn trước về Bootstrap Modal, chúng tôi đã chỉ ra cách chèn dữ liệu vào bảng Mysql bằng cách sử dụng Bootstrap Modal với tập lệnh PHP với Ajax jquery. Công dụng chính của Bootstrap Modal là chúng ta có thể thực hiện bất kỳ loại thao tác cơ sở dữ liệu nào như Chèn, Cập nhật, tìm nạp và xóa hoặc hiển thị bất kỳ thông báo nào mà không cần mở trang mới nhưng chúng ta có thể thực hiện loại thao tác này trên trang dưới dạng hộp cảnh báo bật lên. Chúng tôi có thể gọi Phương thức Bootstrap này bằng cách nhấp vào thẻ neo hoặc bất kỳ nút nào bằng cách sử dụng mã jquery hoặc chúng tôi cũng có thể hiển thị cửa sổ Phương thức Bootstrap bằng cách xác định thuộc tính dữ liệu trong phần tử. Ở đây, chúng tôi đã sử dụng Ajax Jquery và bằng jquery, chúng tôi có id nhân viên từ nút chỉnh sửa, chúng tôi đã tạo tất cả các nút chỉnh sửa riêng biệt của nhân viên với id khác và trong id này, chúng tôi có id nhân viên lưu trữ và bằng cách sử dụng mã jquery, chúng tôi có id nhân viên từ nút .

Bản trình diễn trực tuyến

Mã nguồn

mục lục. php

 
   
   
   
        
             
             
             
             
        
        
           

  
           
  
                
PHP Ajax Update MySQL Data Through Bootstrap Modal
  
                
  
                
  
                     
  
                          Add  
                     
  
                     
  
                     
  
                          
  
                               
  
                                    
Employee Name
  
                                    
Edit
  
                                    
View
  
                               
  
                                 
                               
  
                                    
  
                                    
" class="btn btn-info btn-xs edit_data" />
  
                                    
" class="btn btn-info btn-xs view_data" />
  
                               
  
                                 
                          
  
                     
  
                
  
           
  
        
   
 
  
      
  
           
  
                
  
                     ×  
                     
Employee Details
  
                
  
                
  
                
  
                
  
                     Close  
                
  
           
  
      
  
 
  
 
  
      
  
           
  
                
  
                     ×  
                     
PHP Ajax Update MySQL Data Through Bootstrap Modal
  
                
  
                
  
                     
  
                          Enter Employee Name  
                            
                          
  
                          Enter Employee Address  
                            
                          
  
                          Select Gender  
                            
                               Male  
                               Female  
                            
                          
  
                          Enter Designation  
                            
                          
  
                          Enter Age  
                            
                          
  
                            
                            
                     
  
                
  
                
  
                     Close  
                
  
           
  
      
  
 
  
 
 

tìm nạp. php

chèn. php

 
  ' . $message . '';  
           $select_query = "SELECT * FROM tbl_employee ORDER BY id DESC";  
           $result = mysqli_query($connect, $select_query);  
           $output .= '  
                  
           ';  
           while($row = mysqli_fetch_array($result))  
           {  
                $output .= '  
                       
                ';  
           }  
           $output .= '
  
                     
  
                          
Employee Name
  
                          
Edit
  
                          
View
  
                     
  
                          
' . $row["name"] . '
  
                          
  
                          
  
                     
';  
      }  
      echo $output;  
 }  
 ?>
 

chọn. php

 
    
           ';  
      while($row = mysqli_fetch_array($result))  
      {  
           $output .= '  
                  
           ';  
      }  
      $output .= '  
           
  
                     
Name
  
                     
'.$row["name"].'
  
                
  
                
  
                     
Address
  
                     
'.$row["address"].'
  
                
  
                
  
                     
Gender
  
                     
'.$row["gender"].'
  
                
  
                
  
                     
Designation
  
                     
'.$row["designation"].'
  
                
  
                
  
                     
Age
  
                     
'.$row["age"].' Year
  
                
  
      

 
  --  
 -- Table structure for table `tbl_employee`  
 --  
 CREATE TABLE IF NOT EXISTS `tbl_employee` (  
  `id` int(11) NOT NULL AUTO_INCREMENT,  
  `name` varchar(50) NOT NULL,  
  `address` text NOT NULL,  
  `gender` varchar(10) NOT NULL,  
  `designation` varchar(100) NOT NULL,  
  `age` int(11) NOT NULL,  
  `image` varchar(100) NOT NULL,  
  PRIMARY KEY (`id`)  
 ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=187 ;  
 --  
 -- Dumping data for table `tbl_employee`  
 --  
 INSERT INTO `tbl_employee` (`id`, `name`, `address`, `gender`, `designation`, `age`, `image`) VALUES  
 (1, 'Bruce Tom', '656 Edsel Road\r\nSherman Oaks, CA 91403', 'Male', 'Driver', 36, '1.jpg'),  
 (5, 'Clara Gilliam', '63 Woodridge Lane\r\nMemphis, TN 38138', 'Female', 'Programmer', 24, '2.jpg'),  
 (6, 'Barbra K. Hurley', '1241 Canis Heights Drive\r\nLos Angeles, CA 90017', 'Female', 'Service technician', 26, '3.jpg'),  
 (7, 'Antonio J. Forbes', '403 Snyder Avenue\r\nCharlotte, NC 28208', 'Male', 'Faller', 32, '4.jpg'),  
 (8, 'Charles D. Horst', '1636 Walnut Hill Drive\r\nCincinnati, OH 45202', 'Male', 'Financial investigator', 29, '5.jpg'),  
 (175, 'Ronald D. Colella', '1571 Bingamon Branch Road, Barrington, IL 60010', 'Male', 'Top executive', 32, '6.jpg'),  
 (174, 'Martha B. Tomlinson', '4005 Bird Spring Lane, Houston, TX 77002', 'Female', 'Systems programmer', 38, '7.jpg'),  
 (161, 'Glenda J. Stewart', '3482 Pursglove Court, Rossburg, OH 45362', 'Female', 'Cost consultant', 28, '8.jpg'),  
 (162, 'Jarrod D. Jones', '3827 Bingamon Road, Garfield Heights, OH 44125', 'Male', 'Manpower development advisor', 64, '9.jpg'),  
 (163, 'William C. Wright', '2653 Pyramid Valley Road, Cedar Rapids, IA 52404', 'Male', 'Political geographer', 33, '10.jpg'),  
 (178, 'Sara K. Ebert', '1197 Nelm Street\r\nMc Lean, VA 22102', 'Female', 'Billing machine operator', 50, ''),  
 (177, 'Patricia L. Scott', '1584 Dennison Street\r\nModesto, CA 95354', 'Female', 'Urban and regional planner', 54, ''),  
 (179, 'James K. Ridgway', '3462 Jody Road\r\nWayne, PA 19088', 'Female', 'Recreation leader', 41, ''),  
 (180, 'Stephen A. Crook', '448 Deercove Drive\r\nDallas, TX 75201', 'Male', 'Optical goods worker', 36, ''),  
 (181, 'Kimberly J. Ellis', '4905 Holt Street\r\nFort Lauderdale, FL 33301', 'Male', 'Dressing room attendant', 24, ''),  
 (182, 'Elizabeth N. Bradley', '1399 Randall Drive\r\nHonolulu, HI 96819', 'Female', ' Software quality assurance analyst', 25, ''),  
 (183, 'Steve John', '108, Vile Parle, CL', 'Male', 'Software Engineer', 29, ''),  
 (184, 'Marks Johnson', '021, Big street, NY', 'Male', 'Head of IT', 41, ''),  
 (185, 'Mak Pub', '1462 Juniper Drive\r\nBreckenridge, MI 48612', 'Male', 'Mental health counselor', 40, ''),  
 (186, 'Louis C. Charmis', '1462 Juniper Drive\r\nBreckenridge, MI 48612', 'Male', 'Mental health counselor', 40, '');