• c:\
  • wamp
    • www
      • phptutorials

Make sure you have wampserver started. you can navigate to http://localhost/ to make sure your server is running.
Ok so now with this said, we will start with a basic function.

• Open any text editor, I use notepad ++ but you can use Windows Notepad for this.
• Start your open and closing php tags


<?php
//php code should be between these tags.
?>


• In between the php tags type in the following function


function Message(){
echo 'Hello World';
}

The way i look at a function is like a box that can store all sorts of information and data.
Inside functions you can store variables which are also like small containers that can store information.
If you were to save and view this file in a browser you will get a blank screen, this is because we only created the box (function)
To call everything inside this function type in the following outside the function, after the curly brace }

Message();

Message is the name of the function and can be named whatever you want.
You may ask “how does it echo Hello World without having to echo the function”
When we call the function, the code inside the function executes, and because we have echo ‘Hello World’ that executes.
Full code

function Message(){
echo 'Hello World';
}
Message();

Creating Our Module Structure

• From your solution explorer right click on your project name
• Click Add => New Folder
• Name it anything you want, i named mine Modules
• Right Click on the Modules folder or whatever you named it and choose Add => Module…
• Name it whatever you want, i just named mine”Added” without the double quotes

New Module

Once you click Add, your new Module should be created and should look like this

New Module File

Now that we have our Empty Module created the first thing we need to do is add a new Method.
Within our Method will contain the code we want to execute when we call that method, so to create the method insert this line of code between the Module End Module block

Public Sub MsgAdded()

End Sub

MsgAdded is the method we will call on our submission from whatever form we want.
The next thing we need to do is create a new form instance, this will be the form that will be displayed when we call it.
Remember, this form will not be added to our project.

Dim AddedMessage As New Form

Now that we have added a declaration as a new form we now need to set some properties for that form, so lets do that.

AddedMessage.Name = "FormMessage"
AddedMessage.Text = "Contact Added"
AddedMessage.Size = New Size(313, 123)
AddedMessage.FormBorderStyle = FormBorderStyle.FixedDialog
AddedMessage.StartPosition = FormStartPosition.CenterScreen
AddedMessage.MinimizeBox = False
AddedMessage.MaximizeBox = False
AddedMessage.BackColor = Color.White
AddedMessage.ShowIcon = False
AddedMessage.Show()
AddedMessage.TopMost = True

Let me explain what these properties are and why they are set.

	VALUES
AddedMessage.Name	Identifies the control by the Name property
AddedMessage.Text	The text that is displayed in the title bar
AddedMessage.Size	Over rides the default form size, if not set, default size will be initiated
AddedMessage.FormBorderStyle	Sets the Border style of the fom
AddedMessage.StartPosition	Sets the positioning of the form when called
AddedMessage.MinimizeBox	Determines if the Minimize button is visible or not, Values are Boolean (True or False)
AddedMessage.MaximizeBox	Determines if the Maximize button is visible or not, Values are Boolean (True or False)
AddedMessage.BackColor	Sets the background color of the form
AddedMessage.ShowIcon	Determines weather to show the icon in the title bar or not, Values are Boolean(True or False)
AddedMessage.TopMost	Determines if the form should always remain over top of other windows

Our new form is now set and can now be called by calling MsgAdded()

Now lets go a head and create our message to be displayed.
We are just going to use a Label control, and we are going to create this essentially the same way we did the form.
The first thing we need to do is create our Label to hold our message.
Insert this below AddedMessage.TopMost = True

Dim MessageLabel As New Label
Now we need to set some properties of our label.


MessageLabel.Name = "LabelMessage"
MessageLabel.Text = "Contact Has Been Saved Successfully"
MessageLabel.Width = AddedMessage.Width
MessageLabel.Location = New Point(55, 41)

