ASP & Java Script

What Is ASP?
(Active Server Page) A Web server technology that allows for the
creation of dynamic, interactive sessions with the user. An ASP is a Web
page that contains HTML code and embedded programming code
written in VBScript or Jscript. It was introduced with Version 3.0 of
Microsoft's Internet Information Server . When Internet Information
Server encounters an ASP page requested by the browser, it executes
the embedded program. ASPs are Microsoft's alternative to CGI scripts
and JavaServer Pages (JSPs), which allow Web pages to interact with
databases and other programs. Third- party products add ASP
capability to non-Microsoft Web servers. The Active Server Page
technology is an ISAPI program and ASP documents use an .ASP
extension.
Creating an ASP Document

Creating an ASP document is easy. To begin coding ASP you need only
two things: a simple-text editor like notepad or Textpad or Editplus and
the dedication to follow our tutorial! Notepad is the most basic of
simple-text editors and you will probably code a fair amount of HTML
with it.
When a browser requests an ASP file, IIS passes the request file to the
ASP engine. The ASP engine reads the corresponding ASP file, line by
line, and executes the scripts in the file. Finally, the ASP file is returned
to the browser as plain HTML format.
ASP can connect to databases, dynamically format the page, execute

statements, and much more. You may use VBScript, JavaScript,
PerlScript, and PythonScript within Active Server Pages, with VBScript
set as the default scripting language. We recommend that you use
VBScript as this should do everything you need and is the most
commonly used.
The appearance of an Active Server Page depends on what is viewing

it. An Active Server Page looks just like a normal HTML page to the Web
browser that receives it. If a visitor to your Web site views the source
code of an Active Server Page, that's what they see: a normal HTML
page. However, the file located in the server looks very different. You
also see server-side scripts. This is what the Active Server Page looks
like to the Web server before it is processed and sent in response to a
request.
The Most Common Mistake

You can insert server-side scripts anywhere in your Web page--even
inside HTML tags.ASP script must be enclosed in <% and %>
Quick example:
<html> <body> <% response.write("Hello World!") %> </body>

</html>
Frequently Asked Questions

