{"id":1073,"date":"2024-07-17T19:05:09","date_gmt":"2024-07-17T19:05:09","guid":{"rendered":"https:\/\/www.appfinz.com\/blogs\/?p=1073"},"modified":"2025-05-15T05:00:40","modified_gmt":"2025-05-15T05:00:40","slug":"bootstrap-crud-data-table-for-database-with-modal-form","status":"publish","type":"post","link":"https:\/\/www.appfinz.com\/blogs\/bootstrap-crud-data-table-for-database-with-modal-form\/","title":{"rendered":"Bootstrap Crud Data Table for Database with Modal Form"},"content":{"rendered":"\n

Hello Nerds, <\/p>\n\n\n\n

In this blog section, we will see basic example of how to make bootstrap crud data table for database with modal form, In this example we have designed a basic bootstrap table which reflects bootstrap crud data table for database. <\/p>\n\n\n\n

\"Bootstrap<\/figure>\n\n\n\n

lets beging with source code here:<\/p>\n\n\n\n

<!DOCTYPE html>\n<html lang="en">\n<head>\n<meta charset="utf-8">\n<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">\n<title>Bootstrap CRUD Data Table for Database with Modal Form | Appfinz Technologies<\/title>\n<link rel="stylesheet" href="https:\/\/fonts.googleapis.com\/css?family=Roboto|Varela+Round">\n<link rel="stylesheet" href="https:\/\/stackpath.bootstrapcdn.com\/bootstrap\/4.5.0\/css\/bootstrap.min.css">\n<link rel="stylesheet" href="https:\/\/fonts.googleapis.com\/icon?family=Material+Icons">\n<link rel="stylesheet" href="https:\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.7.0\/css\/font-awesome.min.css">\n<script src="https:\/\/code.jquery.com\/jquery-3.5.1.min.js"><\/script>\n<script src="https:\/\/cdn.jsdelivr.net\/npm\/popper.js@1.16.0\/dist\/umd\/popper.min.js"><\/script>\n<script src="https:\/\/stackpath.bootstrapcdn.com\/bootstrap\/4.5.0\/js\/bootstrap.min.js"><\/script>\n<\/head>\n<body>\n<div class="container-xl">\n\t<div class="table-responsive">\n\t\t<div class="table-wrapper">\n\t\t\t<div class="table-title">\n\t\t\t\t<div class="row">\n\t\t\t\t\t<div class="col-sm-6">\n\t\t\t\t\t\t<h2>Manage <b>Employees<\/b><\/h2>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="col-sm-6">\n\t\t\t\t\t\t<a href="#addEmployeeModal" class="btn btn-success" data-toggle="modal"><i class="material-icons">&#xE147;<\/i> <span>Add New Employee<\/span><\/a>\n\t\t\t\t\t\t<a href="#deleteEmployeeModal" class="btn btn-danger" data-toggle="modal"><i class="material-icons">&#xE15C;<\/i> <span>Delete<\/span><\/a>\t\t\t\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t<table class="table table-striped table-hover">\n\t\t\t\t<thead>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t<span class="custom-checkbox">\n\t\t\t\t\t\t\t\t<input type="checkbox" id="selectAll">\n\t\t\t\t\t\t\t\t<label for="selectAll"><\/label>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/th>\n\t\t\t\t\t\t<th>Name<\/th>\n\t\t\t\t\t\t<th>Email<\/th>\n\t\t\t\t\t\t<th>Address<\/th>\n\t\t\t\t\t\t<th>Phone<\/th>\n\t\t\t\t\t\t<th>Actions<\/th>\n\t\t\t\t\t<\/tr>\n\t\t\t\t<\/thead>\n\t\t\t\t<tbody>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<span class="custom-checkbox">\n\t\t\t\t\t\t\t\t<input type="checkbox" id="checkbox1" name="options[]" value="1">\n\t\t\t\t\t\t\t\t<label for="checkbox1"><\/label>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t\t<td>Thomas Hardy<\/td>\n\t\t\t\t\t\t<td>thomashardy@mail.com<\/td>\n\t\t\t\t\t\t<td>89 Chiaroscuro Rd, Portland, USA<\/td>\n\t\t\t\t\t\t<td>(171) 555-2222<\/td>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<a href="#editEmployeeModal" class="edit" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Edit">&#xE254;<\/i><\/a>\n\t\t\t\t\t\t\t<a href="#deleteEmployeeModal" class="delete" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Delete">&#xE872;<\/i><\/a>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t<\/tr>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<span class="custom-checkbox">\n\t\t\t\t\t\t\t\t<input type="checkbox" id="checkbox2" name="options[]" value="1">\n\t\t\t\t\t\t\t\t<label for="checkbox2"><\/label>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t\t<td>Dominique Perrier<\/td>\n\t\t\t\t\t\t<td>dominiqueperrier@mail.com<\/td>\n\t\t\t\t\t\t<td>Obere Str. 57, Berlin, Germany<\/td>\n\t\t\t\t\t\t<td>(313) 555-5735<\/td>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<a href="#editEmployeeModal" class="edit" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Edit">&#xE254;<\/i><\/a>\n\t\t\t\t\t\t\t<a href="#deleteEmployeeModal" class="delete" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Delete">&#xE872;<\/i><\/a>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t<\/tr>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<span class="custom-checkbox">\n\t\t\t\t\t\t\t\t<input type="checkbox" id="checkbox3" name="options[]" value="1">\n\t\t\t\t\t\t\t\t<label for="checkbox3"><\/label>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t\t<td>Maria Anders<\/td>\n\t\t\t\t\t\t<td>mariaanders@mail.com<\/td>\n\t\t\t\t\t\t<td>25, rue Lauriston, Paris, France<\/td>\n\t\t\t\t\t\t<td>(503) 555-9931<\/td>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<a href="#editEmployeeModal" class="edit" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Edit">&#xE254;<\/i><\/a>\n\t\t\t\t\t\t\t<a href="#deleteEmployeeModal" class="delete" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Delete">&#xE872;<\/i><\/a>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t<\/tr>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<span class="custom-checkbox">\n\t\t\t\t\t\t\t\t<input type="checkbox" id="checkbox4" name="options[]" value="1">\n\t\t\t\t\t\t\t\t<label for="checkbox4"><\/label>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t\t<td>Fran Wilson<\/td>\n\t\t\t\t\t\t<td>franwilson@mail.com<\/td>\n\t\t\t\t\t\t<td>C\/ Araquil, 67, Madrid, Spain<\/td>\n\t\t\t\t\t\t<td>(204) 619-5731<\/td>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<a href="#editEmployeeModal" class="edit" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Edit">&#xE254;<\/i><\/a>\n\t\t\t\t\t\t\t<a href="#deleteEmployeeModal" class="delete" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Delete">&#xE872;<\/i><\/a>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t<\/tr>\t\t\t\t\t\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<span class="custom-checkbox">\n\t\t\t\t\t\t\t\t<input type="checkbox" id="checkbox5" name="options[]" value="1">\n\t\t\t\t\t\t\t\t<label for="checkbox5"><\/label>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t\t<td>Martin Blank<\/td>\n\t\t\t\t\t\t<td>martinblank@mail.com<\/td>\n\t\t\t\t\t\t<td>Via Monte Bianco 34, Turin, Italy<\/td>\n\t\t\t\t\t\t<td>(480) 631-2097<\/td>\n\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t<a href="#editEmployeeModal" class="edit" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Edit">&#xE254;<\/i><\/a>\n\t\t\t\t\t\t\t<a href="#deleteEmployeeModal" class="delete" data-toggle="modal"><i class="material-icons" data-toggle="tooltip" title="Delete">&#xE872;<\/i><\/a>\n\t\t\t\t\t\t<\/td>\n\t\t\t\t\t<\/tr> \n\t\t\t\t<\/tbody>\n\t\t\t<\/table>\n\t\t\t<div class="clearfix">\n\t\t\t\t<div class="hint-text">Showing <b>5<\/b> out of <b>25<\/b> entries<\/div>\n\t\t\t\t<ul class="pagination">\n\t\t\t\t\t<li class="page-item disabled"><a href="#">Previous<\/a><\/li>\n\t\t\t\t\t<li class="page-item"><a href="#" class="page-link">1<\/a><\/li>\n\t\t\t\t\t<li class="page-item"><a href="#" class="page-link">2<\/a><\/li>\n\t\t\t\t\t<li class="page-item active"><a href="#" class="page-link">3<\/a><\/li>\n\t\t\t\t\t<li class="page-item"><a href="#" class="page-link">4<\/a><\/li>\n\t\t\t\t\t<li class="page-item"><a href="#" class="page-link">5<\/a><\/li>\n\t\t\t\t\t<li class="page-item"><a href="#" class="page-link">Next<\/a><\/li>\n\t\t\t\t<\/ul>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>        \n<\/div>\n<!-- Edit Modal HTML -->\n<div id="addEmployeeModal" class="modal fade">\n\t<div class="modal-dialog">\n\t\t<div class="modal-content">\n\t\t\t<form>\n\t\t\t\t<div class="modal-header">\t\t\t\t\t\t\n\t\t\t\t\t<h4 class="modal-title">Add Employee<\/h4>\n\t\t\t\t\t<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;<\/button>\n\t\t\t\t<\/div>\n\t\t\t\t<div class="modal-body">\t\t\t\t\t\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Name<\/label>\n\t\t\t\t\t\t<input type="text" class="form-control" required>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Email<\/label>\n\t\t\t\t\t\t<input type="email" class="form-control" required>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Address<\/label>\n\t\t\t\t\t\t<textarea class="form-control" required><\/textarea>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Phone<\/label>\n\t\t\t\t\t\t<input type="text" class="form-control" required>\n\t\t\t\t\t<\/div>\t\t\t\t\t\n\t\t\t\t<\/div>\n\t\t\t\t<div class="modal-footer">\n\t\t\t\t\t<input type="button" class="btn btn-default" data-dismiss="modal" value="Cancel">\n\t\t\t\t\t<input type="submit" class="btn btn-success" value="Add">\n\t\t\t\t<\/div>\n\t\t\t<\/form>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n<!-- Edit Modal HTML -->\n<div id="editEmployeeModal" class="modal fade">\n\t<div class="modal-dialog">\n\t\t<div class="modal-content">\n\t\t\t<form>\n\t\t\t\t<div class="modal-header">\t\t\t\t\t\t\n\t\t\t\t\t<h4 class="modal-title">Edit Employee<\/h4>\n\t\t\t\t\t<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;<\/button>\n\t\t\t\t<\/div>\n\t\t\t\t<div class="modal-body">\t\t\t\t\t\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Name<\/label>\n\t\t\t\t\t\t<input type="text" class="form-control" required>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Email<\/label>\n\t\t\t\t\t\t<input type="email" class="form-control" required>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Address<\/label>\n\t\t\t\t\t\t<textarea class="form-control" required><\/textarea>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class="form-group">\n\t\t\t\t\t\t<label>Phone<\/label>\n\t\t\t\t\t\t<input type="text" class="form-control" required>\n\t\t\t\t\t<\/div>\t\t\t\t\t\n\t\t\t\t<\/div>\n\t\t\t\t<div class="modal-footer">\n\t\t\t\t\t<input type="button" class="btn btn-default" data-dismiss="modal" value="Cancel">\n\t\t\t\t\t<input type="submit" class="btn btn-info" value="Save">\n\t\t\t\t<\/div>\n\t\t\t<\/form>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n<!-- Delete Modal HTML -->\n<div id="deleteEmployeeModal" class="modal fade">\n\t<div class="modal-dialog">\n\t\t<div class="modal-content">\n\t\t\t<form>\n\t\t\t\t<div class="modal-header">\t\t\t\t\t\t\n\t\t\t\t\t<h4 class="modal-title">Delete Employee<\/h4>\n\t\t\t\t\t<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;<\/button>\n\t\t\t\t<\/div>\n\t\t\t\t<div class="modal-body">\t\t\t\t\t\n\t\t\t\t\t<p>Are you sure you want to delete these Records?<\/p>\n\t\t\t\t\t<p class="text-warning"><small>This action cannot be undone.<\/small><\/p>\n\t\t\t\t<\/div>\n\t\t\t\t<div class="modal-footer">\n\t\t\t\t\t<input type="button" class="btn btn-default" data-dismiss="modal" value="Cancel">\n\t\t\t\t\t<input type="submit" class="btn btn-danger" value="Delete">\n\t\t\t\t<\/div>\n\t\t\t<\/form>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n<\/body>\n<\/html><\/pre><\/div>\n\n\n\n
Following in the css code, which help to design the complete table for crud using bootstrap:<\/p>\n\n\n\n
body {\n\tcolor: #566787;\n\tbackground: #f5f5f5;\n\tfont-family: 'Varela Round', sans-serif;\n\tfont-size: 13px;\n}\n.table-responsive {\n    margin: 30px 0;\n}\n.table-wrapper {\n\tbackground: #fff;\n\tpadding: 20px 25px;\n\tborder-radius: 3px;\n\tmin-width: 1000px;\n\tbox-shadow: 0 1px 1px rgba(0,0,0,.05);\n}\n.table-title {        \n\tpadding-bottom: 15px;\n\tbackground: #435d7d;\n\tcolor: #fff;\n\tpadding: 16px 30px;\n\tmin-width: 100%;\n\tmargin: -20px -25px 10px;\n\tborder-radius: 3px 3px 0 0;\n}\n.table-title h2 {\n\tmargin: 5px 0 0;\n\tfont-size: 24px;\n}\n.table-title .btn-group {\n\tfloat: right;\n}\n.table-title .btn {\n\tcolor: #fff;\n\tfloat: right;\n\tfont-size: 13px;\n\tborder: none;\n\tmin-width: 50px;\n\tborder-radius: 2px;\n\tborder: none;\n\toutline: none !important;\n\tmargin-left: 10px;\n}\n.table-title .btn i {\n\tfloat: left;\n\tfont-size: 21px;\n\tmargin-right: 5px;\n}\n.table-title .btn span {\n\tfloat: left;\n\tmargin-top: 2px;\n}\ntable.table tr th, table.table tr td {\n\tborder-color: #e9e9e9;\n\tpadding: 12px 15px;\n\tvertical-align: middle;\n}\ntable.table tr th:first-child {\n\twidth: 60px;\n}\ntable.table tr th:last-child {\n\twidth: 100px;\n}\ntable.table-striped tbody tr:nth-of-type(odd) {\n\tbackground-color: #fcfcfc;\n}\ntable.table-striped.table-hover tbody tr:hover {\n\tbackground: #f5f5f5;\n}\ntable.table th i {\n\tfont-size: 13px;\n\tmargin: 0 5px;\n\tcursor: pointer;\n}\t\ntable.table td:last-child i {\n\topacity: 0.9;\n\tfont-size: 22px;\n\tmargin: 0 5px;\n}\ntable.table td a {\n\tfont-weight: bold;\n\tcolor: #566787;\n\tdisplay: inline-block;\n\ttext-decoration: none;\n\toutline: none !important;\n}\ntable.table td a:hover {\n\tcolor: #2196F3;\n}\ntable.table td a.edit {\n\tcolor: #FFC107;\n}\ntable.table td a.delete {\n\tcolor: #F44336;\n}\ntable.table td i {\n\tfont-size: 19px;\n}\ntable.table .avatar {\n\tborder-radius: 50%;\n\tvertical-align: middle;\n\tmargin-right: 10px;\n}\n.pagination {\n\tfloat: right;\n\tmargin: 0 0 5px;\n}\n.pagination li a {\n\tborder: none;\n\tfont-size: 13px;\n\tmin-width: 30px;\n\tmin-height: 30px;\n\tcolor: #999;\n\tmargin: 0 2px;\n\tline-height: 30px;\n\tborder-radius: 2px !important;\n\ttext-align: center;\n\tpadding: 0 6px;\n}\n.pagination li a:hover {\n\tcolor: #666;\n}\t\n.pagination li.active a, .pagination li.active a.page-link {\n\tbackground: #03A9F4;\n}\n.pagination li.active a:hover {        \n\tbackground: #0397d6;\n}\n.pagination li.disabled i {\n\tcolor: #ccc;\n}\n.pagination li i {\n\tfont-size: 16px;\n\tpadding-top: 6px\n}\n.hint-text {\n\tfloat: left;\n\tmargin-top: 10px;\n\tfont-size: 13px;\n}    \n\/* Custom checkbox *\/\n.custom-checkbox {\n\tposition: relative;\n}\n.custom-checkbox input[type="checkbox"] {    \n\topacity: 0;\n\tposition: absolute;\n\tmargin: 5px 0 0 3px;\n\tz-index: 9;\n}\n.custom-checkbox label:before{\n\twidth: 18px;\n\theight: 18px;\n}\n.custom-checkbox label:before {\n\tcontent: '';\n\tmargin-right: 10px;\n\tdisplay: inline-block;\n\tvertical-align: text-top;\n\tbackground: white;\n\tborder: 1px solid #bbb;\n\tborder-radius: 2px;\n\tbox-sizing: border-box;\n\tz-index: 2;\n}\n.custom-checkbox input[type="checkbox"]:checked + label:after {\n\tcontent: '';\n\tposition: absolute;\n\tleft: 6px;\n\ttop: 3px;\n\twidth: 6px;\n\theight: 11px;\n\tborder: solid #000;\n\tborder-width: 0 3px 3px 0;\n\ttransform: inherit;\n\tz-index: 3;\n\ttransform: rotateZ(45deg);\n}\n.custom-checkbox input[type="checkbox"]:checked + label:before {\n\tborder-color: #03A9F4;\n\tbackground: #03A9F4;\n}\n.custom-checkbox input[type="checkbox"]:checked + label:after {\n\tborder-color: #fff;\n}\n.custom-checkbox input[type="checkbox"]:disabled + label:before {\n\tcolor: #b8b8b8;\n\tcursor: auto;\n\tbox-shadow: none;\n\tbackground: #ddd;\n}\n\/* Modal styles *\/\n.modal .modal-dialog {\n\tmax-width: 400px;\n}\n.modal .modal-header, .modal .modal-body, .modal .modal-footer {\n\tpadding: 20px 30px;\n}\n.modal .modal-content {\n\tborder-radius: 3px;\n\tfont-size: 14px;\n}\n.modal .modal-footer {\n\tbackground: #ecf0f1;\n\tborder-radius: 0 0 3px 3px;\n}\n.modal .modal-title {\n\tdisplay: inline-block;\n}\n.modal .form-control {\n\tborder-radius: 2px;\n\tbox-shadow: none;\n\tborder-color: #dddddd;\n}\n.modal textarea.form-control {\n\tresize: vertical;\n}\n.modal .btn {\n\tborder-radius: 2px;\n\tmin-width: 100px;\n}\t\n.modal form label {\n\tfont-weight: normal;\n}\t<\/pre><\/div>\n\n\n\n
Also includes in Jquery javascript to launch the modal: use this jquery code at the top of the page using script tag:<\/p>\n\n\n\n
$(document).ready(function(){\n\t\/\/ Activate tooltip\n\t$('[data-toggle="tooltip"]').tooltip();\n\t\n\t\/\/ Select\/Deselect checkboxes\n\tvar checkbox = $('table tbody input[type="checkbox"]');\n\t$("#selectAll").click(function(){\n\t\tif(this.checked){\n\t\t\tcheckbox.each(function(){\n\t\t\t\tthis.checked = true;                        \n\t\t\t});\n\t\t} else{\n\t\t\tcheckbox.each(function(){\n\t\t\t\tthis.checked = false;                        \n\t\t\t});\n\t\t} \n\t});\n\tcheckbox.click(function(){\n\t\tif(!this.checked){\n\t\t\t$("#selectAll").prop("checked", false);\n\t\t}\n\t});\n});<\/pre><\/div>\n\n\n\n
If you\u2019re planning to revamp your online presence, don\u2019t miss exploring our\u00a0website designing services<\/strong><\/a>\u00a0and custom\u00a0website development<\/a><\/strong>\u00a0solutions tailored to your business needs.<\/p>\n\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
Hello Nerds, In this blog section, we will see basic example of how to make<\/p>\n","protected":false},"author":1,"featured_media":1074,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[150],"tags":[],"class_list":["post-1073","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jquery"],"_links":{"self":[{"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/posts\/1073","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/comments?post=1073"}],"version-history":[{"count":2,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/posts\/1073\/revisions"}],"predecessor-version":[{"id":1365,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/posts\/1073\/revisions\/1365"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/media\/1074"}],"wp:attachment":[{"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/media?parent=1073"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/categories?post=1073"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.appfinz.com\/blogs\/wp-json\/wp\/v2\/tags?post=1073"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}