Now that our label message has been created we have to tell the form to add the label to the form.
Under MessageLabel.Location = New Point(55, 41 insert this

AddedMessage.Controls.Add(MessageLabel)

Now when we call the new form, the form will add the Label control.
Remember, MessageLabel is the name of the label we created.
Anytime you add controls to a form this way you need to specify the Name of the control you want to be added inside the Controls.Add(ControlName) method.

So far we have accomplished the following tasks

1. Created a new Form
2. Set properties to our new form
3. Created a message that will be stored in a label control
4. Set the properties of the Label control
5. Told our new form to add the Label control

The final task we need to is trigger a event to call our new form, this part is pretty easy and it can be used on any form you have in your project.

• Open your Form1
• Drag a button on to your form
• Double click on the button to create a Button1_Click event
• Type in the following code
• MsgAdded()

Run the application (F5) or click the little Green Play Button at the top
When you click the button you will see your new form appear.

This concludes another Visual Basic tutorial.
I hope that you find use of this tutorial and can use this within your own project(s)

Ready State example of use:
Declare 4 variables, 1 for each state.

Dim Complete As String = WebBrowser1.ReadyState = WebBrowserReadyState.Complete

Dim Interactive As String = WebBrowser1.ReadyState =
WebBrowserReadyState.Interactive

Dim Loaded As String = WebBrowser1.ReadyState =
WebBrowserReadyState.Loaded

Dim Loading As String = WebBrowser1.ReadyState =
WebBrowserReadyState.Loading

Use your declarations in If  statements


If Interactive Then Me.Text = "Not yet loaded"

ElseIf Complete Then Me.Text = "Ready"

End If

In this tutorial i will show you how you can control a home page content based
website.

What we will be doing is instead of having our content programaticly filled in,
it will be filled using a database.

Creating The Database

• Fire up Visual Studio 2010 or Visual Web Developer 2010
• Create a ASP.NET Website NOT a ASP.NET Blank Website
• Once your project has been created right click on App_Data folder -> Add New
  Item
• Select SQL Server Database
• Give it a name than click Add
• Right click on Tables and choose Add New Table (Figure 1.0)
• 

  Figure 1.0

• You should see 3 Columns now (Column Name, Data Types and Allow Nulls)
• Fill out the columns as they are shown in the table below
• 1) IS 2)PK
  • Identity Specification = Yes
  • Primary Key

• Once you have this complete click the Purple save disk at the top
• Give your table a name, i named mine aspx_Content
• Close the window than click on the Tables folder to expand (Figure 1.1)
• 
• Right click on your new table and choose Show Table Data
• Insert a sample record in to the Caption and Content field than close it out

Now that we have completed the Database set up it’s time to create the content
section on the home page of our website.

Creating Content Section

• From your Default.aspx page drag a DataList control from the Toolbox in the Data
  section on to your form
• Click the little arrow that appears on the DataList control to get the Smart
  Task
• From the Data Source drop down list choose <New data source…>
• Click on Database (Figure 1.2)
• 
• Click Ok
• In the next dialog from the Drop down list box choose your database from the
  list and click Next
• In the next window (Select Statements) leave the * radio box checked as this is
  the Wild card and will select all fields
• Click the Order button (Optional) and you can choose which field you want to
  Order By.
• Click Next than click Finish

You should now see your DataList on your form populated (Figure 1.3)

If you press F5 on your keyboard or click the little Green Play Button to run
your site you should now see 1 record (The record you inserted manualy)

Now that we have our home page completed by displaying our content lets create
the Admin section of our website where we can add Edit our content.

Note that we are only going to work on the Edit functionality because if we want
to modify our content we can just modify it.

Adding new entries would be useful for blog posts, news posts, site update posts
etc.

Creating The Admin Section

• In your Solution Explorer, right click and choose New Folder
• Name it something like Admin
• Right click on the Folder and click Add New Item
• Choose Web Form
• Name it Edit_Content.aspx and click Add

Adding Content Functionality

• From your Toolbox drag and drop a FormView control on to your form
• Repeat the steps above highlighted in the Green
• After you followed those steps you want to click the Advanced button
• Select both check boxes

  This allows you to add, modify and delete records

• Click Next than Finish
• With the FormView selected go in to your properties window (Figure 1.4)
• Choose Default Mode from Read Only to Edit
• 
• Now that you have set this when you run this page this will always display in
  Edit Mode.
• With the FormView still selected click the little Arrow to pull up the FormView
  Tasks option
• Click Edit Templates
• From the Display: combo box change it from ItemDisplay to InsertItemDisplay
• You should now see 2 text boxes.

You can format these fields in which ever way you want.

