X

Download An Event driven Programming PowerPoint Presentation


Login   OR  Register
X

Share page



  Preview

               
Home / Business & Management / Business & Management Presentations / An Event driven Programming PowerPoint Presentation

An Event driven Programming PowerPoint Presentation

worldwideweb By : worldwideweb

On : Jan 08, 2015

In : Business & Management

Embed :
570
views

0
downloads
Login / Signup - with account for


  • → Make favorite
  • → Flag as inappropriate
  • → Download Presentation
  • → Share Presentation
  • Slide 1 - Event-driven Programming Robin Burke IT 130 Fall 2004
  • Slide 2 - Outline The event-driven model Web applications Form HTML forms buttons text boxes accessing form content Handlers onClick onChange
  • Slide 3 - Imperative programming Program defines a series of operations User invokes program waits for result "Batch" processing
  • Slide 4 - Event-driven programming Modern applications are event-driven Different kind of programming from sequential (batch) execution programmer does not control when code is executed user controls that Programmer provides capabilities the user invokes them may be multiple ways to do the same thing Basic idea = "event handlers" small bits of code that the application calls when certain events occur
  • Slide 5 - Event-driven programming cont'd Imperative program load payroll data do payroll computation output checks Event-oriented program establish payroll application interface associate loading routine with "load" menu item associate payroll computation with "compute" menu option associate check printing operation with "print" menu options User is in charge of the sequence
  • Slide 6 - Basic idea Events are generated user actions (clicking, moving mouse) browser actions (loading, closing) To use an event, the programmer writes JavaScript code associates it with the appropriate document element associates it with the appropriate event
  • Slide 7 - Pieces we need New HTML elements forms interface widgets buttons, text boxes, etc. New HTML attributes event generation New JavaScript capabilities associate code with events
  • Slide 8 - Web application Application "A complete, self-contained program that performs a specific function directly for the user" Web application an application delivered over the WWW
  • Slide 9 - Web applications Core of web development 90% of the web's "pages" are generated from user input only 10% are static pages Not in our scope IT 230 teaches how to build those kinds of applications we will not use forms as input to applications But web applications need input input comes from HTML forms we can use form element to explore event handling
  • Slide 10 - Example applications Course online Any search engine
  • Slide 11 - What all these share... The need to get user input from a web page Format of input name-value pair Interaction idea web form How to get from user? depends on the data
  • Slide 12 - Form elements Form element identify a part of the page where the user can input data Input element specific data items name and value attributes user can change the value attribute
  • Slide 13 - Input elements name and value attributes user can change the value attribute how depends on the type text field selection list radio button, etc
  • Slide 14 - Example
  • Slide 15 - Input elements Treated like other page elements can be organized into paragraph, tables, etc. Form layout is almost always table-based All use the same base element INPUT what kind of input controlled by the type attribute
  • Slide 16 - Input elements
  • Slide 17 - Textarea for multi-line input
  • Slide 18 - Select / Option for menus and lists
  • Slide 19 - Input elements we will use type="button" rendered as a "raised" rectangle user can click type="text" rendered as an "indented" box can display text user can enter text
  • Slide 20 - Examples Button Text box more typical (with label) Enter a temperature in degrees Fahrenheit:
  • Slide 21 - Events Any HTML element can generate events many different types Commonly-used button  click event when the user clicks on the button text  change event when the user changes the value
  • Slide 22 - Linking element and event event handler attribute when the event occurs on that element the JavaScript statement will execute Example onClick="Convert();" In Element
  • Slide 23 - Example lucky.html
  • Slide 24 - Programming rollem.html
  • Slide 25 - Interacting with form values Form data name / value pairs processed by the server can also be manipulated by JavaScript Change the value of a form element changes what the user sees Linked to events we can create simple browser-based applications
  • Slide 26 - Syntax Refer to subparts using dot (.) syntax Format document.FORM_NAME.ELEMENT_NAME.value Getting a value tempF = document.TempForm.fahrBox.value; Setting a value document.TempForm.celsiusBox.value = tempC;
  • Slide 27 - Examples lucky1.html convert1.html
  • Slide 28 - Programming convert2.html
  • Slide 29 - Dynamic HTML JavaScript can alter many HTML properties "dynamic HTML" we see more of this later in the class Example alter the src attribute of an img element pics.html
  • Slide 30 - onChange event onClick event user presses a button For text elements onChange event when the user alters the contents and then clicks outside the element Example copybox.html
  • Slide 31 - Homework #5 Metric conversions two conversions work inches <--> cm feet <--> meters You need to add miles <--> km
  • Slide 32 - Structure convert.js a library with the conversion functions hwk5.html the page that interacts with the user Tasks add lines for miles / km and text elements add functions that handle onChange events add conversion functions to convert.js
  • Slide 33 - Advice Start early 45-50 lines of code to write Use cut, paste and edit! Don't forget documentation Test each step
  • Slide 34 - Wednesday Lab (Rm 722) Forms and Events Good practice for the homework
ECG Heart Beat Free PowerPoint Template

ECG Heart Beat

Views : 1646

Back to School Free PowerPoint Template

Back to School

Views : 506

Yoga Meditation Free PowerPoint Template

Yoga Meditation

Views : 754

Morning Running Free PowerPoint Template

Morning Running

Views : 771

AI Free PowerPoint Template

AI

Views : 660

Wedding Cake Free PowerPoint Template

Wedding Cake

Views : 805

Dentist Free PowerPoint Template

Dentist

Views : 376

Butterfly Free PowerPoint Template

Butterfly

Views : 642

Stop Aids Free PowerPoint Template

Stop Aids

Views : 527

Drone Free PowerPoint Template

Drone

Views : 4100

Global Warming Pollution Free PowerPoint Template

Global Warming Pollution

Views : 873

Autumn Free PowerPoint Template

Autumn

Views : 563

Global Warming Free PowerPoint Template

Global Warming

Views : 550

Agriculture Free PowerPoint Template

Agriculture

Views : 904

Running Track Free PowerPoint Template

Running Track

Views : 426

Burger Free PowerPoint Template

Burger

Views : 558

Photography Free PowerPoint Template

Photography

Views : 448

Heart Free PowerPoint Template

Heart

Views : 484

Vegetables Free PowerPoint Template

Vegetables

Views : 506

Gerbera Free PowerPoint Template

Gerbera

Views : 336

Description : PowerPoint presentation on An Event driven Programming, download now ppt of An Event driven Programming

Tags : An Event driven Programming

Shortcode : Get Shareable link