Python and Web Programming

1
Python and Web Programming

• November 21, Unit 8

2
Web Scripts

• Programs that generate web pages are often called
  web scripts or CGI scripts
• Like using XSL to transform an XML file into an
  HTML file, we can use web scripts to create web
  pages for us
• Why use web scripts?
• Allows use to dynamically generate web pages
• These web pages are created upon request
• Standard HTML files stored on a server are called
  static web pages or static files
• They dont really change (unless we edit the HTML)

3
Creating Web Pages

• We can create web pages using a script in many
  different languages
• Obviously, we can use Python (since thats what
  were learning)
• Other common languages include
• Perl
• PHP
• ASP

4
Simple Page in Python

• Creating a simple web page in Python is very
  similar to how it was done using XSL
• Basically, the Python program will need to output
  the HTML we need for our page
• To do this, well use a series of print
  statements
• The basic things we need are
• Header information (text/html)
• A blank line
• lthtmlgt, ltheadgt, lttitlegt,ltbodygt, HTML content, and
  closing tags

5
Simple Python Script

• print Content-type text/html
• print
• print lthtmlgtltheadgt
• print lttitlegtPython Examplelt/titlegt
• print lt/headgtltbodygt
• print lth1gtPython is funlt/h1gt
• print ltpgt Python made this pagelt/pgt
• print lt/bodygtlt/htmlgt

6
Header Information

• print Content-type text/html
• This produces the header information for our web
  page
• Basically the purpose of this is to tell the
  browser which type of information is going to be
  sent
• Indicates the MIME type
• When we put a python script online, it has the
  extension .py
• Browser needs to know that HTML is coming
• Why the blank line after the header?
• Indicates the start of the HTML

7
Triple-Quoted Strings

• When we create web pages with Python we can
  dynamically change parts of the page
• But large portions of the page may be static
• Instead of having multiple print statements we
  can use fewer and enclose much of our HTML in
  triple quoted strings
• Allows us to have line breaks where double quotes
  do not in python

8
Triple-Quoted String Example

• print Content-type text/html
• print
• print lthtmlgtltheadgt
• lttitlegtPython Examplelt/titlegt
• lt/headgtltbodygt
• lth1gtPython is funlt/h1gt
• ltpgt Python made this pagelt/pgt
• ltbodygtlt/htmlgt
• This produces the same output as the first
  example Python script
• Allows us to copy and paste large chunks of HTML

9
Python Generated Web Pages

• The previous scripts are kind of pointless to do
  with Python
• They actually create static web pages
• They dont change
• But we can generate web pages that do change
• A simple example is to include the current time
  on a web page

10
Adding Time to a Web Page

• import time
• print Content-type text/html
• print
• print lthtmlgtltheadgtlttitlegtTime
  Pagelt/titlegtlt/headgt
• printltbodygtltpgtRight now, the time is ltstronggt
• print time.asctime(), lt/stronggtlt/pgt
• Print lt/bodygtlt/htmlgt

11
Output From Last Script

• Content-type text/html
• lthtmlgtltheadgtlttitlegtTime Pagelt/titlegtlt/headgt
• ltbodygtltpgtRight now, the time is ltstronggtTue Nov
  21 134500 2005 lt/stronggtlt/pgt
• lt/bodygtlt/htmlgt

12
Running Python Scripts

• When we run this script locally, we see the
  output from our script
• What we have on the last slide
• We dont see the web page we wanted to create
• To get the page to display we need to upload it
  to the cmpt165 server
• Our webpage will have the URL path of somepage.py
• We can test our use of the timeasc function by
  running it in IDLE
• The output will show up in the window

13
raw_data vs. Forms

• Right now were using raw_data to get user input
• But if were using a web page, we have no console
  for the user to enter data into
• Instead well use forms
• Forms allow users to enter data into a web page
• This data is then sent back to the web script on
  the web server
• We are familiar with forms
• We enter information into a form when we use a
  search engine
• Purchase items online

14
Building a Basic Page with a Form

• The first thing we need is the ltformgt tag
• The ltformgt tag goes around the entire form
• Does not affect the appearance of the page
• Just notes where the form begins and ends
• Just like writing standard HTML
• ltformgt needs an attribute called action
• This specifies the action to be taken when the
  form is submitted

15
ltformgt, cont.

• The action attribute is very important
• Why have a form that does nothing?
• action specifies which script to run when the
  form is submitted
• The value for action should be the URL of the
  script
• ltform action testScript.pygt
• ltform action someFolder/customerInfo.pygt

16
Adding Controls

• Controls are those elements which we are going to
  add to the form
• Text fields
• Text areas
• Check boxes
• Radio Buttons
• Selectable Lists
• Submit button
• A form without controls is pointless
• Theres no user input!
• We are going to add controls using the ltinputgt tag

17
ltinputgt Tag

• With the ltinputgt tag we need to specify two
  attributes
• type
• name
• Type attribute specifies the type of control
• Name attribute gives a name to the control so we
  can access the data in it later
• Like giving it a variable name

18
Type Attribute

• Again, the type attribute specifies the type of
  control
• Some examples include
• type text - text box
• type checkbox check box
• type radio radio button
• type submit submit button
• Example
• ltinput type submit..

19
Name Attribute

• We have to have a name to access the information
  in a particular portion of the form
• Very similar to naming variables
• Its best if the name relates to the content of
  the control and the control type
• Ex.
• A text box control which gets a customer name
  could have a name customerName
• A check box control which allows customer to
  select getting product updates namecheckUpdates
  

20
Value Attribute

• Sometimes well also want to add a value
  attribute
• The value attribute specifies the default value
  for that control
• Ex.
• ltinput typetext valuea textbox
  nametextbox1/gt
• a textbox would appear in the text box
• Checkboxes can use the checked property to
  indicate if it should be checked by default
• ltinput typecheckbox checkedchecked
  namecheckbox1/gt
• If checkedchecked then the box will appear
  checked
• checked is the only value that the checked
  property can have

21
Other Useful Text Attributes

• size attribute indicates how wide the text box
  should be
• ltinput type text nametext1 size 10/gt
• Size indicates how many characters, in this case
  10
• maxlength is just like size except that it
  indicates the maximum number of characters a text
  box will accommodate

22
Submit Type

• We have to have a way to send the form
  information to the script thats going to handle
  it
• To do this we can use a control with the type
  submit
• It will show up as a button
• The value attribute will indicate the text which
  should be displayed on the button
• ltinput typesubmit valueGo
  namesubmitButton/gt

23
HTML Form Example

• In class Example

24
Whats Next?

• So now we can create forms
• And users can enter information
• But how the heck do we use it?
• We are going to use CGI to take the information
  from the form and process it somehow
• Well get into this next class
• Youll be using CGI to take order information

25
Questions

• What you should know
• What web scripts are
• How to create a webpage using Python
• How to use triple quoted strings
• How to write a form in HTML
• ltform actionsomeprogram.pygt
• ltinputgt