How you format these fields is how they will be displayed at runtime

This is a short tutorial on how you can make your site content run off your
database.

The advantage to something like this is the ability to change your content as
often as you want without having to programaticly change it.

Here’s a comparison of Programaticly Inserting Content to Data Inserting Content

As you see there are the same number of tasks to do however if we take a look at
how many seconds to minutes each task takes will make up, inserting content
programaticly will take longer by far.

Well, this concludes this tutorial.

I hope it has helped you in some way.

This tutorial was created to display how you can create your home page content
using a database and how you could change your home page content at any time
from your Admin Panel.

Thank You for viewing this tutorial.

• ASP.NET

asp.net provides a wide source of information regarding asp.net and the .NET framework.
You will find downloadable controls for your asp.net applications, video tutorials, written tutorial, AJAX tutorials and a whole lot more.
This is a great site no matter the level of experience you have.

Platform: Visual Studio/Visual Web Developer, AJAX

• YOUTUBE.COM

You can find many many videos on a site i’m sure we’re all familiar with.
Just about anything you’re looking for can be found here.

Platform: Any

• MSDN.COM

This is the site where you can find great tutorials.
The link here takes you to the How Do I Video Series section

Platform: Visual Basic

• WINDOWSCLIENT.NET

This site is similar to asp.net but focuses on Visual Basic, also known as Winforms.
Here you will find controls you can download and use throughout your visual basic projects.
You will also find videos that focus on WPF (Windows Presentation Foundation)

Platform: Visual Basic

• LEARNVISUALSTUDIO.NET

Now this website would have to be one of my ultimate favorites.
This website is what got me more into asp.net and visual basic at the same time.
Bob Tabour is the creator of these videos and he provides high quality, descriptive and step by step tutorials.
Most if not all of his tutorials include project files to help you get your hands dirty and get right involved.
These videos are not streaming from the site but is downloaded to your computer to ensure you can still learn while offline.

Platform: Visual Basic, Visual Web Developer, Visual Studio, SQL Server, WPF,

Below is a poll i would like you guys to take.
This will better help me provide the type of tutorials that help you guys.

Note: There is a poll embedded within this post, please visit the site to participate in this post's poll.

View Full Size

There are 2 styles we are going to look at

1. Drop Shadow
2. Rounded Corners

This will not be done using any images, it’s going to be CSS3.

Note! These styles will not be picked up in the current or previous versions of Internet Explorer 8.0
When applying any CSS3 styles to your web apps, make sure those items can be displayed correctly in internet explorer as well.
The image you see above will be displayed in IE without the drop shadow and rounded corners.

With all that out of the way, lets get started.

