Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <?php
- $hostname='server67.0hosting.me';
- $username='u8462856_test';
- $password='koloiko555';
- $database='u8462856_test';
- $con=mysqli_connect($hostname,$username,$password,$database) or die(mysqli_error());
- mysql_query("SET NAMES 'utf8");
- mysql_query("SET CHARACTER SET 'utf8'");
- ?>
- <!DOCTYPE html>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>A fancy add,edit,delete ajax paginated mysql table</title>
- <link rel="stylesheet" type="text/css" href="http://triass.ru/view/style.css" />
- <script src="http://triass.ru/view/jquery.js"></script>
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
- <script type="text/javascript" src="pagination.js"></script>
- <link rel="stylesheet" type="text/css" href="http://triass.ru/view/css/normalize.css" />
- <link rel="stylesheet" type="text/css" href="http://triass.ru/view/css/component.css" />
- <link rel="stylesheet" type="text/css" href="http://triass.ru/view/css/content.css" />
- <script src="http://triass.ru/view/js/modernizr.custom.js"></script>
- </head>
- <body>
- <div id="formDiv">
- <form id="formSearch" >
- Search by Name <input type="text" id="fieldSearch" name="search_text" >
- <input type="submit" value="Search">
- </form>
- <div id="divLoading"></div>
- <div id="selectDiv">
- <small>
- <select id="pageRecord">
- <option value="1">1</option>
- <option value="2">2</option>
- <option selected value="3">3</option>
- <option value="4">4</option>
- </select><i> Record per Page</i>
- </small>
- </div>
- </div>
- <div id="divPageData"></div>
- </body>
- </html>
- <?php
- /*
- Developed by Reneesh T.K
- reneeshtk@gmail.com
- You can use it with out any worries...It is free for you..It will display the out put like:
- First | Previous | 3 | 4 | 5 | 6 | 7| 8 | 9 | 10 | Next | Last
- Page : 7 Of 10 . Total Records Found: 20
- */
- class Pagination_class{
- var $result;
- var $anchors;
- var $total;
- function Pagination_class($qry,$starting,$recpage)
- {
- include('connect.php');
- $rst = mysqli_query($con,$qry) or die(mysqli_error());
- $numrows = mysqli_num_rows($rst);
- $qry .= " limit $starting, $recpage";
- $this->result = mysqli_query($con,$qry) or die(mysqli_error());
- $next = $starting+$recpage;
- $var = ((intval($numrows/$recpage))-1)*$recpage;
- $page_showing = intval($starting/$recpage)+1;
- $total_page = ceil($numrows/$recpage);
- if($numrows % $recpage != 0){
- $last = ((intval($numrows/$recpage)))*$recpage;
- }else{
- $last = ((intval($numrows/$recpage))-1)*$recpage;
- }
- $previous = $starting-$recpage;
- $anc = "<ul id='pagination-flickr'>";
- if($previous < 0){
- $anc .= "<li class='previous-off'>First</li>";
- $anc .= "<li class='previous-off'>Previous</li>";
- }else{
- $anc .= "<li class='next'><a href='javascript:pagination(0);'>First </a></li>";
- $anc .= "<li class='next'><a href='javascript:pagination($previous);'>Previous </a></li>";
- }
- ################If you dont want the numbers just comment this block###############
- $norepeat = 4;//no of pages showing in the left and right side of the current page in the anchors
- $j = 1;
- $anch = "";
- for($i=$page_showing; $i>1; $i--){
- $fpreviousPage = $i-1;
- $page = ceil($fpreviousPage*$recpage)-$recpage;
- $anch = "<li><a href='javascript:pagination($page);'>$fpreviousPage </a></li>".$anch;
- if($j == $norepeat) break;
- $j++;
- }
- $anc .= $anch;
- $anc .= "<li class='active'>".$page_showing."</li>";
- $j = 1;
- for($i=$page_showing; $i<$total_page; $i++){
- $fnextPage = $i+1;
- $page = ceil($fnextPage*$recpage)-$recpage;
- $anc .= "<li><a href='javascript:pagination($page);'>$fnextPage</a></li>";
- if($j==$norepeat) break;
- $j++;
- }
- ############################################################
- if($next >= $numrows){
- $anc .= "<li class='previous-off'>Next</li>";
- $anc .= "<li class='previous-off'>Last</li>";
- }else{
- $anc .= "<li class='next'><a href='javascript:pagination($next);'>Next </a></li>";
- $anc .= "<li class='next'><a href='javascript:pagination($last);'>Last</a></li>";
- }
- $anc .= "</ul>";
- $this->anchors = $anc;
- $this->total = "Page : $page_showing <i> Of </i> $total_page . Total Records Found: $numrows";
- }
- }
- ?>
- <?php
- include('connect.php');
- mysql_query("SET NAMES 'utf8");
- mysql_query("SET CHARACTER SET 'utf8'");
- if(isset($_POST['action']) && $_POST['action']=="add") //menangani aksi penambahan data pelanggan
- {
- $name=$_POST['add_name'];
- $address=$_POST['add_address'];
- $exam_no=$_POST['add_exam_no']; $pattern="/^[A-Z]{2}d{4}b/";
- if(($name=="")||($address == "")||($exam_no == "")){
- echo '{"status":"1"}';
- exit;
- }
- else if( !preg_match($pattern,$exam_no)){
- echo '{"status":"2"}';
- exit;
- }else{
- $test=mysqli_query($con,"INSERT INTO students(name,address,exam_no) VALUES('$name','$address','$exam_no')") or die ("data gagal ditambahakan!");
- echo '{"status":"3"}';
- exit;
- }
- }
- elseif(isset($_POST['action'])&& $_POST['action']=="update") //menangani aksi perubahan data pelanggan
- {
- $id=$_POST['edit_id'];
- $name=$_POST['edit_name'];
- $address=$_POST['edit_address'];
- $exam_no=$_POST['edit_exam_no'];
- $test = mysqli_query($con,"UPDATE students SET name='$name',address='$address',exam_no='$exam_no' WHERE id='$id'") or die ("data gagal di-update!");
- echo '{"status":"3"}';
- exit;
- }
- elseif(isset($_POST['action']) && $_POST['action']=="delete") //menangani aksi penghapusan data pelanggan
- {
- $id = $_POST['delete_id'];
- $test = mysqli_query($con,"delete from students where id='$id'");
- if(mysqli_affected_rows($con) == 1){ //jika jumlah baris data yang dikenai operasi delete == 1
- echo '{"status":"1"}';
- }else{
- echo '{"status":"0"}';
- }
- exit;
- }
- ?>
- <script>
- function pagination(page){
- var search = $("input#fieldSearch").val();
- var record = $("select#pageRecord").val();
- if (search!==""){
- dataString = 'starting='+page+'&name='+search+'&perpage='+ record+'&random='+Math.random();
- }
- else{
- dataString = 'starting='+page+'&perpage='+record+'&random='+Math.random();
- }
- $.ajax({
- url:"tablepage.php",
- data: dataString,
- type:"GET",
- success:function(data)
- {
- $('#divPageData').html(data);
- }
- });
- }
- function loadData(){
- var dataString;
- var search = $("input#fieldSearch").val();
- var record = $("select#pageRecord").val();
- dataString = 'name='+ search + '&perpage=' + record;
- $.ajax({
- url: "tablepage.php",
- type: "GET",
- data: dataString,
- success:function(data)
- {
- $('#divPageData').html(data);
- }
- });
- }
- $('#students tr:even:not(#nav):not(#total)').addClass('even');
- $('#students tr:odd:not(#nav):not(#total)').addClass('odd')
- $("form#form1").submit(function(){
- var vId = $("input#edit_id").val();
- var vName = $("input#edit_name").val();
- var vAddress = $("input#edit_address").val();
- var vExam = $("input#edit_exam_no").val();
- var myRegExp=/^[A-Z]{2}d{4}b/;
- if ((vName=="")||(vAddress == "")||(vExam == "")){
- alert("Please complete the missing field(s)");
- $("input#edit_name").focus();
- return false;
- }
- else if( !myRegExp.test(vExam)){
- alert ('Invalid Format for Exam No.');
- $("input#edit_exam_no").focus();
- return false;
- }
- else{
- $.ajax({
- url: "process_data.php",
- type:$(this).attr("method"),
- data:$(this).serialize(),
- dataType: 'json',
- success:function(response){
- if(response.status == 3) // return nilai dari hasil proses
- {
- alert("Data Successfully Updated");
- $(".morph-content").hide(2000);
- loadData();
- }
- else if(response.status==1)
- {
- alert("Please complete the missing field(s)");
- $("input#add_name").focus();
- }
- else if(response.status==2)
- {
- alert("Invalid Format for Exam No.");
- $("input#add_exam_no").focus();
- }
- else
- {
- alert("Data update unsccessful");
- }
- }
- });
- return false;
- }
- return false;
- });
- $("form#form2").submit(function(){
- $.ajax({
- url: "process_data.php",
- type:$(this).attr("method"),
- data:$(this).serialize(),
- dataType: 'json',
- success:function(response){
- if(response.status == 1) // return nilai dari hasil proses
- {
- alert("Data Successfully Delected");
- $(".morph-content").hide(2000);
- loadData();
- }
- else
- {
- alert("Data Failed to Delete");
- }
- }
- });
- return false;
- });
- </script>
- <script src="http://triass.ru/view/js/modernizr.custom.js"></script>
- <script src="http://triass.ru/view/js/classie.js"></script>
- <script src="http://triass.ru/view/js/uiMorphingButton_fixed.js"></script>
- <script src="http://triass.ru/view/js/buttonMorp.js"></script>
- <?php
- error_reporting(E_ALL^E_NOTICE);
- include('pagination_class.php');
- include('connect.php');
- if (isset($_GET['name']) and !empty($_GET['name'])){
- $name = $_GET['name'];
- $sql = "select * from students where name like '%$name%'";
- }
- else{
- $sql = "select * from students order by id";
- }
- if(isset($_GET['starting'])){ //starting page
- $starting=$_GET['starting'];
- }else{
- $starting=0;
- }
- $recpage=$_GET['perpage'];
- $obj = new pagination_class($sql,$starting,$recpage);
- $result = $obj->result;
- ?>
- <div id="page_contents">
- <div id="addDiv">
- <div class="morph-button morph-button-modal morph-button-modal-2 morph-button-fixed">
- <button type="button">ADD</button>
- <div class="morph-content">
- <div>
- <div class="content-style-form content-style-form-1">
- <span class="icon icon-close">Close the dialog</span>
- <h2>Add Data</h2>
- <form id="form1" method="post" >
- <p><label>Name</label><input type="text" id="add_name" name="add_name" /></p>
- <p><label>Address</label><input type="text" id="add_address" name="add_address" /> </p>
- <p><label>Exam No. (format: AA000)</label><input type="text" id="add_exam_no" name="add_exam_no" /></p>
- <p><input type="submit" value="Add" /></p>
- <input type="hidden" id="action" name="action" value="add" />
- </form>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div id="student_wrap">
- <table id="students" width="100%" >
- <tr><th>Sl No</th><th>Student Name</th><th>Address</th><th>Exam No.</th><th style="padding-left:19px;">Action</th>
- </tr>
- <?php if(mysqli_num_rows($result)!=0){
- $counter = $starting + 1;
- while($data = mysqli_fetch_array($result)) {?>
- <tbody><tr>
- <td><?php echo $data['id']; ?></td>
- <td><?php echo $data['name']; ?></td>
- <td><?php echo $data['address']; ?></td>
- <td><?php echo $data['exam_no']; ?></td>
- <td>
- <div class="morph-button morph-button-modal morph-button-modal-2 morph-button-fixed">
- <button type="button">Edit</button>
- <div class="morph-content">
- <div>
- <div class="content-style-form content-style-form-1">
- <span class="icon icon-close">Close the dialog</span>
- <h2>Update Data</h2>
- <form id="form1" method="post" >
- <p><label>ID</label><input type="text" id="edit_id" name="edit_id" value="<?php echo $data['id']; ?>" readonly /></p>
- <p><label>Name</label><input type="text" id="edit_name" name="edit_name" value="<?php echo $data['name']; ?>" /></p>
- <p><label>Address</label><input type="text" id="edit_address" name="edit_address" value="<?php echo $data['address']; ?>" /></p>
- <p><label>Exam No. (format: AA000)</label><input type="text" id="edit_exam_no" name="edit_exam_no" value="<?php echo $data['exam_no']; ?>" /></p>
- <p><input type="submit" value="Update" /></p>
- <input type="hidden" name="action" value="update" />
- </form>
- </div>
- </div>
- </div>
- </div>
- <div class="morph-button morph-button-modal morph-button-modal-2 morph-button-fixed">
- <button type="button">Delete</button>
- <div class="morph-content">
- <div>
- <div class="content-style-form content-style-form-1">
- <span class="icon icon-close">Close the dialog</span>
- <h2>Delete Data</h2>
- <p ><h2 style="margin:10px 10px;">Do you really want to delete from "demo" where SL No="<?php echo $data['id']; ?>" </h2></p>
- <form id="form2" method="post" >
- <p><input type="hidden" name="delete_id" value="<?php echo $data['id']; ?>" /></p>
- <p><input type="submit" value="Delete" /></p>
- <input type="hidden" name="action" value="delete" />
- </form>
- </div>
- </div>
- </div>
- </div>
- </td>
- </tr></tbody> <?php } ?>
- <tfoot><tr id="nav"><td colspan="5"><div><?php echo $obj->anchors; ?></div></td>
- </tr>
- <tr id="total"><td colspan="5"><?php echo $obj->total; ?></td>
- </tr>
- <?php } else{ ?>
- <tr><td align="center" colspan="5">No Data Found</td>
- </tr></tfoot>
- <?php } ?>
- </table>
- </div>
- </div>
- CREATE TABLE IF NOT EXISTS `students` (
- `id` int(11) NOT NULL AUTO_INCREMENT,
- `name` varchar(25) NOT NULL,
- `address` varchar(50) NOT NULL,
- `exam_no` varchar(15) NOT NULL,
- PRIMARY KEY (`id`)
- ) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=17 ;
- $.ajax({
- url: "tablepage.php",
- type: "GET",
- data: dataString,
- scriptCharset: "utf-8",
- success: .....
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement