Advanced Search

Ajax database app

/ Published in: Python
Save to your folder(s)
A simple Ajax database app built with the Karrigell web framework for Python; PyDbLite, a non-SQL Python database engine; and JQuery in the browser

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. ## HTML and JQuery source: ##
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html>
  5. <head>
  6. <meta http-equiv="Content-Type"
  7. content="text/html;charset=ISO-8859-1" />
  8.  <script src="http://code.jquery.com/jquery-1.4.4.js"></script><script type="text/javascript">
  9.  
  10.  
  11. $(document).ready(function(){
  12.  
  13.   $('#country').change(function(){
  14. 	   $country = ($(this).val());
  15.  
  16.  
  17. $.get('mydata.py', { value : $country },
  18.    function(data){
  19.       $('#txtHint').html(data);
  20.    });
  21.  
  22.   });
  23.  
  24. });
  25.  
  26. </script>
  27.  
  28. </head>
  29. <body>
  30.  
  31. <form action=""> 
  32. <select name="customer" id="country">
  33. <option value="" id="select">Select a customer by country:</option>
  34.  
  35. <option value="Argentina" class="list">Argentina</option>
  36. <option value="Canada" class="list">Canada</option>
  37. <option value="France" class="list">France</option>
  38. <option value="Germany" class="list">Germany</option>
  39. <option value="Mexico" class="list">Mexico</option>
  40. <option value="Sweden" class="list">Sweden</option>
  41. </select>
  42. </form>
  43. <br />
  44.  
  45.  
  46. <div id="txtHint">Customer info will be listed here...</div>
  47.  
  48. </body>
  49. </html>
  50.  
  51. ## CSS for table: ##
  52.  
  53. .customers
  54. {
  55. border-collapse:collapse;
  56. border:2px solid #B7AFA3;
  57. width:39%;
  58. border-bottom: 4px solid #6D929B;
  59. border-top: 3px solid #6D929B;
  60. margin-left:10px;
  61. margin-right:auto;
  62. margin-bottom:auto;
  63. font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  64.  
  65. }
  66.  
  67.  
  68. td.row_even  th 
  69.  
  70. {
  71. background:#fff;
  72. padding-left:5px;
  73. }
  74.  
  75. tr.row_odd, td.row_odd 
  76. {
  77. color:#000000;
  78. background-color:#DCF0F7;
  79. }
  80.  
  81. ## Python script: ##
  82.  
  83. #mydata.py
  84.  
  85. #Import the PyDbLite and HTMLTags modules
  86.  
  87. from PyDbLite import Base
  88.  
  89. from HTMLTags import *
  90.  
  91. #Store the value of the query string (the value sent via GET from the dropdown menu)
  92.  
  93. q = QUERY['value']  
  94.  
  95. #Create a database and insert database records. 
  96.  
  97. db = Base('address.pdl')
  98.  
  99. db.create('<b>Customer ID</b>','<b>Company Name</b>','Address','City','Postal Code','Country','Phone','Fax',mode="override") 
  100.  
  101. db.open()
  102.  
  103. db.insert('<b>ALFKI</b>','<b>Alfreds Futterkiste</b>','Obere Str. 57','Berlin',12209,'Germany','030-0074321','030-0076545')
  104. db.insert('<b>ANATR</b>','<b>Ana Trujillo Emparedados y helados</b>','Avda. de la Constituci&#243;n 2222','M&#233;xico D.F.',5021,'Mexico','(5) 555-4729','030-0076545')
  105. db.insert('<b>ANTON</b>','<b>Antonio Moreno Taquer����¯�¿�½������­a</b>','Mataderos 2312','M&#233;xico D.F.',5023,'M&#233;xico','(5) 555-3932','030-0076471')
  106. db.insert('<b>AROUT</b>','<b>Around the Horn</b>','120 Hanover Sq.','London','WA1 1DP','UK','(171) 555-7788','(171) 555-6750')
  107. db.insert('<b>BERGS</b>','<b>Berglunds snabbk&#246;p</b>','Berguvsv&#228;gen  8','Lule&#229;','S-958 22','Sweden','0921-12 34 65','0921-12 34 67')
  108. db.insert('<b>BLAUS</b>','<b>Blauer See Delikatessen</b>','Forsterstr. 57','Mannheim',68306,'Germany','0621-08460','0621-08924')
  109. db.insert('<b>BLONP</b>','<b>Blondesddsl p&#232;re et fils</b>','24, place Kl&#233;ber','Strasbourg',67000,'France','88.60.15.31','88.60.15.32')
  110. db.insert('<b>BONAP</b>','<b>12, rue des Bouchers</b>','Marseille',13008,'France','91.24.45.40','91.24.45.41')
  111. db.insert('<b>BOTTM</b>','<b>Bottom-Dollar Markets</b>','23 Tsawassen Blvd.','Tsawassen','T2F 8M4','Canada','(604) 555-4729','(604) 555-3745')
  112. db.insert('<b>BSBEV</b>','<b>B\'s Beverages</b>','Fauntleroy Circus','London','EC2 5NT','UK','(171) 555-1212','(171) 555-1214')
  113. db.insert('<b>CACTU</b>','<b>Cactus Comidas para llevar</b>','Cerrito 333','Buenos Aires',1010,'Argentina','(1) 135-5555','(1) 135-4892')
  114. db.insert('<b>CENTC</b>','<b>Centro comercial Moctezuma</b>','Sierras de Granada 9993','M&#233;xico D.F.',5022,'Mexico','(5) 555-3392','(5) 555-7293')
  115.  
  116. db.commit()
  117.  
  118.  
  119.  
  120.  
  121.  
  122. #Use Karrigell's HTMLTags module to build an HTML table for the data 
  123.  
  124. head = HEAD()
  125.  
  126. head <= TITLE('Customer Records')
  127. head <= LINK(rel="Stylesheet",href="css/style.css")
  128. body = BODY()
  129. table = TABLE(Class="customers") 
  130.  
  131.  
  132. #Iterate on the database records; return those where the query string (q) matches the records stored in Country  
  133.  
  134. recs = [ r for r in db if q == r['Country']]
  135.  
  136. for record in recs:
  137. 	for f in db.fields:
  138. 			table <= TR(TD(f)+TD(record[f]))
  139.  
  140.  
  141. #This tricky-looking bit of code is entirely optional. I took it off of the HTMLTags page of the Karrigell Reference Manual. It, along with the css style sheet for this app, creates the striped effect on the table.
  142.  
  143. classes = ['row_odd','row_even']
  144. lines = table.get_by_tag('TR')
  145. for i,line in enumerate(lines):
  146.     cells = line.get_by_tag('TD')
  147.     for cell in cells:
  148.         cell.attrs['Class'] = classes[i%2]
  149.  
  150. #Append the table to the body of the HTML page, and then print the table.
  151. body <= table
  152. print HTML(head+body)

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.