» What is ASP?
Active Server Pages:
Active Server Pages (ASP) is a server side scripting language that lets a
webmaster transform the plain, static web site into dynamic solution.
With Microsoft's server side scripting language you can gather data
from your site's visitors, use sessions, cookies, application variables,
and more.
» Is ASP complete solution?
While ASP is useful, it is not a stand alone solution. Rather, ASP is a
supplement to HTML (and CSS and even Javascript) and your final ASP
code will often contain bits of pieces of code that are not ASP. If you
had ever wanted to take orders, gather emails, or make a decent
guestbook, ASP will provide you the necessary tools to complete these
tasks.
» Does my computer have to run Windows? What about a Mac?
You allcan do your training on a non-Windows computer like Mac. But
some of the examples in our advanced classes require a newer version
of Windows, like Windows 98 or Windows 2000.
» What you need to know?
Before you start in on Academic ASP Tutorial, it is recommended that
you have a some knowledge of HTML, as this tutorial will not explain
the HTML code in any great depth. If your HTML knowledge could use a
touchup, check out our HTML Tutorial or for the complete HTML
Beginner: First Web Site Walkthrough. This ASP Tutorial is quite long, so
do not try to take it on all at once. We find that reading a couple lessons
at one sitting and then giving yourself time to reflect on what you
learned really helps to understand the subject better. Good luck!
» After I have edited an ASP file, I cannot view the result in my browser. Why?
Make sure that you have saved the file with a proper name and
extension like "C:\Inetpub\wwwroot\mypage.asp". Also make sure that
you use the same file name when you open the file in your browser.It
should be like localhost/mypage.asp
This tutorial will walk you through how to set drop-down boxes up to
pull the values from a database as well as update the values of the
other boxes based on what the user selects in the first and second
boxes. This is handy if you are asking people to select categories of
things they would like to search for, like tutorials. In this example we
will be making a drop-down to select the group which will populate the
category drop-down and then populate the sub-category drop-down
based on which category is selected. We will be working with basic
HTML, PHP, and MySQL as well as some basic JavaScript. To get started
let’s set up our database. We will need to use three tables to achieve
what we are doing. To start lets make our group table. The query to do
so is following:
view plaincopy to clipboardprint?
1.
2. CREATE TABLE `group` (
3. `id` int(10) NOT NULL auto_increment,
4. `group` varchar(100) NOT NULL default '',
5. PRIMARY KEY (`id`)
6. ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=10 ;
This will create a table called group and set it to have the fields below:
Id – unique primary key, integer, auto-increments
Group – name of the various groups (programming, networking, ect..)
It will also set the auto increment value to 10)because we are going to
insert 9 records to the table and we will give them the ids.
1.
2. INSERT INTO `group` VALUES(1, 'Programming');
3. INSERT INTO `group` VALUES(2, 'Graphic Design');
4. INSERT INTO `group` VALUES(3, 'Networking');
5. INSERT INTO `group` VALUES(4, 'Office Software');
6. INSERT INTO `group` VALUES(5, 'Operating Systems');
7. INSERT INTO `group` VALUES(6, 'Other');
8. INSERT INTO `group` VALUES(7, '3D and Video');
9. INSERT INTO `group` VALUES(8, 'Web Development');
10. INSERT INTO `group` VALUES(9, 'Databases');
These queries will create the groups that we will be using to populate
our first drop-down. Now we need to create our category table.
1.
2. CREATE TABLE `category` (
4. `group` varchar(100) NOT NULL default '',
5. `category` varchar(100) NOT NULL default '',
7. ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=24 ;
This will create a table called category with the following fields:
Group – name of the various groups from the previous drop-down
(programming, networking, ect..)
Category – name of the categories that will be listed underneath the
corresponding groups
This one also sets our auto-increment value for us so that when we
insert the values next, we will start with the right number.
1.
2. INSERT INTO `category` VALUES(1, 'Graphic Design', 'Fireworks');
3. INSERT INTO `category` VALUES(2, 'Graphic Design', 'Flash');
4. INSERT INTO `category` VALUES(3, '3D and Video', '3d Studio Max');
5. INSERT INTO `category` VALUES(4, '3D and Video', 'AutoCAD');
6. INSERT INTO `category` VALUES(5, 'Web Development', 'HTML and XHTML'
);
7. INSERT INTO `category` VALUES(6, 'Web Development', 'CSS');
8. INSERT INTO `category` VALUES(7, 'Web Development', 'Other');
9. INSERT INTO `category` VALUES(8, 'Programming', 'C and C++');
10. INSERT INTO `category` VALUES(9, 'Programming', 'Java');
11. INSERT INTO `category` VALUES(10, 'Databases', 'MySQL');
12. INSERT INTO `category` VALUES(11, 'Databases', 'Oracle');
13. INSERT INTO `category` VALUES(12, 'Operating Systems', 'Windows XP');
14. INSERT INTO `category` VALUES(13, 'Operating Systems', 'Linux');
15. INSERT INTO `category` VALUES(14, 'Operating Systems', 'Mac OS');
16. INSERT INTO `category` VALUES(15, 'Business Apps', 'Excel');
17. INSERT INTO `category` VALUES(16, 'Business Apps', 'Powerpoint');
18. INSERT INTO `category` VALUES(17, 'Business Apps', 'Word');
19. INSERT INTO `category` VALUES(18, 'Other', 'Tips and Tricks');
20. INSERT INTO `category` VALUES(19, 'Other', 'Other');
21. INSERT INTO `category` VALUES(20, 'Networking', 'TCP IP');
22. INSERT INTO `category` VALUES(21, 'Networking', 'Cisco');
23. INSERT INTO `category` VALUES(22, 'Office Software', 'Peachtree');
24. INSERT INTO `category` VALUES(23, 'Office Software', 'QuickBooks');
As, you can see we are inserting at least two values for each one so
that we can see this thing in action. Now we need to create our sub-
category table. This one will have several entries in it.
1.
2. CREATE TABLE `subcategory` (
4. `category` varchar(100) NOT NULL default '',
5. `subcategory` varchar(100) NOT NULL default '',
7. ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT= 42;
This will create the following fields:

Category – name of the categories that will be listed underneath the
corresponding groups that is related to those in the drop down.
Subcategory – The subcategories that belong to the corresponding
category
Now we need to insert our data into this table:
1.
2. INSERT INTO `subcategory` VALUES(1, 'Fireworks', 'Text Effects');
3. INSERT INTO `subcategory` VALUES(2, 'Fireworks', 'Other');
4. INSERT INTO `subcategory` VALUES(3, 'Flash', 'Animation');
5. INSERT INTO `subcategory` VALUES(4, 'Flash', 'Tweening');
6. INSERT INTO `subcategory` VALUES(5, '3d Studio Max', 'Animation');
7. INSERT INTO `subcategory` VALUES(6, '3d Studio Max', 'Effects');
8. INSERT INTO `subcategory` VALUES(7, 'AutoCAD', '3D');
9. INSERT INTO `subcategory` VALUES(8, 'AutoCAD', 'Architectural');
10. INSERT INTO `subcategory` VALUES(9, 'AutoCAD', 'Basics');
11. INSERT INTO `subcategory` VALUES(10, 'AutoCAD', 'Other');
12. INSERT INTO `subcategory` VALUES(11, 'CSS', 'General');
13. INSERT INTO `subcategory` VALUES(12, 'HTML and XHTML', '.htaccess');
14. INSERT INTO `subcategory` VALUES(13, 'HTML and XHTML', 'Advanced');
15. INSERT INTO `subcategory` VALUES(14, 'HTML and XHTML', 'Backgrounds')
;
16. INSERT INTO `subcategory` VALUES(15, 'Java', 'Applet Building');
17. INSERT INTO `subcategory` VALUES(16, 'Java', 'Application Building');
18. INSERT INTO `subcategory` VALUES(17, 'C and C++', 'Development');
19. INSERT INTO `subcategory` VALUES(18, 'C and C++', 'File Manipulation');
20. INSERT INTO `subcategory` VALUES(19, 'MySQL', 'General');
21. INSERT INTO `subcategory` VALUES(20, 'Oracle', 'General');
22. INSERT INTO `subcategory` VALUES(21, 'Linux', 'Administration');
23. INSERT INTO `subcategory` VALUES(22, 'Linux', 'Editing Files');
24. INSERT INTO `subcategory` VALUES(23, 'Windows XP', 'Administration');
25. INSERT INTO `subcategory` VALUES(24, 'Windows XP', 'Development');
26. INSERT INTO `subcategory` VALUES(25, 'Mac OS', 'General');
27. INSERT INTO `subcategory` VALUES(26, 'Mac OS', 'Networking');
28. INSERT INTO `subcategory` VALUES(27, 'Excel', 'General');
29. INSERT INTO `subcategory` VALUES(28, 'Powerpoint', 'General');
30. INSERT INTO `subcategory` VALUES(29, 'Word', 'General');
31. INSERT INTO `subcategory` VALUES(30, 'Networking', 'General');
32. INSERT INTO `subcategory` VALUES(31, 'Tips and Tricks', 'Hacks');
33. INSERT INTO `subcategory` VALUES(32, 'Tips and Tricks', 'OverClocking');
34. INSERT INTO `subcategory` VALUES(33, 'Other', 'BASH');
35. INSERT INTO `subcategory` VALUES(34, 'Other', 'MonitorTips');
36. INSERT INTO `subcategory` VALUES(35, 'TCP IP', 'General');
37. INSERT INTO `subcategory` VALUES(36, 'Cisco', 'Configuration');
38. INSERT INTO `subcategory` VALUES(37, 'Cisco', 'Programming');
39. INSERT INTO `subcategory` VALUES(38, 'Peachtree', 'Setup');
40. INSERT INTO `subcategory` VALUES(39, 'Peachtree', 'Configuration');
41. INSERT INTO `subcategory` VALUES(40, 'Quickbooks', 'Setup');
42. INSERT INTO `subcategory` VALUES(41, 'Quickbooks', 'Configuration');
Now our tables have been configured and we are ready to start writing
the files to work with this database. First, we are going to write our
connection string in separate file to allow for easy modification and
also to be able to call the connection from any file by requiring it. Make
a file and call it connection.php
1.
2. <?php
3.
4. $servername='localhost';
5. $dbusername='servername_dbname;
6. $dbpassword='password';
7. $dbname='database name;
8.
9. connecttodb($servername,$dbname,$dbusername,$dbpassword);
10. function connecttodb($servername,$dbname,$dbuser,$dbpassword)
11. {
12. global $link;
13. $link=mysql_connect ("$servername","$dbuser","$dbpassword");
14. if(!$link){die("Could not connect to MySQL");}
15. mysql_select_db("$dbname",$link) or die ("could not open db".mysql_error());
16. }
17.
18. ?>
This simply sets the variable before running the connection string and
allows the connection to carry to another file. Make sure you change
you values in the first 4 declarations to the information needed to
connect to your database. You can test the connection by going
directly to that file. If you see nothing on the screen, the connection
worked. If not, an error will show on the screen. This is the end of that
file. Next we are going to create the html file that will actually display
the form to the users – note that you could do this in the same file, but
I felt for making it easy to understand, I would separate the files. I
called this file index.html.
1.
2. <html>
3. <head>
4. <title>Javascript Form Updater</title>
5. <script language="javascript" src="update.php"></script>
6. </head>
7.
8. <body bgcolor="#ffffff" onload="fillCategory();">
9.
10. <FORM name="drop_list" action="success.php" method="POST" >
11.
12. <SELECT NAME="Main" onChange="SelectCat();" >
13. <Option value="">Main</option>
14. </SELECT>
15. <SELECT id="Category" NAME="Category" onChange="SelectSubCat();">
16. <Option value="">Category</option>
17. </SELECT>
18. <SELECT id="SubCat" NAME="SubCat">
19. <Option value="">SubCat</option>
20. </SELECT>
21. </form>
22.
23. </body>
24.
25. </html>
This simply create the form in HTML and tells it were to get the
javascript, which is in update.php. Note that we do not have a button
to submit, you will need to add that and gather your POST variables on
another page which is ( in the tutorial) success.php. Now we need to
make update.php
1.
2. <?php
3.
4. require "connection.php";
5. echo "
6.
7. function fillCategory(){
8.
9. ";
This first section simply calls the connection file to establish the DB
connection and then beings the Jscript function. Notice that we are
using php to echo the function.
1.
2. $q1=mysql_query("select * from `group`");
3. echo mysql_error();
4. while($nt1=mysql_fetch_array($q1)){
5. echo "addOption(document.drop_list.Main, '$nt1[group]', '$nt1[group]');";
6. }
7. ?>
8. }
Next, we create the query that will bring back the original results for
the first drop-down box. We setup a while statement to keep adding
the option to the drop-down box until there are no more to add. This is
run every time the file is initially loaded. We do this using a javascript
function that we will declare at the bottom of the page.
1.
2. function SelectCat(){
3.
4. removeAllOptions(document.drop_list.Category);
5. addOption(document.drop_list.Category, "", "Category", "");
6.
7. <?
Next, we create the next function. This function is run every time the
group drop-down is changed.
1.
2. $q2=mysql_query("select distinct(`group`) from category");
3.
5.
6. echo "if(document.drop_list.Main.value == '$nt2[group]'){";
7. $q3=mysql_query("select category from category where `group`='$nt2[group]'");
9. echo "addOption(document.drop_list.Category,'$nt3[category]', '$nt3[category]');"
;
10.
11. }
12. echo "}";
13. }
14. ?>
15. }
This snippet selects each group from category only once (if it appears
more than once, it will still only show it to me once). Then it checks to
see if the value that it currently has is the value that is listed in the
initial drop-down box. If it is, it runs a query on the category table to
bring back all results that contains that group and adds them to the
drop-down box for the categories.
1.
2. function SelectSubCat(){
3.
4. removeAllOptions(document.drop_list.SubCat);
5. addOption(document.drop_list.SubCat, "", "SubCat", "");
6.
7. <?
8.
9. $q4=mysql_query("select distinct(`category`) from subcategory");
10.
12.
13. echo "if(document.drop_list.Category.value == '$nt4[category]'){";
14. $q5=mysql_query("select subcategory from subcategory where `category`='$nt4[
category]'");
16. echo "addOption(document.drop_list.SubCat,'$nt5[subcategory]', '$nt5[subcatego
ry]');";
17.
18. }
19. echo "}";
20. }
21. ?>
22. }

ASP & Java Script

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

ASP & Java Script

Hochgeladen von

Copyright:

Verfügbare Formate

What Is ASP?

Creating an ASP Document

ASP can connect to databases, dynamically format the page, execute

The appearance of an Active Server Page depends on what is viewing

The Most Common Mistake

<html> <body> <% response.write("Hello World!") %> </body>

Frequently Asked Questions

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

This will create the following fields:

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

Das könnte Ihnen auch gefallen

ASP &amp; Java Script

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

ASP &amp; Java Script

Hochgeladen von

Copyright:

Verfügbare Formate

What Is ASP?

Creating an ASP Document

ASP can connect to databases, dynamically format the page, execute

The appearance of an Active Server Page depends on what is viewing

The Most Common Mistake

<html> <body> <% response.write("Hello World!") %> </body>

Frequently Asked Questions

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

This will create the following fields:

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

view plaincopy to clipboardprint?

Das könnte Ihnen auch gefallen

ASP & Java Script

ASP & Java Script