Pages

Friday, April 19, 2013

Display Records in HTML TextBox in PHP


IntroductionMainly, the concept of this article is to provide you, how to handle html related application with use of PHP script as well as how to manage "mysql" database tables data with html and PHP script. Basically in this article, I taking the concept about Bank account details search. If if talk about account details, then what things will come in our minds, Basically we required a unique account no of the user, and the behalf of this account no; a bank employer find out the details of this account no user. 

So first I design a simple form with the help of Html and PHP script for taking input as a account number to find out hole detail of the corresponding user.

Design Script
In this script, I taking a one html textbox and a submit button, the textbox is responsible for accepting account no and button is responsible to submitting this page value on next page, which is specifies in the html form tag and  I also set the table background image. Now you can easily write the script and save it into www root directory with the name of "fill.php", such as I do.
<html>
<body>
<form action="search.php" method="post">

   <table style="color:purple;border-style:grooveheight:150px;width:350px" background="backimage.jpg">
            <tr>
                <td style=" height:25pxfont-family:'Copperplate Gothic Bold'">&nbsp;</td>
            </tr>
            <tr>
                <td style="color:red;background-color:aqua;height:25px">Enter Account no&nbsp;&nbsp;&nbsp;&nbsp;
                    <input name="name" id="name" type="text"/></td>
            </tr>
            <tr>
                <tdstyle="height:25px">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                           <input type="submit" value="Submit" style="color:white;background-color:brownheight:30px"/></td>
            </tr>
        </table>
</form>
</body>
</html>Output
search-form.gif

Now after the compilation of the  "fill.php" page, simple write the account number and click on submit button. which will responsible to redirect on new page name as "serach.php", and this form is used to display all information about the corresponding account number user.  

Now firstly I shown you how to design mysql database table related to user account details, Here I shown you image of database table with filled values, with the help of this you can design your account details table.
database-table-design.gif

After the database designing, Now I will tell you, how to design a from to displaying all details of the user, which is fetch from mysql  database table on the behalf of account number.  I added script here, So in this code I simply retrieve data from mysql database, and that code I write with in PHP script. In the query

"select * from accoundtl where account_no='$_POST[name]'
"; 

$_POST[name] accepts the account no from the "fill.php" page textbox. So it easily compare with column "account_no" of the "accountdtl" table and returns the corresponding matched values. The returned result is accepts with the help of "musql_fetch_array()" function, and this returns result is accepts individually (means each columns value) accepts by the variables. So completing of it, Lets talk about html design part, so in this part I takes number of textboxes which is accepts those columns value, which is stored in the PHP variables with the help of this code
<input id="Text1" type="text" value='<?php echo  $accountnumber; ?>'/>
The above declared textbox code simply display the table columns value , which is previously stored in the PHP variables. And it do with all textboxes, which is define below.
Code
<?php
$con = mysql_connect("localhost","root","");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("mysql", $con);
$con = mysql_connect("localhost","root","");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("mysql", $con);
//$sql="select * from accountdtl";
$result = mysql_query("select * from accountdtl where account_no='$_POST[name]'");
while($rowval = mysql_fetch_array($result))
 {
$accountnumber= $rowval['account_no'];
$title= $rowval['title'];
$fname= $rowval['fname'];
$lname= $rowval['lname'];
$add1= $rowval['address1'];
$add2= $rowval['address2'];
$town= $rowval['town'];
$country= $rowval['country'];
$pin= $rowval['pcode'];
$mob= $rowval['con_no'];
$mailid= $rowval['mail_id'];
$uname= $rowval['uname'];
$balance= $rowval['balance'];
}
mysql_close($con);

?>
<html>
<body>
<from >

  <table  style="color:purple;border-style:grooveheight:150px;width:350px" background="3.jpg">
        <tr>
           
            <td style="font-family:Copperplate Gothic Bold">&nbsp;</td>
        </tr>
        <tr>
            <td style="color:red;background-color:aqua;" class="auto-style3">Account no:</td>
            <td class="auto-style4">
                <input id="Text1" type="text" value='<?php echo  $accountnumber; ?>'/></td>
        </tr>
        <tr>
            <td style="color:red;background-color:aqua;" class="auto-style3">Title</td>
            <td class="auto-style4">
                <input id="Text2" type="text" value='<?php echo  $title; ?>'/></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">FirstName:</td>
            <td class="auto-style4">
                <input id="Text3" type="text" value='<?php echo  $fname; ?>' /></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">Surname:</td>
            <td class="auto-style4">
                <input id="Text4" type="text" value='<?php echo  $lname; ?>' /></td>
        </tr>
        <tr>
            <td style="color:red;background-color:aqua;" class="auto-style3">Address Line 1:</td>
            <td class="auto-style4">
                <input id="Text5" type="text" value='<?php echo  $add1; ?>' /></td>
        </tr>
        <tr>
           <td style="color:red;background-color:aqua;" class="auto-style3">Address Line 2:</td>
            <td class="auto-style4">
                <input id="Text6" type="text" value='<?php echo  $add2; ?>' ></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">Town:</td>
            <td class="auto-style4">
                <input id="Text7" type="text" value='<?php echo  $town; ?>'/></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">Country:</td>
            <td class="auto-style4">
                <input id="Text8" type="text" value='<?php echo  $country; ?>' /></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">Post Code:</td>
            <td class="auto-style4">
                <input id="Text9" type="text"  value='<?php echo  $pin; ?>'/></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">Contact Number:</td>
            <td class="auto-style4">
                <input id="Text10" type="text" value='<?php echo  $mob; ?>'/></td>
        </tr>
        <tr>
            <td style="color:red;background-color:aqua;" class="auto-style3">Email Address:</td>
            <td class="auto-style4">
                <input id="Text11" type="text" value='<?php echo  $mailid; ?>'/></td>
        </tr>
        <tr>
             <td style="color:red;background-color:aqua;" class="auto-style3">User Name:</td>
            <td class="auto-style4">
                <input id="Text12" type="text" value='<?php echo  $uname; ?>'/></td>
        </tr>
        <tr>
            <td style="color:red;background-color:aqua;" class="auto-style3">Balance:</td>
            <td>
                <input id="Text13" type="text" value='<?php echo  $balance; ?>' /></td>
        </tr>
        <tr>
            <td></td>
        </tr>
    </table>
</form>
</body>
</html>
Output
Fill account no corresponding to search button

fill-account-no.gif


After click on Button, The output will look like:


display-table-data.gif

No comments:

Post a Comment