yassmin

Untitled

Apr 22nd, 2016
86
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 22.08 KB | None | 0 0
  1. <!douctype html>
  2. <html>
  3. <head>
  4. <script src="jquery.js"></script>
  5. <script src="jquery-1.9.1.js"></script>
  6. <script src="jquery-ui.js"></script>
  7. <script src="js/bootstrap.min.js"></script>
  8. <meta name="viewport" content="width=device-width, initial-scale=1">
  9. <link rel="stylesheet" href="css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  10. <link rel="stylesheet" href="css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
  11. <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  12. <style >
  13. #flip {
  14. text-align: center;
  15. font-size: 90%;
  16. font-weight: bold;
  17. background-color: #e5eecc;
  18. border: solid 1px #c3c3c3;
  19.  
  20. }
  21. #panel{
  22. text-align: left;
  23. font-size: 90%;
  24. font-weight: bold;
  25. background-color: #e5eecc;
  26. border: solid 1px #c3c3c3;
  27. }
  28.  
  29. #panel {
  30. display: none;
  31. }
  32. .buttonadd{
  33. background-color: rgb(53, 0, 254);
  34. width: 13%;
  35. border: 1px solid #c3c3c3;
  36. position:absolute;
  37. text-align-last: center;
  38. text-rendering: optimizeLegibility;
  39. font-size: 15;
  40. font-weight: bold;
  41. }
  42. .bb{
  43. background-color: rgb(53, 0, 254);
  44. width: 7%;
  45. border: 1px solid #c3c3c3;
  46. position:absolute;
  47. text-align-last: center;
  48. text-rendering: optimizeLegibility;
  49. font-size: 100%;
  50. }
  51. </style>
  52. <script>
  53.  
  54.  
  55.  
  56. var id =0 ;
  57. function task(name,date,description ){
  58. //this.id = id;
  59. this.name = name;
  60. this.date = date;
  61. this.description =description ;
  62. //this.states=states;
  63. }
  64.  
  65. var forEdit=0;
  66. var countElement =0;
  67. var taskslist = [];
  68. var i;
  69. var allTasksarray =[];
  70. var inProgressarray =[];
  71. var archivedarray = [];
  72. var completedarray =[];
  73. var countAll=0;
  74. var countComplete=0;
  75. var countArchive=0;
  76. var countProg=0;
  77. var add1;
  78. var add2;
  79. var add3;
  80. var add4;
  81. var addto;
  82. var count1;
  83. var count;
  84. var count2;
  85. var count3;
  86. var tempindex=0;
  87. var temparray;
  88.  
  89. var x = new task("task_1",Date.now(),"gfuoh;o");
  90. allTasksarray =[x];
  91. //taskslist =[x];
  92. function drawTable(choose,word ){ //var text = //document.getElementById("myTable").innerHTML;
  93. var mark =0;
  94. if (choose == "all"){
  95. taskslist = allTasksarray;
  96. addto = 1;
  97. //taskslist= taskslist.concat(allTasks);
  98. }
  99. else if (choose == "complete"){
  100. taskslist = completedarray;
  101. addto =3;
  102. mark =1;
  103. }
  104. else if( choose == "prog"){
  105. taskslist = inProgressarray ;
  106. addto =2;
  107.  
  108. }
  109. else if ( choose == "archive"){
  110. taskslist = archivedarray ;
  111. addto = 4;
  112.  
  113. }
  114. var text = "<table style=\"width:100% padding-top:10%;padding-bottom: 30%;\" >";
  115. text += "<tr>";
  116. text += "<td style =\" text-align:left; font-size:200%;font:bold;width:30%\">"+word+"</td>";
  117. text+="<td style =\"width:10%; text-align:center;\"><div class=\"dropdown\">"+
  118. "<button class=\"btn btn-primary dropdown-toggle\"type=\"button\" data-toggle=\"dropdown\">sort"+
  119. "<span class=\"caret\"></span></button>"+
  120. "<ul class=\"dropdown-menu\">"+
  121. "<li><a onclick = \"Sortn(addto);\"href=\"#\">by name</a></li>"+
  122. "<li><a onclick = \"datesort(addto);\"href=\"#\">by date</a></li>"+
  123. "</div>"+
  124. "</td>";
  125. text += "</tr>";
  126. //text += "<th>Date</th>";
  127. text += "<th></th>";
  128. if (addto == 1 ||addto == 2 ){
  129. for(i = 0; i< taskslist.length; i++){
  130. text += "<tr>";
  131. text += "<td style=\"width:5%\"> <INPUT TYPE=\"checkbox\" NAME=\"Item1\" VALUE=\"0\" UNCHECKED onclick=\"showbutton\"></td>";
  132. text += "<td style=\"width:45%;text-align:left;\">"+taskslist[i].name + "</td>";
  133. text += "<td style=\"width:20%\">"+taskslist[i].date + "</td>";
  134. text += "<td style =\"width:20%; text-align:center;\"><div class=\"dropdown\">"+
  135. "<button class=\"btn btn-primary dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\">options"+
  136. "<span class=\"caret\"></span></button>"+
  137. "<ul class=\"dropdown-menu\">"+
  138. "<li><a onclick = \"Tobearchived(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">archived</a></li>"+
  139. "<li><a onclick = \"editt(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">Edit</a></li>"+
  140. "<li><a onclick = \"Delete(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">delete</a></li>"+
  141. "<li><a onclick = \"Tobedone(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">mark as done</a></li>"+
  142. "</ul>"+
  143. "</ul>"+
  144. "</div>"+
  145. "</td>"
  146. text += "</tr>";}
  147. text += "<tr><button onclick = \"addTask()\" id=\"button_\"></tr>";
  148. text += "<form>Task<input type=\"text\"id=\"taskname\" name=\"task\">"+
  149. "</input>Date<input type=\"date\" id=\"datepicker\" name=\"date\"></input>"+
  150. "<br>description<input type=\"text\" id=\"desc\" name=\"desc\"></input><br>"+
  151. "</form>";
  152. text += "<tr>";
  153. text+= "</table>";}
  154. else if (addto == 3){
  155. for(i = 0; i< taskslist.length; i++){
  156. text += "<tr>";
  157. text += "<td style=\"width:5%\"> <INPUT TYPE=\"checkbox\" NAME=\"Item1\" VALUE=\"0\" UNCHECKED onclick=\"showbutton\"></td>";
  158. text += "<td style=\"width:45%;text-align:left;\"><strike>"+taskslist[i].name + "</stri</td>";
  159. text += "<td style=\"width:20%\">"+taskslist[i].date + "</td>";
  160. text += "<td style =\"width:20%; text-align:center;\"><div class=\"dropdown\">"+
  161. "<button class=\"btn btn-primary dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\">options"+
  162. "<span class=\"caret\"></span></button>"+
  163. "<ul class=\"dropdown-menu\">"+
  164. "<li><a onclick = \"Tobearchived(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">archived</a></li>"+
  165. "<li><a onclick = \"editt(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">Edit</a></li>"+
  166. "<li><a onclick = \"Delete(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">delete</a></li>"+
  167. // "<li><a onclick = \"Tobedone(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">mark as done</a></li>"+
  168. "</ul>"+
  169. "</ul>"+
  170. "</div>"+
  171. "</td>"
  172. text += "</tr>";}
  173. text+= "</table>";
  174.  
  175. }
  176. else if (addto == 4){
  177. for(i = 0; i< taskslist.length; i++){
  178. text += "<tr>";
  179. text += "<td style=\"width:5%\"> <INPUT TYPE=\"checkbox\" NAME=\"Item1\" VALUE=\"0\" UNCHECKED onclick=\"showbutton\"></td>";
  180. text += "<td style=\"width:45%;text-align:left;\">"+taskslist[i].name + "</td>";
  181. text += "<td style=\"width:20%\">"+taskslist[i].date + "</td>";
  182. text += "<td style =\"width:20%; text-align:center;\"><div class=\"dropdown\">"+
  183. "<button class=\"btn btn-primary dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\">options"+
  184. "<span class=\"caret\"></span></button>"+
  185. "<ul class=\"dropdown-menu\">"+
  186. // "<li><a onclick = \"Tobearchived(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">archived</a></li>"+
  187. "<li><a onclick = \"editt(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">Edit</a></li>"+
  188. "<li><a onclick = \"Delete(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">delete</a></li>"+
  189. "<li><a onclick = \"Tobedone(this.parentNode.parentNode.parentNode.parentNode.parentNode.rowIndex,addto);\"href=\"#\">mark as done</a></li>"+
  190. "</ul>"+
  191. "</ul>"+
  192. "</div>"+
  193. "</td>"
  194. text += "</tr>";}
  195. text+= "</table>";
  196.  
  197. }
  198.  
  199. document.getElementById("myTable").innerHTML = text;
  200. taskslist =[];
  201. }
  202.  
  203.  
  204.  
  205. function showbutton(){
  206. var delbut ="<form>";
  207. delbut += "<button type\"button\" class=\"btn btn-danger\">Danger</button>";
  208. //"<button style=\"width:30%;color:red;\"onclick=\"Delete\">Delete";
  209. delbut += "<\form>";
  210. document.getElementByName("Item1").innerHTML = delbut;
  211. }
  212. function Sortn(addto){
  213. if (addto == 1){
  214. allTasksarray.sort(function(a, b){
  215. var nameA=a.name.toLowerCase();
  216. var nameB=b.name.toLowerCase();
  217. if (nameA < nameB){ return -1 ;} //sort string ascending
  218. if (nameA > nameB) {return 1};
  219. return 0; //default return value (no sorting)
  220. });
  221. drawTable("all","ALL Tasks");
  222. }
  223. else if (addto == 2){
  224.  
  225. inProgressarray.sort(function(a, b){
  226. var nameA=a.name.toLowerCase();
  227. var nameB=b.name.toLowerCase();
  228. if (nameA < nameB){ return -1 ;} //sort string ascending
  229. if (nameA > nameB) {return 1};
  230. return 0; //default return value (no sorting)
  231. });
  232. drawTable("prog"," in Progress");
  233. }
  234. else if (addto == 3){
  235.  
  236. completedarray.sort(function(a, b){
  237. var nameA=a.name.toLowerCase();
  238. var nameB=b.name.toLowerCase();
  239. if (nameA < nameB){ return -1 ;} //sort string ascending
  240. if (nameA > nameB) {return 1};
  241. return 0; //default return value (no sorting)
  242. });
  243. drawTable("complete","Completed");
  244. }
  245. else if (addto == 4){
  246. archivedarray.sort(function(a, b){
  247. var nameA=a.name.toLowerCase();
  248. var nameB=b.name.toLowerCase();
  249. if (nameA < nameB){ return -1 ;} //sort string ascending
  250. if (nameA > nameB) {return 1};
  251. return 0; //default return value (no sorting)
  252. });
  253. drawTable("archive","Archived");
  254. }
  255. }
  256. function datesort (addto){
  257. if (addto == 1){
  258. allTasksarray.sort(function(a, b){
  259. var dateA=new Date(a.date);
  260. var dateB=new Date(b.date);
  261. return dateA-dateB;//sort by date ascending
  262. });
  263. drawTable("all","ALL Tasks");
  264. }
  265. else if (addto == 2){
  266. inProgressarray.sort(function(a, b){
  267. var dateA=new Date(a.date);
  268. var dateB=new Date(b.date);
  269. return dateA-dateB;//sort by date ascending
  270. });
  271.  
  272. drawTable("prog","Progress");
  273. }
  274. else if (addto == 3){
  275. completedarray.sort(function(a, b){
  276. var dateA=new Date(a.date);
  277. var dateB=new Date(b.date);
  278. return dateA-dateB;//sort by date ascending
  279. });
  280. drawTable("complete","Completed");
  281. }
  282. else if (addto == 4){
  283. archivedarray.sort(function(a, b){
  284. var dateA=new Date(a.date);
  285. var dateB=new Date(b.date);
  286. return dateA-dateB;//sort by date ascending
  287. });
  288. drawTable("archive","Archived");
  289. }
  290. }
  291.  
  292. function Tobearchived(index,array){
  293. if( array ==1){
  294.  
  295. archivedarray. push(allTasksarray[index-2]);
  296. //drawTable();
  297.  
  298. }
  299. else if( array == 2){
  300.  
  301. archivedarray. push(inProgressarray[index-2]);
  302. inProgressarray.splice((index-2),1);
  303. drawTable("prog"," in Progress");
  304.  
  305. }
  306. else if ( array == 3){
  307. archivedarray. push(completedarray[index-2]);
  308. completedarray.splice((index-2),1);
  309. drawTable("complete","completed");
  310. }
  311.  
  312. //index=index-2
  313. }
  314. function editt(index,array){
  315. forEdit=1;
  316. tempindex=index;
  317. temparray=array;
  318. if(array==1){
  319. temparray=1;
  320. document.getElementById("taskname").value = allTasksarray[index-2].name;
  321. document.getElementById("datepicker").value = allTasksarray[index-2].date;
  322. document.getElementById("desc").value = allTasksarray[index-2].description;
  323. }
  324. else if(array==2){
  325. temparray=2;
  326. document.getElementById("taskname").value = inProgressarray[index-2].name;
  327. document.getElementById("datepicker").value = inProgressarray[index-2].date;
  328. document.getElementById("desc").value = inProgressarray[index-2].description;
  329. }
  330. else if(array==3){
  331. temparray=3;
  332. document.getElementById("taskname").value = completedarray[index-2].name;
  333. document.getElementById("datepicker").value = completedarray[index-2].date;
  334. document.getElementById("desc").value = completedarray[index-2].description;
  335. }
  336. else if(array==4){
  337. temparray=4;
  338. document.getElementById("taskname").value = archivedarray[index-2].name;
  339. document.getElementById("datepicker").value = archivedarray[index-2].date;
  340. document.getElementById("desc").value = archivedarray[index-2].description;
  341. }
  342. }
  343.  
  344. function tempedit(){
  345. if(temparray==1){
  346.  
  347. allTasksarray[tempindex-2]=allTasksarray[allTasksarray.length-1];
  348. allTasksarray.splice(allTasksarray.length-1,1);
  349. drawTable("all","ALL Tasks");
  350. }
  351. else if(temparray==2){
  352. inProgressarray[tempindex-2]=inProgressarray[inProgressarray.length-1];
  353. inProgressarray.splice(inProgressarray.length-1,1);
  354. allTasksarray.splice(allTasksarray.length-1,1);
  355. drawTable("prog","in progress");
  356. }
  357. else if(temparray==3){
  358. completedarray[tempindex-2]=completedarray[completedarray.length-1];
  359. completedarray.splice(completedarray.length-1,1);
  360. allTasksarray.splice(allTasksarray.length-1,1);
  361. drawTable("complete","Completed");
  362. }
  363. else if(temparray==4){
  364. archivedarray[tempindex-2]=archivedarray[archivedarray.length-1];
  365. archivedarray.splice(archivedarray.length-1,1);
  366. allTasksarray.splice(allTasksarray.length-1,1);
  367. drawTable("archive","Archived");
  368. }
  369. }
  370. function Tobedone(index,array){
  371. if (array == 1 ){
  372. allTasksarray[index-2].name="<strike>"+allTasksarray[index-2].name+"</strike>";
  373. completedarray.push(allTasksarray[index-2]);
  374.  
  375. //sort
  376. drawTable("all","ALL Tasks");
  377. }
  378. else if (array == 2 ){
  379. inProgressarray[index-2].name="<strike>"+inProgressarray[index-2].name+"</strike>";
  380. completedarray.push(inProgressarray[index-2]);
  381. inProgressarray.splice((index-2),1);
  382. drawTable("prog","in progress");
  383. }
  384. else if (array == 4 ){
  385. archivedarray[index-2].name="<strike>"+archivedarray[index-2].name+"</strike>";
  386. completedarray.push(archivedarray[index-2]);
  387. drawTable("archive","Archived");
  388. }
  389.  
  390. //index=index-2
  391. }
  392.  
  393. function Delete(index,array){
  394. if (array == 1){
  395. if(confirm("are you sure")==true){
  396. for(j=0 ; j<completedarray.length ; j++){
  397. if(completedarray[j]==allTasksarray[index-2]){
  398. completedarray.splice(j,1);}
  399. }
  400. for(j=0 ; j<inProgressarray.length ; j++){
  401. if(inProgressarray[j]==allTasksarray[index-2]){
  402. inProgressarray.splice(j,1);}
  403. }
  404. for(j=0 ; j<archivedarray.length ; j++){
  405. if(archivedarray[j]==allTasksarray[index-2]){
  406. archivedarray.splice(j,1);}
  407. }
  408.  
  409. allTasksarray.splice((index-2),1);}
  410. drawTable("all","ALL Tasks");
  411. }
  412. else if ( array== 3){
  413. if(confirm("are you sure")==true){
  414. for(j=0 ; j<allTasksarray.length ; j++){
  415. if(allTasksarray[j]==completedarray[index-2]){
  416. allTasksarray.splice(j,1);}
  417. }
  418. for(j=0 ; j<inProgressarray.length ; j++){
  419. if(inProgressarray[j]==completedarray[index-2]){
  420. inProgressarray.splice(j,1);}
  421. }
  422. for(j=0 ; j<archivedarray.length ; j++){
  423. if(archivedarray[j]==completedarray[index-2]){
  424. archivedarray.splice(j,1);}
  425. }
  426.  
  427. completedarray.splice((index-2),1);}
  428. drawTable("complete","Completed");
  429. }
  430. else if( array == 2){
  431. if(confirm("are you sure")==true){
  432. for(j=0 ; j<completedarray.length ; j++){
  433. if(completedarray[j]==inProgressarray[index-2]){
  434. completedarray.splice(j,1);}
  435. }
  436. for(j=0 ; j<allTasksarray.length ; j++){
  437. if(allTasksarray[j]==inProgressarray[index-2]){
  438. allTasksarray.splice(j,1);}
  439. }
  440. for(j=0 ; j<archivedarray.length ; j++){
  441. if(archivedarray[j]==inProgressarray[index-2]){
  442. archivedarray.splice(j,1);}
  443. }
  444.  
  445. inProgressarray.splice((index-2),1);}
  446. drawTable("prog","In Progress");
  447. }
  448. else if ( array == 4){
  449. if(confirm("are you sure")==true){
  450. for(j=0 ; j<completedarray.length ; j++){
  451. if(completedarray[j]==archivedarray[index-2]){
  452. completedarray.splice(j,1);}
  453. }
  454. for(j=0 ; j<inProgressarray.length ; j++){
  455. if(inProgressarray[j]==archivedarray[index-2]){
  456. inProgressarray.splice(j,1);}
  457. }
  458. for(j=0 ; j<allTasksarray.length ; j++){
  459. if(allTasksarray[j]==archivedarray[index-2]){
  460. allTasksarray.splice(j,1);}
  461. }
  462.  
  463. archivedarray.splice((index-2),1);}
  464. drawTable("archive","Archived");
  465. }
  466. }
  467.  
  468.  
  469.  
  470.  
  471. function addTask(id){
  472. var name_1 = document.getElementById("taskname").value;
  473. var date_1 = document.getElementById("datepicker").value;
  474. var description_1= document.getElementById("desc").value;
  475. var tasknow = new task(name_1,date_1,description_1);
  476. if(addto == 1){
  477. allTasksarray.push(tasknow);
  478. var choose = "all";
  479. var word ="ALL tasks";
  480. taskslist =[];
  481. drawTable(choose,word);
  482. }
  483. else if(addto == 2){
  484. inProgressarray.push(tasknow);
  485. allTasksarray.push(tasknow);
  486. var choose = "prog";
  487. var word ="In Progress";
  488. taskslist =[];
  489. drawTable(choose,word);
  490. }
  491. else if(addto == 3){
  492. completedarray.push(tasknow)
  493. tasknow.name= "<strike>"+tasknow.name+"</strike>";
  494. allTasksarray.push(tasknow);
  495. var choose = "complete";
  496. var word ="Completed";
  497. taskslist =[];
  498. drawTable(choose,word);
  499.  
  500. }
  501. else if(addto == 4){
  502. archivedarray.push(tasknow);
  503. allTasksarray.push(tasknow);
  504. var choose = "archive";
  505. var word ="Archived";
  506. taskslist =[];
  507. drawTable(choose,word);
  508. }
  509. if(forEdit==1){
  510. tempedit();
  511. forEdit=0;
  512. }
  513.  
  514. }
  515.  
  516.  
  517. </script>
  518. <script>
  519. $(document).ready(function() {
  520. $("#datepicker").datepicker();
  521. });
  522.  
  523. $(document).ready(function(){
  524. $("#flip").click(function(){
  525. $("#panel").slideDown("slow");
  526. });
  527. });
  528.  
  529. $(document).ready(function(){
  530. $("#flip2").click(function(){
  531. $("#panel").slideUp("slow");
  532. });
  533. });
  534.  
  535. </script>
  536. </head>
  537. <body style="background-color:rgb(135, 148, 165);">
  538. <h1 class="text" style=" background-color:rgb(146, 111, 247);color:white;text-align:center;padding:0.25%">Welcome to our to-do-list </h1>
  539. <table style ="text-align:center ; width:100%">
  540. <td style="width:30% ; background-color:rgb(96, 193, 113);text-align:center-left; padding-top:10%;padding-bottom: 30%;">
  541. <br>
  542. <ui>
  543. <button style=" border-radius:4%;background-color:rgb(85, 165, 255); width :90%;" id="all" value="ALL tasks" onclick="drawTable(this.id, this.value);">All tasks<span class="badge">0</span></button>
  544. </ui>
  545. </br>
  546. <br>
  547. <ui>
  548. <button style="background-color:rgb(85, 165, 255); width :90%;" value="In Progress" id ="prog" onclick="drawTable(this.id, this.value);">In Progress<span class="badge">0</span></button>
  549. </ui>
  550. </br>
  551. <br>
  552. <ui>
  553. <button style="background-color:rgb(85, 165, 255); width :90%;" value="Completed" id="complete" onclick="drawTable(this.id, this.value);">Completed<span class="badge">0</span></button>
  554. </ui>
  555. </br>
  556. <br>
  557. <ui>
  558. <button style="background-color:rgb(85, 165, 255); width :90%; " value="Archived"id ="archive" onclick="drawTable(this.id, this.value);">Archived<span class="badge">0</span></button>
  559. </ui>
  560. </br>
  561. </td>
  562. <td style="width:70% padding-top:10%;padding-bottom: 30%;">
  563. <p id="myTable"/>
  564. <table>
  565. <h2>All Tasks </h2>
  566.  
  567. <td style="width:5%">
  568. <INPUT TYPE="checkbox" NAME="Item1" VALUE="0" UCHECKED onClick="showbutton">
  569. </td>
  570. <td style="width:45%;text-align:left;"><b>task_1</b></td>
  571.  
  572. <td style="width:20%">
  573. <form style=" text-align:center;">
  574. <input type="text" id="datepicker" name="date"/>
  575. </form>
  576. </td>
  577. <td style =" width:20%; text-align:center;">
  578. <div class="dropdown">
  579. <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">options
  580. <span class="caret"></span></button>
  581. <ul class="dropdown-menu">
  582. <li><a href="#" >archived</a></li>
  583. <li><a href="#">Edit</a></li>
  584. <li><a href="#">delete</a></li>
  585. <li><a href="#">mark as done</a></li>
  586. </ul>
  587. </div>
  588. </td>
  589. </table>
  590.  
  591. </td>
  592. </table>
  593.  
  594. </body>
  595. </html>
Advertisement
Add Comment
Please, Sign In to add comment