Showing posts with label database with javascript. Show all posts
Showing posts with label database with javascript. Show all posts

Wednesday, April 24, 2013

How to connect DataBase with JavaScript

Note: This program will work only in Internet Explorer.

In this article I will explain how to connect to a SQL database with JavaScript and how to get data from the database.

First I create a database called EmpDetail. Then I created a table in this database. 

Query Code

CREATE TABLE [dbo].[emp](
      [id] [int] NULL,
      [name] [varchar](50) NULL,
      [salary] [int] NULL
) ON [PRIMARY]
Now insert some data into the emp table.
Complete Program
JavaScriptConnectivity.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" >
        function loadDB()
        {
            var connection = new ActiveXObject("ADODB.Connection");
          
            var connectionstring = "Data Source=.;Initial Catalog=EmpDetail;Persist Security Info=True;User ID=sa;Password=Micr0s0ft;Provider=SQLOLEDB";
            connection.Open(connectionstring);
            var rs = new ActiveXObject("ADODB.Recordset");           
            rs.Open("select * from emp", connection);
            rs.MoveFirst();
            var span = document.createElement("span");
            span.style.color = "Blue";
            span.innerText = "  ID "+"  Name "+"   Salary";
            document.body.appendChild(span);
            while (!rs.eof)
            {
                var span = document.createElement("span");
                span.style.color = "green";
                span.innerText = "\n " + rs.fields(0) +" |  "+ rs.fields(1) +" |  "+ rs.fields(2);
                document.body.appendChild(span);
                rs.MoveNext();
            }

            rs.close();
            connection.close();
        }
    </script>
    <style type="text/css">
        #main {
            height: 264px;
        }
    </style>
</head>
<body onload="loadDB()">
    <div id="show" style="font-size: x-large; font-weight: bold">
        Employee Details</div>
</body>
</html>

Output

 Result.jpg

Kashmir 370 and 35A : The Wound of india

क्या है जम्मू-कश्मीर में लागू धारा 370,35A पूर्ण विवरण Know about 370 act in Jammu एक बार फिर से राजनीति गलियारे में धारा 370,35A को ल...