diff --git a/html/exhi/application/views/general/v_general_select.php b/html/exhi/application/views/general/v_general_select.php
index 6ca6862f9f91c69c227f002f3fe97c3b10d64cdc..8abd1ed134f306b152ea1021689db681d74708c9 100644
--- a/html/exhi/application/views/general/v_general_select.php
+++ b/html/exhi/application/views/general/v_general_select.php
@@ -252,7 +252,7 @@ span{
 									</div>
 								</div>
 								<div class="col-6">
-									<div style="font-family: Sarabun; font-size: 18px; text-align:justify;">&emsp;&emsp;&emsp;&emsp;<?php echo $d->description ?></d>
+									<div style="font-family: Sarabun; font-size: 18px; text-align:justify;">&emsp;&emsp;&emsp;&emsp;<?php echo $d->description ?></div>
 								</div>
 							</div>
 						</div>
@@ -309,7 +309,7 @@ span{
 								</div>	
 								<div class="card-body">
 									<h5><?php echo $m->prefix.$m->first_name.' '.$m->last_name ?></h5>
-									<span><h5><i class="fa fa-envelope icon"></i>  :  <?php echo $m->email ?></h5</span><br>
+									<span><h5><i class="fa fa-envelope icon"></i>  :  <?php echo $m->email ?></h5></span><br>
 								</div>
 							</div>
 						</div>
diff --git a/html/exhi/application/views/general/v_project_search_2.php b/html/exhi/application/views/general/v_project_search_2.php
new file mode 100644
index 0000000000000000000000000000000000000000..e242622bf4a56ef02e1df1f977b6cafa9f482b3b
--- /dev/null
+++ b/html/exhi/application/views/general/v_project_search_2.php
@@ -0,0 +1,254 @@
+<style>
+/* .page-header.page-header-small {
+    min-height: 60vh;
+    max-height: 440px;
+} */
+body {
+    background: #f4f4f4;
+    background-color: white;
+}
+
+body {
+    /* margin: 3rem; */
+    font: 500 100%;
+    font-size: 16px;
+    line-height: 1.5;
+    color: rgb(0, 0, 0);
+}
+
+@media (max-width: 1024px) {
+    body {
+        margin: 0;
+        background: #f4f4f4;
+    }
+}
+
+@media (max-width: 411px) {
+    h5 {
+        margin-top: 30px
+    }
+}
+
+.img {
+    background-image: url(small.jpg);
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.description {
+    font: 500 100%;
+    font-size: 16px;
+}
+
+.card {
+    border-radius: 4px;
+    background: #fff;
+    box-shadow: 0 6px 10px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .05);
+    transition: .3s transform cubic-bezier(.155, 1.105, .295, 1.12), .3s box-shadow, .3s -webkit-transform cubic-bezier(.155, 1.105, .295, 1.12);
+}
+
+.section {
+    padding: 40px 0;
+}
+
+.title {
+    padding-top: 0px;
+}
+
+table,
+th,
+td {
+    border-collapse: collapse;
+}
+
+.test_text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    line-clamp: 2;
+    -webkit-box-orient: vertical;
+
+}
+
+span{
+    font-size: 14px;
+    color: #41474c;
+}
+
+.footer-bar{
+    background-color: white;
+    padding: 10px 0px;
+}
+
+.icon{
+    color:#41474c;
+}
+.my-image{
+	width:200px;
+  	height:200px;
+  	object-fit:cover;
+  	border-radius:50%;
+}
+.tag-lg {
+    font-size: .8em;
+    border-radius: 4px;
+}
+
+.tag-custom {
+    background: #ffffff;
+    color: #000;
+    border-style: solid;
+    border-width: 0.7px;
+}
+.tag{
+	display: inline-block;
+    border-radius: 3px;
+    padding: .0em .3em .0em;
+    border-radius: 2px;
+    font-weight: 400;
+    margin: .25em .1em
+}
+.image-detail {
+	object-fit: cover;
+	width: auto;
+	height: auto;
+	padding: 20px;
+	display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+.text-primary-custom {
+	color: #007bff !important
+}
+.form-control:focus {
+    border: 1px solid #767170;
+    box-shadow: none;
+    outline: 0!important;
+    color: #2c2c2c;
+}
+.card:hover {
+    transform: scale(1.02);
+    box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
+}
+
+</style>
+<?php $y = $_GET['y']; ?>
+<div class="wrapper">
+    <div class="container-fluid">
+        <div class="section section-about-us" style="padding: 0px">
+            <div class="content" style="padding: 20px">
+                <div class="container-fluid">
+					<div class="row">
+						<div class="col-2 position-relative">
+							<div class="form-group">
+								<label for="year" class="form-label">ปี</label>
+								<select name="year" class="form-control form-sm" id="year" onchange="get_project_2()">
+								</select>
+							</div>
+						</div>
+					</div>
+					<div id="project" class="row">
+					</div>
+				</div>
+            </div>
+        </div>
+    </div>
+</div> 
+<footer class="footer footer-default" >
+<div class="container" >
+	<div class="row">
+		<div class="col-md-5" >
+			<b style="font-size:16px;">คณะวิทยาการสารสนเทศ</b> <br>
+			<span>169 ถนนลงหาดบางแสน ตำบลแสนสุข</span><br>
+			<span>อำเภอเมือง จังหวัดชลบุรี 20131</span>
+		</div>
+		<div class="col-md-7 ml-auto" style="margin-top: 20px;">
+			<i class="fa fa-phone icon"></i>  <span>+66 (0)38-103061,+66 (0)38-10309</span>  <br>
+			<i class="fa fa-envelope icon"></i> <span>Email : pr@informatics.buu.ac.th </span> 
+		</div>
+    </div>
+</div>
+</div>
+</footer>
+<footer class="footer-bar">
+    <div class=" container ">
+        <div class="row justify-content-md-center">
+            <div class="col-md-12">
+                <div style="text-align: left;" data-mce-style="text-align: left;"><span style="font-size: 12px; font-family: Barlow_Regular0, Tahoma; color: rgb(157, 157, 157);" open="" sans="" color:="" rgb="" 157="" data-mce-style="font-size: 16px; font-family: Barlow_Regular0, Tahoma; color: #9d9d9d;">Copyright © 2018-2022 Faculty of Informatics, Burapha University. All rights reserved.</span></div>
+            </div>
+        </div>
+    </div>
+</footer>
+<script>
+	$(document).ready(function() {
+        get_project_2_year();
+    });
+
+    function get_project_2_year() {
+        $.ajax({
+            type: 'get',
+            url: "<?php echo site_url() . '/General/get_project_2_year'; ?>",
+            data: {
+
+            },
+            dataType: 'json',
+            success: function(data) {
+                console.log(data)
+                create_option_year(data.year)
+                get_project_2()
+            }
+        })
+    }
+
+    function get_project_2() {
+        let year = document.getElementById("year").value;
+        console.log(year);
+        $.ajax({
+            type: 'get',
+            url: "<?php echo site_url() . '/General/get_project_2'; ?>",
+            data: {
+                'year': year
+            },
+            dataType: 'json',
+            success: function(data) {
+                console.log(data)
+                create_project(data.project_2)
+            }
+        })
+    }
+
+    function create_option_year(data) {
+        let selectList = document.querySelector('#year')
+        data.forEach((row, index) => {
+            option = document.createElement("option")
+            option.setAttribute("value", row.year)
+            if (row.year == <?php echo $y ?>) {
+                option.setAttribute("selected", "selected")
+            }
+            const number = parseInt(row.year) + 543
+            option.text = number
+            selectList.appendChild(option)
+        })
+    }
+
+    function create_project(data) {
+        let html = '';
+        data.forEach((row, index) => {
+            html += '<div class="col-md-3 article-loop" >';
+			html += `<a href="<?php echo site_url().'/General/show_select/' ?>${row.project_id} style="color:black" class="custom-card ">`;
+			html += '<div class="card">';
+			html += '<img class="card-img-top" src="http://localhost/exhi//project/year_2023/y3/team3/image_cover_23-03-14.png" height="150px" style="object-fit: cover;" alt="Card image cap">';
+			html += '<div class="card-body">';
+			html += `<div><span><b>${row.name_th}</b></span></div>`;
+			html += `<span>บริษัท : </span><br>`;
+			html += `<span>มกุล : ${row.ct_name}</span><br>`;
+			html += '</div>';
+			html += '</div>';
+			html += '</a>';
+			html += '</div>';
+        })
+        document.getElementById('project').innerHTML = html;
+    }
+</script>
diff --git a/html/exhi/application/views/general/v_project_search_3.php b/html/exhi/application/views/general/v_project_search_3.php
new file mode 100644
index 0000000000000000000000000000000000000000..3a8bbad77bc88559838cc55e8968f79ede9ae6de
--- /dev/null
+++ b/html/exhi/application/views/general/v_project_search_3.php
@@ -0,0 +1,251 @@
+<style>
+/* .page-header.page-header-small {
+    min-height: 60vh;
+    max-height: 440px;
+} */
+body {
+    background: #f4f4f4;
+    background-color: white;
+}
+
+body {
+    /* margin: 3rem; */
+    font: 500 100%;
+    font-size: 16px;
+    line-height: 1.5;
+    color: rgb(0, 0, 0);
+}
+
+@media (max-width: 1024px) {
+    body {
+        margin: 0;
+        background: #f4f4f4;
+    }
+}
+
+@media (max-width: 411px) {
+    h5 {
+        margin-top: 30px
+    }
+}
+
+.img {
+    background-image: url(small.jpg);
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.description {
+    font: 500 100%;
+    font-size: 16px;
+}
+
+.card {
+    border-radius: 4px;
+    background: #fff;
+    box-shadow: 0 6px 10px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .05);
+    transition: .3s transform cubic-bezier(.155, 1.105, .295, 1.12), .3s box-shadow, .3s -webkit-transform cubic-bezier(.155, 1.105, .295, 1.12);
+}
+
+.section {
+    padding: 40px 0;
+}
+
+.title {
+    padding-top: 0px;
+}
+
+table,
+th,
+td {
+    border-collapse: collapse;
+}
+
+.test_text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    line-clamp: 2;
+    -webkit-box-orient: vertical;
+
+}
+
+span{
+    font-size: 14px;
+    color: #41474c;
+}
+
+.footer-bar{
+    background-color: white;
+    padding: 10px 0px;
+}
+
+.icon{
+    color:#41474c;
+}
+.my-image{
+	width:200px;
+  	height:200px;
+  	object-fit:cover;
+  	border-radius:50%;
+}
+.tag-lg {
+    font-size: .8em;
+    border-radius: 4px;
+}
+
+.tag-custom {
+    background: #ffffff;
+    color: #000;
+    border-style: solid;
+    border-width: 0.7px;
+}
+.tag{
+	display: inline-block;
+    border-radius: 3px;
+    padding: .0em .3em .0em;
+    border-radius: 2px;
+    font-weight: 400;
+    margin: .25em .1em
+}
+.image-detail {
+	object-fit: cover;
+	width: auto;
+	height: auto;
+	padding: 20px;
+	display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+.text-primary-custom {
+	color: #007bff !important
+}
+.form-control:focus {
+    border: 1px solid #767170;
+    box-shadow: none;
+    outline: 0!important;
+    color: #2c2c2c;
+}
+.card:hover {
+    transform: scale(1.02);
+    box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
+}
+
+</style>
+<?php $y = $_GET['y']; ?>
+<div class="wrapper">
+    <div class="container-fluid">
+        <div class="section section-about-us" style="padding: 0px">
+            <div class="content" style="padding: 20px">
+                <div class="container-fluid">
+					<div class="row">
+						<div class="col-2 position-relative">
+							<div class="form-group">
+								<label for="year" class="form-label">ปี</label>
+								<select name="year" class="form-control form-sm" id="year" onchange="get_project_2()">
+								</select>
+							</div>
+						</div>
+					</div>
+					<div id="project" class="row">
+					</div>
+				</div>
+            </div>
+        </div>
+    </div>
+</div> 
+<footer class="footer footer-default" >
+<div class="container" >
+	<div class="row">
+		<div class="col-md-5" >
+			<b style="font-size:16px;">คณะวิทยาการสารสนเทศ</b> <br>
+			<span>169 ถนนลงหาดบางแสน ตำบลแสนสุข</span><br>
+			<span>อำเภอเมือง จังหวัดชลบุรี 20131</span>
+		</div>
+		<div class="col-md-7 ml-auto" style="margin-top: 20px;">
+			<i class="fa fa-phone icon"></i>  <span>+66 (0)38-103061,+66 (0)38-10309</span>  <br>
+			<i class="fa fa-envelope icon"></i> <span>Email : pr@informatics.buu.ac.th </span> 
+		</div>
+    </div>
+</div>
+</div>
+</footer>
+<footer class="footer-bar">
+    <div class=" container ">
+        <div class="row justify-content-md-center">
+            <div class="col-md-12">
+                <div style="text-align: left;" data-mce-style="text-align: left;"><span style="font-size: 12px; font-family: Barlow_Regular0, Tahoma; color: rgb(157, 157, 157);" open="" sans="" color:="" rgb="" 157="" data-mce-style="font-size: 16px; font-family: Barlow_Regular0, Tahoma; color: #9d9d9d;">Copyright © 2018-2022 Faculty of Informatics, Burapha University. All rights reserved.</span></div>
+            </div>
+        </div>
+    </div>
+</footer>
+<script>
+	  $(document).ready(function() {
+        get_project_3_year();
+    });
+
+    function get_project_3_year() {
+        $.ajax({
+            type: 'get',
+            url: "<?php echo site_url() . '/General/get_project_3_year'; ?>",
+            data: {
+
+            },
+            dataType: 'json',
+            success: function(data) {
+                console.log(data)
+                create_option_year(data.year)
+                get_project_3()
+            }
+        })
+    }
+
+    function get_project_3() {
+        let year = document.getElementById("year").value;
+        console.log(year);
+        $.ajax({
+            type: 'get',
+            url: "<?php echo site_url() . '/General/get_project_3'; ?>",
+            data: {
+                'year': year
+            },
+            dataType: 'json',
+            success: function(data) {
+                console.log(data)
+                create_project(data.project_3)
+            }
+        })
+    }
+
+    function create_option_year(data) {
+        let selectList = document.querySelector('#year')
+        data.forEach((row, index) => {
+            option = document.createElement("option")
+            option.setAttribute("value", row.year)
+            const number = parseInt(row.year) + 543
+            option.text = number
+            selectList.appendChild(option)
+        })
+    }
+
+    function create_project(data) {
+        let html = '';
+        data.forEach((row, index) => {
+            html += '<div class="col-md-3 article-loop" >';
+			html += `<a href="<?php echo site_url().'/General/show_select/' ?>${row.project_id} style="color:black" class="custom-card ">`;
+			html += '<div class="card">';
+			html += '<img class="card-img-top" src="http://localhost/exhi//project/year_2023/y3/team3/image_cover_23-03-14.png" height="150px" style="object-fit: cover;" alt="Card image cap">';
+			html += '<div class="card-body">';
+			html += `<div><span><b>${row.name_th}</b></span></div>`;
+			html += `<span>อาจารย์ที่ปรึกษา : </span><br>`;
+			html += `<span>ทีม : ${row.t_name}</span><br>`;
+			html += '</div>';
+			html += '</div>';
+			html += '</a>';
+			html += '</div>';
+        })
+        document.getElementById('project').innerHTML = html;
+    }
+</script>
diff --git a/html/exhi/application/views/general/v_project_search_4.php b/html/exhi/application/views/general/v_project_search_4.php
new file mode 100644
index 0000000000000000000000000000000000000000..51ec1a031108ce839fbfe886f23843f91a66b232
--- /dev/null
+++ b/html/exhi/application/views/general/v_project_search_4.php
@@ -0,0 +1,341 @@
+<style>
+/* .page-header.page-header-small {
+    min-height: 60vh;
+    max-height: 440px;
+} */
+body {
+    background: #f4f4f4;
+    background-color: white;
+}
+
+body {
+    /* margin: 3rem; */
+    font: 500 100%;
+    font-size: 16px;
+    line-height: 1.5;
+    color: rgb(0, 0, 0);
+}
+
+@media (max-width: 1024px) {
+    body {
+        margin: 0;
+        background: #f4f4f4;
+    }
+}
+
+@media (max-width: 411px) {
+    h5 {
+        margin-top: 30px
+    }
+}
+
+.img {
+    background-image: url(small.jpg);
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.description {
+    font: 500 100%;
+    font-size: 16px;
+}
+
+.card {
+    border-radius: 4px;
+    background: #fff;
+    box-shadow: 0 6px 10px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .05);
+    transition: .3s transform cubic-bezier(.155, 1.105, .295, 1.12), .3s box-shadow, .3s -webkit-transform cubic-bezier(.155, 1.105, .295, 1.12);
+}
+
+.section {
+    padding: 40px 0;
+}
+
+.title {
+    padding-top: 0px;
+}
+
+table,
+th,
+td {
+    border-collapse: collapse;
+}
+
+.test_text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    line-clamp: 2;
+    -webkit-box-orient: vertical;
+
+}
+
+span{
+    font-size: 14px;
+    color: #41474c;
+}
+
+.footer-bar{
+    background-color: white;
+    padding: 10px 0px;
+}
+
+.icon{
+    color:#41474c;
+}
+.my-image{
+	width:200px;
+  	height:200px;
+  	object-fit:cover;
+  	border-radius:50%;
+}
+.tag-lg {
+    font-size: .8em;
+    border-radius: 4px;
+}
+
+.tag-custom {
+    background: #ffffff;
+    color: #000;
+    border-style: solid;
+    border-width: 0.7px;
+}
+.tag{
+	display: inline-block;
+    border-radius: 3px;
+    padding: .0em .3em .0em;
+    border-radius: 2px;
+    font-weight: 400;
+    margin: .25em .1em
+}
+.image-detail {
+	object-fit: cover;
+	width: auto;
+	height: auto;
+	padding: 20px;
+	display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+.text-primary-custom {
+	color: #007bff !important
+}
+.form-control:focus {
+    border: 1px solid #767170;
+    box-shadow: none;
+    outline: 0!important;
+    color: #2c2c2c;
+}
+.card:hover {
+    transform: scale(1.02);
+    box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
+}
+.notfound {
+	text-align: center;
+}
+</style>
+<?php $y = $_GET['y']; ?>
+<div class="wrapper">
+    <div class="container-fluid">
+        <div class="section section-about-us" style="padding: 0px">
+            <div class="content" style="padding: 20px">
+                <div class="container-fluid">
+					<div class="row">
+						<div class="col-2 position-relative">
+							<div class="form-group">
+								<label for="year" class="form-label">ปี</label>
+								<select name="year" class="form-control form-sm" id="year" onchange="get_project_2()">
+								</select>
+							</div>
+						</div>
+						<div class="col-2 position-relative">
+							<label for="limit" class="form-label">จำนวนต่อหน้า</label>
+							<select name="limit" id="limit" class="form-control form-sm" onchange="load_num_project(), reset_page(), load_data()">
+								<option value="10">10</option>
+								<option value="20">20</option>
+								<option value="50">50</option>
+								<option value="100">100</option>
+							</select>
+						</div>
+					</div>
+					<div id="project" class="row">
+					</div>
+					<nav aria-label="Page navigation">
+					<ul class="pagination" id="select-page">
+					</ul>
+       				</nav>
+				</div>
+            </div>
+        </div>
+    </div>
+</div> 
+<footer class="footer footer-default" >
+<div class="container" >
+	<div class="row">
+		<div class="col-md-5" >
+			<b style="font-size:16px;">คณะวิทยาการสารสนเทศ</b> <br>
+			<span>169 ถนนลงหาดบางแสน ตำบลแสนสุข</span><br>
+			<span>อำเภอเมือง จังหวัดชลบุรี 20131</span>
+		</div>
+		<div class="col-md-7 ml-auto" style="margin-top: 20px;">
+			<i class="fa fa-phone icon"></i>  <span>+66 (0)38-103061,+66 (0)38-10309</span>  <br>
+			<i class="fa fa-envelope icon"></i> <span>Email : pr@informatics.buu.ac.th </span> 
+		</div>
+    </div>
+</div>
+</div>
+</footer>
+<footer class="footer-bar">
+    <div class=" container ">
+        <div class="row justify-content-md-center">
+            <div class="col-md-12">
+                <div style="text-align: left;" data-mce-style="text-align: left;"><span style="font-size: 12px; font-family: Barlow_Regular0, Tahoma; color: rgb(157, 157, 157);" open="" sans="" color:="" rgb="" 157="" data-mce-style="font-size: 16px; font-family: Barlow_Regular0, Tahoma; color: #9d9d9d;">Copyright © 2018-2022 Faculty of Informatics, Burapha University. All rights reserved.</span></div>
+            </div>
+        </div>
+    </div>
+</footer>
+<script>
+	 $(document).ready(function() {
+        get_project_4_year();
+    });
+
+    function get_project_4_year() {
+        $.ajax({
+            type: 'get',
+            url: "<?php echo site_url() . '/General/get_project_4_year'; ?>",
+            data: {
+
+            },
+            dataType: 'json',
+            success: function(data) {
+                console.log(data)
+                create_option_year(data.year)
+                if (data.year != '') {
+                    load_data();
+                    load_num_project();
+                } else {
+                    let selectList = document.querySelector('#project')
+                    document.getElementById('project').innerHTML = "";
+                    selectList.setAttribute("class", "notfound")
+                    h2 = document.createElement("h2")
+                    h2.setAttribute("class", "notfound")
+                    const text = document.createTextNode('- ไม่พบข้อมูล -')
+                    h2.appendChild(text)
+                    selectList.appendChild(h2)
+                }
+
+            }
+        })
+    }
+
+    let current_page = 1;
+
+    function load_data() {
+        let year = document.getElementById("year").value;
+        let limit = document.getElementById("limit").value;
+        $.ajax({
+            type: "get",
+            url: "<?php echo site_url() . '/General/get_data_pagination' ?>",
+            data: {
+                'year': year,
+                'page': current_page,
+                'limit': limit
+            },
+            dataType: "json",
+            success: function(data) {
+                create_project(data.pagination)
+            }
+        });
+    }
+
+    function load_num_project() {
+        let year = document.getElementById("year").value;
+        let limit = document.getElementById("limit").value;
+        $.ajax({
+            type: "get",
+            url: "<?php echo site_url() . '/General/get_num_page' ?>",
+            data: {
+                'year': year,
+            },
+            dataType: "json",
+            success: function(data) {
+                console.log(data)
+                let num = Math.ceil(data.num[0].num_project / limit);
+                create_page_select(num);
+            }
+        });
+    }
+
+    function reset_page() {
+        current_page = 1;
+    }
+
+    function set_page(page) {
+        current_page = page;
+        console.log('page' + page);
+        load_data();
+    }
+
+    function previous_page() {
+        if (current_page > 1) {
+            current_page--;
+            console.log('page' + current_page);
+            load_data();
+        }
+    }
+
+    function next_page(maxPage) {
+        if (current_page < maxPage) {
+            current_page++;
+            console.log('page' + current_page);
+            load_data();
+        }
+    }
+
+    function create_option_year(data) {
+        let selectList = document.querySelector('#year')
+        data.forEach((row, index) => {
+            option = document.createElement("option")
+            option.setAttribute("value", row.year)
+            if (row.year == <?php echo $y ?>) {
+                option.setAttribute("selected", "selected")
+            }
+            const number = parseInt(row.year) + 543
+            option.text = number
+            selectList.appendChild(option)
+        })
+    }
+    function create_project(data) {
+        let html = '';
+        data.forEach((row, index) => {
+			console.log(row)
+            html += '<div class="col-md-3 article-loop" >';
+			html += `<a href="<?php echo site_url().'/General/show_select/' ?>${row.project_id} style="color:black" class="custom-card ">`;
+			html += '<div class="card">';
+			html += '<img class="card-img-top" src="http://localhost/exhi//project/year_2023/y3/team3/image_cover_23-03-14.png" height="150px" style="object-fit: cover;" alt="Card image cap">';
+			html += '<div class="card-body">';
+			html += `<div><span><b>${row.name_th}</b></span></div>`;
+			html += `<span>บริษัท : </span><br>`;
+			html += `<span>ทีม : ${row.ct_name}</span><br>`;
+			html += '</div>';
+			html += '</div>';
+			html += '</a>';
+			html += '</div>';
+        })
+        document.getElementById('project').innerHTML = html;
+    }
+
+	function create_page_select(data) {
+        let html = '';
+        html += `<li><button class="page-link" onclick="previous_page()">ก่อนหน้า</button></li>`;
+        for (i = 0; i < data; i++) {
+            let page = i + 1;
+            console.log('i' + i);
+            html += `<li><button class="page-link" onclick="set_page(` + page + `)">` + page + `</button></li>`;
+        }
+        html += `<li><button class="page-link" onclick="next_page(` + data + `)">ถัดไป</button></li>`;
+        document.getElementById('select-page').innerHTML = html;
+    }
+</script>