Advertisement
Guest User

Untitled

a guest
Apr 11th, 2016
87
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.57 KB | None | 0 0
  1. <?php
  2. $hostname='server67.0hosting.me';
  3. $username='u8462856_test';
  4. $password='koloiko555';
  5. $database='u8462856_test';
  6.  
  7. $con=mysqli_connect($hostname,$username,$password,$database) or die(mysqli_error());
  8. mysql_query("SET NAMES 'utf8");
  9. mysql_query("SET CHARACTER SET 'utf8'");
  10. ?>
  11.  
  12. <!DOCTYPE html>
  13. <html>
  14. <head>
  15. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  16. <title>A fancy add,edit,delete ajax paginated mysql table</title>
  17. <link rel="stylesheet" type="text/css" href="http://triass.ru/view/style.css" />
  18. <script src="http://triass.ru/view/jquery.js"></script>
  19. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
  20. <script type="text/javascript" src="pagination.js"></script>
  21. <link rel="stylesheet" type="text/css" href="http://triass.ru/view/css/normalize.css" />
  22. <link rel="stylesheet" type="text/css" href="http://triass.ru/view/css/component.css" />
  23. <link rel="stylesheet" type="text/css" href="http://triass.ru/view/css/content.css" />
  24. <script src="http://triass.ru/view/js/modernizr.custom.js"></script>
  25.  
  26. </head>
  27.  
  28. <body>
  29. <div id="formDiv">
  30. <form id="formSearch" >
  31. Search by Name <input type="text" id="fieldSearch" name="search_text" >
  32. <input type="submit" value="Search">
  33. </form>
  34. <div id="divLoading"></div>
  35. <div id="selectDiv">
  36. <small>
  37. <select id="pageRecord">
  38. <option value="1">1</option>
  39. <option value="2">2</option>
  40. <option selected value="3">3</option>
  41. <option value="4">4</option>
  42. </select><i> Record per Page</i>
  43. </small>
  44. </div>
  45. </div>
  46.  
  47. <div id="divPageData"></div>
  48. </body>
  49. </html>
  50.  
  51. <?php
  52.  
  53.  
  54. /*
  55. Developed by Reneesh T.K
  56. reneeshtk@gmail.com
  57. You can use it with out any worries...It is free for you..It will display the out put like:
  58. First | Previous | 3 | 4 | 5 | 6 | 7| 8 | 9 | 10 | Next | Last
  59. Page : 7 Of 10 . Total Records Found: 20
  60. */
  61. class Pagination_class{
  62. var $result;
  63. var $anchors;
  64. var $total;
  65. function Pagination_class($qry,$starting,$recpage)
  66. {
  67. include('connect.php');
  68. $rst = mysqli_query($con,$qry) or die(mysqli_error());
  69. $numrows = mysqli_num_rows($rst);
  70. $qry .= " limit $starting, $recpage";
  71. $this->result = mysqli_query($con,$qry) or die(mysqli_error());
  72. $next = $starting+$recpage;
  73. $var = ((intval($numrows/$recpage))-1)*$recpage;
  74. $page_showing = intval($starting/$recpage)+1;
  75. $total_page = ceil($numrows/$recpage);
  76.  
  77. if($numrows % $recpage != 0){
  78. $last = ((intval($numrows/$recpage)))*$recpage;
  79. }else{
  80. $last = ((intval($numrows/$recpage))-1)*$recpage;
  81. }
  82. $previous = $starting-$recpage;
  83. $anc = "<ul id='pagination-flickr'>";
  84. if($previous < 0){
  85. $anc .= "<li class='previous-off'>First</li>";
  86. $anc .= "<li class='previous-off'>Previous</li>";
  87. }else{
  88. $anc .= "<li class='next'><a href='javascript:pagination(0);'>First </a></li>";
  89. $anc .= "<li class='next'><a href='javascript:pagination($previous);'>Previous </a></li>";
  90. }
  91.  
  92. ################If you dont want the numbers just comment this block###############
  93. $norepeat = 4;//no of pages showing in the left and right side of the current page in the anchors
  94. $j = 1;
  95. $anch = "";
  96. for($i=$page_showing; $i>1; $i--){
  97. $fpreviousPage = $i-1;
  98. $page = ceil($fpreviousPage*$recpage)-$recpage;
  99. $anch = "<li><a href='javascript:pagination($page);'>$fpreviousPage </a></li>".$anch;
  100. if($j == $norepeat) break;
  101. $j++;
  102. }
  103. $anc .= $anch;
  104. $anc .= "<li class='active'>".$page_showing."</li>";
  105. $j = 1;
  106. for($i=$page_showing; $i<$total_page; $i++){
  107. $fnextPage = $i+1;
  108. $page = ceil($fnextPage*$recpage)-$recpage;
  109. $anc .= "<li><a href='javascript:pagination($page);'>$fnextPage</a></li>";
  110. if($j==$norepeat) break;
  111. $j++;
  112. }
  113. ############################################################
  114. if($next >= $numrows){
  115. $anc .= "<li class='previous-off'>Next</li>";
  116. $anc .= "<li class='previous-off'>Last</li>";
  117. }else{
  118. $anc .= "<li class='next'><a href='javascript:pagination($next);'>Next </a></li>";
  119. $anc .= "<li class='next'><a href='javascript:pagination($last);'>Last</a></li>";
  120. }
  121. $anc .= "</ul>";
  122. $this->anchors = $anc;
  123.  
  124. $this->total = "Page : $page_showing <i> Of </i> $total_page . Total Records Found: $numrows";
  125. }
  126. }
  127. ?>
  128.  
  129. <?php
  130. include('connect.php');
  131. mysql_query("SET NAMES 'utf8");
  132. mysql_query("SET CHARACTER SET 'utf8'");
  133. if(isset($_POST['action']) && $_POST['action']=="add") //menangani aksi penambahan data pelanggan
  134. {
  135.  
  136. $name=$_POST['add_name'];
  137. $address=$_POST['add_address'];
  138. $exam_no=$_POST['add_exam_no']; $pattern="/^[A-Z]{2}d{4}b/";
  139. if(($name=="")||($address == "")||($exam_no == "")){
  140. echo '{"status":"1"}';
  141. exit;
  142. }
  143. else if( !preg_match($pattern,$exam_no)){
  144. echo '{"status":"2"}';
  145. exit;
  146. }else{
  147.  
  148. $test=mysqli_query($con,"INSERT INTO students(name,address,exam_no) VALUES('$name','$address','$exam_no')") or die ("data gagal ditambahakan!");
  149.  
  150. echo '{"status":"3"}';
  151. exit;
  152. }
  153. }
  154.  
  155. elseif(isset($_POST['action'])&& $_POST['action']=="update") //menangani aksi perubahan data pelanggan
  156. {
  157.  
  158.  
  159. $id=$_POST['edit_id'];
  160. $name=$_POST['edit_name'];
  161. $address=$_POST['edit_address'];
  162. $exam_no=$_POST['edit_exam_no'];
  163.  
  164. $test = mysqli_query($con,"UPDATE students SET name='$name',address='$address',exam_no='$exam_no' WHERE id='$id'") or die ("data gagal di-update!");
  165. echo '{"status":"3"}';
  166. exit;
  167. }
  168. elseif(isset($_POST['action']) && $_POST['action']=="delete") //menangani aksi penghapusan data pelanggan
  169. {
  170.  
  171. $id = $_POST['delete_id'];
  172. $test = mysqli_query($con,"delete from students where id='$id'");
  173. if(mysqli_affected_rows($con) == 1){ //jika jumlah baris data yang dikenai operasi delete == 1
  174. echo '{"status":"1"}';
  175. }else{
  176. echo '{"status":"0"}';
  177. }
  178. exit;
  179. }
  180. ?>
  181.  
  182. <script>
  183. function pagination(page){
  184. var search = $("input#fieldSearch").val();
  185. var record = $("select#pageRecord").val();
  186. if (search!==""){
  187. dataString = 'starting='+page+'&name='+search+'&perpage='+ record+'&random='+Math.random();
  188. }
  189.  
  190. else{
  191. dataString = 'starting='+page+'&perpage='+record+'&random='+Math.random();
  192. }
  193.  
  194. $.ajax({
  195. url:"tablepage.php",
  196. data: dataString,
  197. type:"GET",
  198. success:function(data)
  199. {
  200. $('#divPageData').html(data);
  201. }
  202. });
  203. }
  204.  
  205. function loadData(){
  206. var dataString;
  207. var search = $("input#fieldSearch").val();
  208. var record = $("select#pageRecord").val();
  209. dataString = 'name='+ search + '&perpage=' + record;
  210.  
  211. $.ajax({
  212. url: "tablepage.php",
  213. type: "GET",
  214. data: dataString,
  215. success:function(data)
  216. {
  217. $('#divPageData').html(data);
  218. }
  219. });
  220. }
  221.  
  222.  
  223.  
  224. $('#students tr:even:not(#nav):not(#total)').addClass('even');
  225. $('#students tr:odd:not(#nav):not(#total)').addClass('odd')
  226. $("form#form1").submit(function(){
  227. var vId = $("input#edit_id").val();
  228. var vName = $("input#edit_name").val();
  229. var vAddress = $("input#edit_address").val();
  230. var vExam = $("input#edit_exam_no").val();
  231. var myRegExp=/^[A-Z]{2}d{4}b/;
  232.  
  233.  
  234. if ((vName=="")||(vAddress == "")||(vExam == "")){
  235. alert("Please complete the missing field(s)");
  236. $("input#edit_name").focus();
  237. return false;
  238. }
  239. else if( !myRegExp.test(vExam)){
  240. alert ('Invalid Format for Exam No.');
  241. $("input#edit_exam_no").focus();
  242. return false;
  243. }
  244. else{
  245. $.ajax({
  246. url: "process_data.php",
  247. type:$(this).attr("method"),
  248. data:$(this).serialize(),
  249. dataType: 'json',
  250. success:function(response){
  251. if(response.status == 3) // return nilai dari hasil proses
  252. {
  253. alert("Data Successfully Updated");
  254.  
  255. $(".morph-content").hide(2000);
  256.  
  257. loadData();
  258. }
  259. else if(response.status==1)
  260. {
  261. alert("Please complete the missing field(s)");
  262. $("input#add_name").focus();
  263. }
  264. else if(response.status==2)
  265. {
  266. alert("Invalid Format for Exam No.");
  267. $("input#add_exam_no").focus();
  268. }
  269.  
  270. else
  271. {
  272. alert("Data update unsccessful");
  273. }
  274. }
  275. });
  276. return false;
  277. }
  278. return false;
  279. });
  280.  
  281.  
  282. $("form#form2").submit(function(){
  283.  
  284. $.ajax({
  285. url: "process_data.php",
  286. type:$(this).attr("method"),
  287. data:$(this).serialize(),
  288. dataType: 'json',
  289. success:function(response){
  290. if(response.status == 1) // return nilai dari hasil proses
  291. {
  292. alert("Data Successfully Delected");
  293.  
  294. $(".morph-content").hide(2000);
  295.  
  296. loadData();
  297. }
  298. else
  299. {
  300. alert("Data Failed to Delete");
  301. }
  302. }
  303. });
  304. return false;
  305.  
  306.  
  307. });
  308. </script>
  309. <script src="http://triass.ru/view/js/modernizr.custom.js"></script>
  310. <script src="http://triass.ru/view/js/classie.js"></script>
  311. <script src="http://triass.ru/view/js/uiMorphingButton_fixed.js"></script>
  312. <script src="http://triass.ru/view/js/buttonMorp.js"></script>
  313.  
  314.  
  315. <?php
  316. error_reporting(E_ALL^E_NOTICE);
  317. include('pagination_class.php');
  318. include('connect.php');
  319.  
  320. if (isset($_GET['name']) and !empty($_GET['name'])){
  321. $name = $_GET['name'];
  322. $sql = "select * from students where name like '%$name%'";
  323. }
  324. else{
  325. $sql = "select * from students order by id";
  326. }
  327.  
  328. if(isset($_GET['starting'])){ //starting page
  329. $starting=$_GET['starting'];
  330. }else{
  331. $starting=0;
  332. }
  333.  
  334. $recpage=$_GET['perpage'];
  335.  
  336. $obj = new pagination_class($sql,$starting,$recpage);
  337. $result = $obj->result;
  338. ?>
  339. <div id="page_contents">
  340.  
  341. <div id="addDiv">
  342. <div class="morph-button morph-button-modal morph-button-modal-2 morph-button-fixed">
  343. <button type="button">ADD</button>
  344. <div class="morph-content">
  345. <div>
  346. <div class="content-style-form content-style-form-1">
  347. <span class="icon icon-close">Close the dialog</span>
  348. <h2>Add Data</h2>
  349. <form id="form1" method="post" >
  350. <p><label>Name</label><input type="text" id="add_name" name="add_name" /></p>
  351. <p><label>Address</label><input type="text" id="add_address" name="add_address" /> </p>
  352. <p><label>Exam No. (format: AA000)</label><input type="text" id="add_exam_no" name="add_exam_no" /></p>
  353. <p><input type="submit" value="Add" /></p>
  354. <input type="hidden" id="action" name="action" value="add" />
  355. </form>
  356. </div>
  357. </div>
  358. </div>
  359. </div>
  360. </div>
  361.  
  362. <div id="student_wrap">
  363. <table id="students" width="100%" >
  364. <tr><th>Sl No</th><th>Student Name</th><th>Address</th><th>Exam No.</th><th style="padding-left:19px;">Action</th>
  365. </tr>
  366. <?php if(mysqli_num_rows($result)!=0){
  367. $counter = $starting + 1;
  368. while($data = mysqli_fetch_array($result)) {?>
  369. <tbody><tr>
  370. <td><?php echo $data['id']; ?></td>
  371. <td><?php echo $data['name']; ?></td>
  372. <td><?php echo $data['address']; ?></td>
  373. <td><?php echo $data['exam_no']; ?></td>
  374. <td>
  375. <div class="morph-button morph-button-modal morph-button-modal-2 morph-button-fixed">
  376. <button type="button">Edit</button>
  377. <div class="morph-content">
  378. <div>
  379. <div class="content-style-form content-style-form-1">
  380. <span class="icon icon-close">Close the dialog</span>
  381. <h2>Update Data</h2>
  382. <form id="form1" method="post" >
  383. <p><label>ID</label><input type="text" id="edit_id" name="edit_id" value="<?php echo $data['id']; ?>" readonly /></p>
  384. <p><label>Name</label><input type="text" id="edit_name" name="edit_name" value="<?php echo $data['name']; ?>" /></p>
  385. <p><label>Address</label><input type="text" id="edit_address" name="edit_address" value="<?php echo $data['address']; ?>" /></p>
  386. <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>
  387. <p><input type="submit" value="Update" /></p>
  388. <input type="hidden" name="action" value="update" />
  389. </form>
  390. </div>
  391. </div>
  392. </div>
  393. </div>
  394. <div class="morph-button morph-button-modal morph-button-modal-2 morph-button-fixed">
  395. <button type="button">Delete</button>
  396. <div class="morph-content">
  397. <div>
  398. <div class="content-style-form content-style-form-1">
  399. <span class="icon icon-close">Close the dialog</span>
  400. <h2>Delete Data</h2>
  401. <p ><h2 style="margin:10px 10px;">Do you really want to delete from "demo" where SL No="<?php echo $data['id']; ?>" </h2></p>
  402. <form id="form2" method="post" >
  403. <p><input type="hidden" name="delete_id" value="<?php echo $data['id']; ?>" /></p>
  404. <p><input type="submit" value="Delete" /></p>
  405. <input type="hidden" name="action" value="delete" />
  406. </form>
  407. </div>
  408. </div>
  409. </div>
  410. </div>
  411. </td>
  412.  
  413.  
  414. </tr></tbody> <?php } ?>
  415.  
  416. <tfoot><tr id="nav"><td colspan="5"><div><?php echo $obj->anchors; ?></div></td>
  417. </tr>
  418. <tr id="total"><td colspan="5"><?php echo $obj->total; ?></td>
  419. </tr>
  420. <?php } else{ ?>
  421. <tr><td align="center" colspan="5">No Data Found</td>
  422. </tr></tfoot>
  423. <?php } ?>
  424.  
  425. </table>
  426. </div>
  427. </div>
  428.  
  429. CREATE TABLE IF NOT EXISTS `students` (
  430. `id` int(11) NOT NULL AUTO_INCREMENT,
  431. `name` varchar(25) NOT NULL,
  432. `address` varchar(50) NOT NULL,
  433. `exam_no` varchar(15) NOT NULL,
  434. PRIMARY KEY (`id`)
  435. ) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=17 ;
  436.  
  437. $.ajax({
  438. url: "tablepage.php",
  439. type: "GET",
  440. data: dataString,
  441. scriptCharset: "utf-8",
  442. success: .....
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement