CREATING WEB APPLICATIONS INPUT, EDIT, AND DELETE
USING DREAMWEAVER CS 3
1.Getting Started
Before starting to build a web application, it is necessary to prepare the supporting application. Among them is a browser application, web server, and its web design application. Here the authors use the Google Chrome application, Xampp version 1.6.6a, and Dreamweaver CS 3 for supporting applications. If not, can be downloaded on the internet for free.
2.Creating a Database
Please open google chrome then type localhost in the address bar and enter. view image
It will show
Then click phpMyAdmin
Create a database, for example with the name of the campus and create db
After creating the database, then create a table. Below is a draft of its table structure.
tbl_admin
Field name
Type and Long
Description
id
Int(2)
Admin id number (primary key, index)
user
Varchar(20)
password
Varchar(10)
tbl_mahasiswa
Field name
Type and Long
Description
nim
Varchar(12)
Student id number (primary key, index)
nama_mhs
text(100)
jns_klm
text(20)
ttl
varchar(50)
jurusan
text(100)
alamat
varchar(200)
Make a table in accordance with the structure of the table above. view image
Then click go
Do not forget the File Id changed to Primary dam in Extra set into auto_increment then save.
Picture table that has been made.
Make a table of students such as creating tables admin. When finished making all tables, insert data into the table admin demgan click insert:
Id : 01
User : admin 01
Password : admin 01
3.Preparation of Site
Before creating a site, open the Xampp folder -> htdocs, create a folder with the name of the campus and make a folder in the folder images campus. Jikas already create folders, open the application Dreamweaver CS 3. Follow the instructions below:
Click Site -> New Site
Click Advance and the nature of its settings (see picture)
Local Settings Info
Remote Settings Info
Testing Server settings
Once everything is set and then click ok.
4.Making Web Pages
Create a php page by clicking on the icon php
Click Page Properties for setting font, background, links and others
Click ok then save it as index.php in the folder campus. Then create a page save as home.php by way of the index.php page and create a page design.
Home.php page design using the facilities table, and set the background colornya.
Do not forget to save back. Create input.php page again by way of the page save as home.php.
Input.php page design begins by inserting a form and given the name of the student, and then insert a table into the form in accordance with the drawings. Remove first design student list.
Making the Radio Group
Making the List of Value
Do not forget to adjust its textfield name with the database name field, see example image
Likewise with other textfield, list / menu and text area.
5.Database Connection Settings
Application menu entry which is located on the top right corner and then click the plus sign (+), select MySQL Connection View images
Set as follows then ok, if there is confirmation just click ok.
If the connection is successful will appear as shown below
6.Commands Input Data
Open input.php page and then do settings. Click on the table input form will terblock Open input.php page and then do settings. Click on the table input form will terblock
Sign the Application menu and then enter the Server Behaviors and click Insert Record
Then set as image
If it is set click ok and do not forget to save.
Image input form students who are already active.
Go to page home.php
Sign the Application menu and then enter the Binding, click the plus sign (+) select Recordset (Query). view image
See the picture for the manufacture recordset (query)
If you are finished, click ok.
Pictures recordset students who are already active. Entering the student recordset file to mahasisw table on page home.php by clicking and drag and input according to the column. The results are as shown below
Open a browser and typing in the address bar localhost/campus/input.php
Input the following data:
NIM : MI-2015-0001
Nama : Ujang Yusmat
Jenis Kelamin : Laki-laki
Tempat, Tgl Lahir : Sukabumi, 21 Juni 1988
Jurusan : Manajemen Informatika
Alamat : Kp. Pasir RT. 002 RW. 004 Desa Bojonglongok
Kec. Parakansalak Kab. Sukabumi
Then click save
In the browser will be redirected to the page home.php
Go back into Dreamweaver CS3 applications and enable home.php page. Add script for automatic numbering in a way to enable in line No., then enter the menu code.
Script is added into such a fragment of the script above. After adding scripts, try to re-load the browser, it will look like this
Call again home.php page by typing in the address bar localhost / campus / home.php, and then fill in the following data:
NIM : KA-2015-0002
Nama : Deti Yulian
Jenis Kelamin : Perempuan
Tempat, Tgl Lahir : Sukabumi, 05 Desember 1985
Jurusan : Komputer Akuntansi
Alamat : Jl. Raya Siliwangi Km. 20 Cibaraja
Kec. Cisaat Kab. Sukabumi
Will appear in the browser
In the browser only displayed one record data only. To display the data already in the previous record, it is necessary to do a repeat region. view image
Block line and on the menu did repeat region server behaviors
Repeat Region
Please set the section show how data will be displayed. For example the data in the show only 2 records only. Means the data will be displayed only 2 record only. If you want to display all data records, click All Records.
Click ok and save again, then home.php page loads in the browser.
Add the data record to 6 records the data. Insert symbol (| > |) by typing in the bottom line of record
Then open one by one these symbols, and perform Paging Record command as shown below
Description :
|< : Move To Fisrt Page
> : Move To Next Page
>| : Move To Last Page
When finished, do not forget to put it back and the browser back yard home.php
Then click on the icon (| > |), then the data itself will change.
7.Enable Hyperlink
How to activate a hyperlink that blocks part into a hyperlink, and then drag
the hyperlink section. Suppose hyperlinknya Add Student enabled.
Click the hyperlink and drag and position on the page input.php and save.
Load the page home.php the make hyperlinks Added students already active.
Then do to hyperlink canceled in input.php and in home.php
8.Orders Edit Data
Create a page edit.php by way save as input.php page. Once created, remove the insert command his record.
Changing the edit form is to be like this
Create recordset student as shown below
Insert recordset (students) into the edit form by clicking a field and drag it into the text field respectively.
Click on the form to block the edit form, then enter the Server Behaviors and select Update Record
Then set as shown below
Click ok then save.
Go to page home.php, add text (edit and delete) on the line of action.
Create a hyperlink to edit the text block to edit and then click the folder to its hyperink
Then select the file edit.php and set the parameters by clicking on the parameters
Click ok and then save back yard home.php browser. Try hyperlinks Edit then automatically edited data will be displayed. Change the name of one of the data, then save. Check back data that has been changed. If the data changes, then edit the command successfully.
On page edit.php nim set the text field on the form becomes read only. Because nim usually can not be changed. You do this by right-clicking on the text field nim -> edit input tag -> CENTAK on the read only -> then ok and save.
9.Command Delete Data
Create a new page (blank) and then save it as hapus.php. Create recordset as making recordset for editing commands. Go to the Server Behaviors and select Delete Record. See settings below
Click ok and save. Create a hyperlink on a page delete home.php. Same way sepertri manufacture edit hyperlinks. They differ only in the selection of a file by selecting the file hapus.php
Home.php page browser, click a hyperlink to delete the data to be deleted. Automatically data will be immediately erased.
10.Creating the Printed Page
Create a page cetak.php to save as the index.php file, and create a table to display the data.
Create recordset and paste it into a table that has been made.
Recordset (mahasiswa)
Field record that is inserted
Then add the script to the numbering as already discussed on page home.php and do Repeat Region to display all of the data stored. Then the browser page cetak.php
Next live hyperlinks connecting section, the following hyperlink table for the menu:
Menu
Page
Beranda
beranda.php
Mahasiswa
home.php
Cetak
Cetak.php
Create a page beranda.php manner home.php save as from the yard. Change the display to be like this
To print a page hyperlink, at his target was changed to blank. How to block text that will be used as a hyperlink and click Insert -> Hyperlink. Set as shown below
Hyperlink Settings Print
11.Command User Login
Open the index.php page, the design as shown below, do not forget to start with the creation of a new form naming pasting table and its text field.
index.php page
Changing the type of text field to type the password into the password
Create a page gagal.php
Make the login command, following the steps
Block form on the page index.php
Then the Log Server Behaviors -> User Authentication -> User Login
Set as shown below
Then the browser page index.php
Please log in with a user that has been made.
Username : admin01
Password : admin01
If successful login it will look like this
If it fails it will look like this
12.Command User Logout
Open the pages and add text beranda.php Logout.
Blok text Log Out dan buat perintah Log Out User.
Set as shown below
If you've done index.php browser then enter the username and password. After a successful login to the page beranda.php click Log Out, it will automatically go out to the login page. Repeat the manufacture of Log Out on another page. After everything is done then to call the application just type localhost / campus / index.php browser address bar.
Thus a brief tutorial application making input, edit, and delete. Develop your skills with lots of practice to make other applications. Hopefully this book is useful for the readers.
This book contains step-by-step build simple applications in which there is no input process, edit, and delete. The steps in the pillowcase in detail with images that are easier to understand. As for this book include:
Getting started
Creating a database
Preparation of the site
Creation of web pages
Setting database connection
The command data input
Enabling hyperlink
commands edit data
Command delete data
Creating print page
Command log in user
The command logs the user out
Author & Publisher (2015)
Ujang Yusmat
HP. 085723036231