• Fire up Visual Web Developer 2010 or Visual Studio 2010
• Create a new project or a new Website (Shown in Screen 1.1

• Once your website has been created navigate to
  • Styles -> Site.css and double click it to open it.
• There are 2 css classes we need to modify
  1. page
  2. header
• Scroll down to the page class (it should look like this:


.page
{
width: 960px;
background-color: #fff;
margin: 20px auto 0px auto;
border: 1px solid #496077;
}


• Under the border:  1px solid #496077; add these 4 lines

-moz-border-radius: 12px;
-webkit-border-radius: 12px;
-moz-box-shadow: 15px -15px 9px #333;
-webkit-box-shadow: 15px 15px 9 #333;
-moz is mozilla based web browser and -webkit is safari, chrome based browsers

• Scroll down to the header class (it should look like this:)


.header
{
position: relative;
margin: 0px;
padding: 0px;
background: #4b6c9e;
width: 100%;
}

• Under the background: #4b6c9e; add these 2 lines

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
You may need to adjust the 10px to a lower or higher number to look the way you want it to.
Now if you save your Site.css file and view your default page or some other page in a browser outside of IE you should now see the changes take effect.

The page class is the page itself where everything is located (menu, content area, footer etc.)
That’s where we want the drop shadow to appear as well as the rounded corners.
Here’s the comparison in browsers between Firefox and IE

Firefox 3.6.3

Internet Explorer 8.0

To get more information and more goodies using css3 visit the css3.info website.
You can apply more styles to your website to make it look much nicer.
Hopefully this tutorial has helped in spicing up your website.

Visual Controls

If you take a look in your Toolbox, you will notice a Login section.
This is where all your login controls are stored.

Login Controls

These are the controls that allow you to run a standard membership based website.
Don’t be fooled by this by thinking this is all that’s offered for our membership system cause it’s not.
There’s a ASP.NET Configuration Tool that’s available for us that lets us do a lot more, we will get into that later on.
Lets take a look at these controls and see what they do

Change Password

When you drag a instance of the ChangePassword control onto your form it will create a template with the appropriate fields that will change your password on request

Change Password

Create User Wizard

When you drag a instance of the CreateUserWizard on to your form it will create a template with the appropriate registration fields.
There are several customizable options that are available for this control.
If you click on the little Arrow at the top right corner of the control you will see a list of customizations you can make.

Create User Wizard

Login

This control is the user Login section.
This control provides the standard User Name and Password fields.

Login

Login Name

When you drag a instance of the LoginName on to your form it will display the current logged in User Name.
This kind of control can be used several times on any given page.
When you drag it on to your form you will see something that looks like this

[LoginName]

Login Status

When you drag a instance of the LoginStatus on to your form it will display your status.
You can click on the control on the form and click the Arrow, you will notice you have 2 views

1. Logged Out
2. Logged In

What you see is what the user will see when they visit your website.
If you click on the links and check out the properties window, you can set properties for that control.

Login Status Properties

Login View

This is a important control when enabling your site with the membership system.
The LoginView control comes with 2 templates

1. Anonymous Template
2. Logged In Template

By default, when you drag this on to your form it’s set to the Anonymous Template.
Anything you put in here will be viewable to users NOT logged in
If you switch to the Logged In Template, anything you put in here will be viewable to Logged in users only.
You can use many of  these controls on any given web page.
This allows you to protect your content and control who can and can’t see certain content within your website.

Not Logged In

Password Recovery

Like the other controls i talked about, this one works the same way.
When you drag a PasswordRecovery control on to your page it will create a wizard like control.
This allows you to recover your password providing the security question is answered correctly.

Password Recovery

Visual Controls In Source Code

If you prefer to code as much as you can in Source View mode than adding these controls are easy.
I will show you the code that makes up each of these controls.
If you have dragged any of the above controls on to your form and you switched to Source or Code view than some of these will look familiar.

Change Password

<asp:ChangePassword ID=”ChangePassword1″ runat=”server”>
</asp:ChangePassword>

Create User Wizard

<asp:CreateUserWizard ID=”CreateUserWizard1″ runat=”server”>
<WizardSteps>
<asp:CreateUserWizardStep runat=”server” />
<asp:CompleteWizardStep runat=”server” />
</WizardSteps>
</asp:CreateUserWizard>

Login

<asp:Login ID=”Login1″ runat=”server”>
</asp:Login>

Login Name

<asp:LoginName ID=”Loginname1″ runat=”server” />

Login Status

<asp:LoginStatus ID=”LoginStatus1″ runat=”server” />

Login View

<asp:LoginView ID=”LoginView1″ runat=”server”>
<AnonymousTemplate>

</AnonymousTemplate>
<LoggedInTemplate>

</LoggedInTemplate>
</asp:LoginView>

Password Recovery

<asp:PasswordRecovery ID=”PasswordRecovery2″ runat=”server”>
</asp:PasswordRecovery>

So you can see how easy it is to add these controls to your webform easily.
After adding in your code and going back to Design Mode, you will see the control sitting on your form.
You can click on it to access the properties for that control.

If you used VS2010 and created a asp.net blank website you will need to add these controls to the pages than configure the site to use the memebrship system.
You can access the asp.net configuration tool by going to your Solution Explorer.
Located to the top are some icons, click the globe and hammer icon.
This will open your asp.net configuration tool via web browser.

If you create a asp.net website a default site will be created with all the login controls added, pages created that hold some of these controls and the asp.net configuration tool is already configured.
All you have to do now is press F5 or right click and choose View In Browser.
You will now be able to register, login etc.

This tutorial was focused on the login control inside Visual Studio 2010.
The controls are also available in 2005 and 2008 as well as Visual Web Developer.
This tutorial does not focus on the asp.net configuration tool.

Note!
This tutorial was created to show users how to connect their desktop application to a server hosted at winhost.com
This tutorial does not cover the uploading proccess of your application.
The uploading proccess can be done using the Click Once feature built in to Visual Studio

Something Useful

This tutorial uses the following requirements and they should be used by you to ensure it will work correctly.

• Visual Studio 2010
• .NET Framework 4.0
• SQL Server Management Studio 2008

With that out of the way now, lets get started on the tutorial.

Step 1 – Setting up the server to work with this

Once you have your host created at Winhost navigate to the control panel and login
After logging in click on Sites tab.
You should now see a list of domains you have assigned to your account

Click on the Manage link and that will take you to the management section of that domain.
This section allows you to configure your site.

The first thing we are interested in is configuring the .NET framework we want the server to use.
Click on the ASP.NET Version icon
From the ASP.NET Framework Version dropdown list choose 4.0 than click Update.
Now our server is ready to use applications created using the .NET Framework 4.0

There’s one more thing we need to set up…A database.
Click on the MS SQL 2008 icon.
Click the Add button.
In the Database Name field type in the name of the database you want to create.
You can type in any name you want.
Now click Create.

Now you have your database set up, we can now minimize our web browser for now and load up Visual Studio.
We will need to go back into our control panel once we’re done with our application to grab the details of our database.

Step 2 – Creating your data application

Once you have VS open you can go a head and create your application.
Once your application is complete we will need to modify the Connection String in the app.config file.

Step 3 – Modifying the App.config file

Now that you have your application created we need to use the connection string that we were given when we created our database on Winhost.
So go back to your control panel and go back to your MS SQL 2008.
Click on the Manage link to manage the database.
You should now see your database details, such as

• Server name
• Database name
• Database user etc.

You need to grab the complete connection string

“Data Source=???:???.winhost.com;Initial Catalog=DB_8754_databasename;User ID=DB_8754_databasename_user;Password=******;Integrated Security=False;”

Jump back to your project and open the App.config file.
You should see a connection string within the <connectionStrings> attribute.
Replace everything after connectionString= with the connection string you coppied from your control panel.
The complete connection string should look something like this

connectionString=”Data Source=???.winhost.com;Initial Catalog=DB_8754_databasename;User ID=DB_8754_databasename_user;Password=password”
providerName=”System.Data.SqlClient” />

Now go a head and save your project.
We are now ready to attach our database to the server.

Step 4 – Attaching our database to the server

In your Visual Studio click on the Server Explorer tab.
You should see your database listed here.
Right click on it and choose Publish To Provider
Your database should be selected by default, if it isn’t go a head and select it.
Now you can click Next to choose a path where you want the script file to be generated to.
You can now click Finish and it will start gether all the Objects.
Once this is complete successfully you will see a .MDF.sql file wherever you told it to download to.
The next thing we need to do is tell the server our database is being hosted on to use this database, so lets do that now.

• Open SQL Server Management Studio
• In the Connect to Server dialog just click Cancel for now.
• At the top click on File => Open => File
• Browse for the .MDF.sql file you downloaded earlier.
• You will now be asked to connect to a server.
• Go back to your Winhost control panel => Site Manager => MSSQL 2008
• Click on the Manage link beside your database
• Copy the Database Server name and go back to SQL Server Management Studio and paste it in the Server Name field (See screenshot 1.1)
• Go back to your control panel and grab the Database Username and paste that in to the Login field
• Now put in your password (This is the same as your login password to the control panel)
• Also make sure Authentication is set to SQL Server Authentication and click Connect
• You will now see a list of queries. (See screenshot 1.2)
• At the very very top of that window type in the following

USE databaseName
GO

• Now at the top, click on Execute
• The command should be executed successfully

Screen 1.1

Screen 1.2

Your database is functional on your server and is now ready for use.
Now if you go back to your VS => Server Explorer and you create a new database connection, you will now be able to interact with the database that’s on the server.
When you make changes to the database they will be applied automatically on the server end.
You can also do your Database Management from SQL Server Management Studio by connecting to it the same way we did previously.
All that is left now is for you to upload your project to your server.
I hope you enjoyed this tutorial and i hope it has helped you out in some way.