Pastebin launched a little side project called HostCabi.net, check it out ;-)Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Dec 16th, 2012  |  syntax: HTML 5  |  size: 3.24 KB  |  hits: 30  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!doctype html>
  2.  
  3. <html lang="en">
  4. <head>
  5.     <meta charset="utf-8" />
  6.     <title>FreeFinder</title>
  7.     <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
  8.     <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
  9.     <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
  10.  
  11.     <style>
  12.         #lesson_widget { list-style-type: none; margin: 0; padding: 0; width: 50%; font-size: 62.5%; }
  13.         #lesson_widget li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
  14.         #lesson_widget li span { position: absolute; margin-left: -1.3em; }
  15.     </style>
  16.  
  17.     <script>
  18.     $(function() {
  19.         var TagList_Lesson = [
  20.             "Maths",
  21.             "English",
  22.             "ICT",
  23.             "Science",
  24.             "Technology",
  25.         ];
  26.         $( "#new_tag-title" ).autocomplete({
  27.             source: TagList_Lesson
  28.         });
  29.  
  30.         var TagList_Teacher = [""];
  31.         $( "#new_tag-teacher" ).autocomplete({
  32.             source: TagList_Teacher
  33.         });
  34.  
  35.         var TagList_Room = [""];
  36.         $( "#new_tag-room" ).autocomplete({
  37.             source: TagList_Room
  38.         });
  39.  
  40.         $( "#lesson_widget" ).sortable();
  41.         $( "#lesson_widget" ).disableSelection();
  42.  
  43.  
  44.         var buttonCount = 0;
  45.         $('#create_new_lesson_button').click(function() {
  46.            
  47.             var LessonTitle = $('#new_tag-title').val();
  48.             var LessonTeacher = $('#new_tag-teacher').val();
  49.             var LessonRoom = $('#new_tag-room').val();
  50.  
  51.             //$("#lesson_widget").append(  '<li class="ui-state-default"><div><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>' + LessonTitle + '<br />' + LessonTeacher + '<br />' + LessonRoom + '</div></li>'  );
  52.             $("#lesson_widget").append(  '<input type="submit" id="lesson_button" data-id=' + buttonCount + ' value="' + LessonTitle + '&#10' + LessonTeacher + '&#10' + LessonRoom + '" class="ui-button ui-widget ui-state-default ui-corner-all" role="button" aria-disabled="false"/>');
  53.  
  54.             TagList_Lesson.push(LessonTitle);
  55.             TagList_Teacher.push(LessonTeacher);
  56.             TagList_Room.push(LessonRoom);
  57.  
  58.             buttonCount ++;
  59.         });
  60.         $('#lesson-widget button').click(function() {  alert("asd"); } );
  61.  
  62.     });
  63.  
  64.  
  65.  
  66.     </script>
  67. </head>
  68. <body>
  69.  
  70.     <div class="ui-widget" id="create_new_lesson_widget">
  71.  
  72.         <table border="0">        
  73.             <tr>
  74.                 <td><label for="tags">Lesson </label></td>
  75.                 <td><input type="text" id="new_tag-title" /></td>
  76.             </tr>
  77.             <tr>
  78.                 <td><label for="tags">Teacher </label></td>
  79.                 <td><input type="text" id="new_tag-teacher" /></td><td><input type="submit" id="create_new_lesson_button" value="Add lesson" /></td>
  80.             </tr>
  81.             <tr>
  82.                 <td><label for="tags">Room </label></td>
  83.                 <td><input type="text" id="new_tag-room" /></td>
  84.             </tr>
  85.         </table>
  86.  
  87.  
  88.  
  89.     </div>
  90.  
  91.     <div class="ui-widget" id="lesson_widget"> <!-- Holds the lessons -->
  92.  
  93.     </div>
  94.  
  95.     <div class="ui-widget" id="timetable"></div>
  96.  
  97.  
  98.  
  99.  
  100. </body>
  101. </html>