Web Applications and Websites in Visual Studio

Web Application:

A web application is an application that is accessed by users over a network such as the Internet or an intranet. The term may also mean a computer software application that is coded in a browser-supported programming language (such as JavaScript, combined with a browser-rendered markup language like HTML). When we create web applications in visual studio it doesn’t ask where we want to deploy it. It deploy on by default folder (local). Vs web App is different from IIS web App. When we publish web Application it asks where we want to deploy it.

How to Create a Web Application:

1). Open Visual Studio.
2). Click on File -> New -> Project
webapp1
3). In the templates select Visual C# -> Web ->ASP.NET Empty Web Application and click ok.
webapp

Website:

A website, or web site, is a central location of various web pages that are all related and can be accessed by visiting the home page using a browser.There is a minor difference between web Application and website. Unlike web application when we create website it ask where we want to deploy it.
When we execute HTML page a website is created by default and a port is assigned to it.

How to Create a Website:
webs
webs1

Meta Tag:

Each web page has its own Meta tag which describes that page. It is used by search engines /crawlers from which crawler knows what page is about. It contains keywords such as author.

Schema:

Schema are HTML tags that webmasters can use to markup their pages in ways recognized by major search providers. It is also used by search engines. Schema is same for one category of pages.

Script tag and Html Attributes:

The <script> Tag :

The script tag has two purposes:
1. It identifies a block of script in the page.
2. It loads a script file.
What it does depends on the presence of src attribute.
src=”url”
The src attribute is optional. If it is present, then its value is a url which identifies a .js file. The loading and processing of the page pauses while the browser fetches, compiles, and executes the file. The content between the <script src=”url”> and the </script> should be blank.
If the src attribute is not present, then the content text between the <script> and the </script> is compiled and executed. In older versions of HTML it was necessary to specify a value for “type”. The scripting language is specified by the “type” attribute.
<script type=”text/javascript”>
// JavaScript code here
</script>
However in HTML5, “type” defaults to “text/javascript”. Therefore, HTML5 <script> tags can be shortened in the following fashion.
<script>
// JavaScript code here
</script>
By default script tag is for client side if we want it to run on server side we have to add attribute which tells it runs on server side.
The document.write method provides a way of incorporating strings into the HTML content of the page.This simply prints the specified text to the page.
<script>
document.write(‘*Hello, there!*’)
</script>

Changing HTML Content:

<!DOCTYPE html>
<html>
<body>
<h1>My First JavaScript</h1>
<p id=”demo”>
JavaScript can change the content of an HTML element.
</p>
<script>
function myFunction()
{
x=document.getElementById(“demo”); // Find the element
x.innerHTML=”Hello JavaScript!”; // Change the content
}
</script>
<button type=”button” onclick=”myFunction()”>Click Me!</button>
</body>
</html>
In this example we have assigned id to paragraph element which is demo. In the script tag we can also define funtions by using function keyword which is followed by the name of funtion myFunction in this case. The getElementById funtion returns html element having demo as id so in this case it returns paragraph element. The innerHTML funtion is used to change content of paragraph element.
Button tag <button> is used for buttons. Its onclick event is assigned funtion myFunction so whenever the button is clicked it calls the funtion.

Html Attributes:

The rel attribute is used to provide information about the relationship between the document that’s being linked to (as defined in the href attribute) and the referencing document.One of the most common uses of the rel attribute, in the context of the a element, is to specify a value of “nofollow”. This is to indicate to search engines that the linked document should not be indexed by the search engine, and that any reputation/value associated with the linking site is not passed on such that it benefits the linked page in search results.
The href attribute defines the document to which the link leads. This may be a web page in the same directory, a page somewhere else on the same server, a location within the current page, or a web page—or any another kind of document—stored on another server.

The Electronic-Shop Management System

Electronic Shop Management System
This article is about an electronic shop management system

Meher-un-nisa Tariq
Roll no: 031-bscs-2010
Section: A

Introduction:

This article is about an electronic-shop management system that manages all the buying and selling. This article helps us to develop an Electronic shop management system to manage Electronic shop. There is a many to many relationship that one customer can purchase many products and product of same type can also be purchased by many customers. Report can also be generated regarding purchases made by customer.

Tools:

  • Visual Studio 2010
  • Language: C#
  • SQL Server 2008 R2

Background:

pic1

This Electronic-Shop management system main page composes of options to add, remove and update customer and product. It also provides the options to purchase product and display report of a particular customer purchases.

Explanation:

When we click on the insert customer button a dynamically created form appears. This is created by creating an instance of Form and by calling its show function we make it appear on the screen.

Form insertc = new Form();

insertc.Show();

By using close function we can close the form

Insert.close();

pic2

All the record is entered in the field and when we click the insert button connection is created and all the record that is entered in the field is passed to the database of Electronic-Shop.

To build connection with database:

SqlConnection sqc = new SqlConnection(@”Data Source=local; Initial Catalog=ElectronicShop ;Integrated Security=True;”);

void insertc_Click(object sender, EventArgs e {

SqlCommand objsqlcommand;

DataSet ds = new DataSet();

SqlDataAdapter sqladap;

objsqlcommand = new SqlCommand(“InsertCustomer”,sqc);

objsqlcommand.CommandType = CommandType.StoredProcedure;

objsqlcommand.Parameters.Add(“@Customerid”, SqlDbType.Int).Value = Convert.ToInt32(id.Text);

objsqlcommand.Parameters.Add(“@Customername”, SqlDbType.NChar).Value = name.Text;

objsqlcommand.Parameters.Add(“@Phonenumber”, SqlDbType.NChar).Value = phoneno.Text;

objsqlcommand.Parameters.Add(“@address”, SqlDbType.NChar).Value = address.Text;

sqladap = new SqlDataAdapter(objsqlcommand);

sqladap.Fill(ds);

}

In the SqlCommand variable parameter we pass stored procedure and connection to database and using this variable we pass parameters to Electronic shop database.

If we click on the Delete Customer button of the main form the following form appears:

pic3

 

objsqlcommand = new SqlCommand(“DeleteCustomer”, sqc);

objsqlcommand.Parameters.Add(“@Customerid”, SqlDbType.Int).Value =Convert.ToInt32(id.Text);

The procedure DeleteCustomer takes customerid as parameter and delete the record of customer with current id.

If we click on UpdateCustomer button the following form appears:

pic5

the procedure UpdateCustomer takes CustomerId, CustomerName, PhoneNumber and Address as parameter and update the record of customer having entered id.

Similarly we can add, delete and update product.

If we click on the purchase product button the following form appears. Using the following code combobox is filled:

foreach (DataRow dr in ds.Tables[0].Rows)

{

cb.Items.Add(dr[“ProductID”].ToString() + ” ” + dr[“ProductName”].ToString());

}

 

pic6

pic7

 

pic8

 

pic9

 

The DisplayAvailableProduct Stored Procedure returns a table of all the Products Available for sale. We pass the variable of SqlCommand to the variable of SqlDataAdapter, the variable of SqlDataAdapter is used to fill the dataset. As the DisplayAvailableProduct procedure returns single table so ds.Tables[0] refers to the table returned, We fill the combobox with the returned ProductId and ProductName. When we select a particular product and click on price button the GetPrice procedure takes ProductId as parameter and returns the price of product having current id. The price is shown in MessageBox, after which we can click on the Purchase button to purchase the product.

If we click on the Display Report button the following form appears:

pic10

When we enter customer id and click on show button the report is generated as:

pic11

The procedure PurchaseBycustomers takes CustomerId as parameter and returns all the purchases done by particular customer. The Object of SqlCommand is passed to SqlDataAdapter which fills DataTable which is assigned to the dataGridView DataSource. To the export_datagridview_to_excel function we pass dataGridView and path of excel document as parameter, as datagridview datasource contains purchase details to it is used to export those details to excel by writing details in Excel. StreamWriter is used to open the excel file to write.

These lines are used to write columns name in Excel.

cols = dgv.Columns.Count;

for (int i = 0; i < cols; i++)

{

wr.Write(dgv.Columns[i].DataPropertyName.ToString().ToUpper() + “\t”);

}

These lines are used to write rows in excel.

for (int i = 0; i < (dgv.Rows.Count – 1); i++)

{

for (int j = 0; j < cols; j++)

{

if (dgv.Rows[i].Cells[j].Value != null)

wr.Write(dgv.Rows[i].Cells[j].Value + “\t”);

else

{

wr.Write(“\t”);

}

}

wr.WriteLine();

}

After completion of writing to Excel file the StreamWriter variable is used to close the document (For succession of entry in document it is necessary to close document after entry completion)

wr.Close();