Creater Site

Sunday 19 June 2016

Ajax dropdown with image upload

index.php

<?php
error_reporting(0);
include('conn.php');
if(isset($_POST['submit'])!="")
{

    $categorys=$_POST['categorys'];
    $selects=mysql_query("select * from categories where cat_id='$categorys'");
    $ro=mysql_fetch_array($selects);
    $cat_name=$ro['cat_name'];

    $sub_category=$_POST['sub_category'];
    $selectss=mysql_query("select * from sub_categories where sub_cat_id='$sub_category'");
    $ros=mysql_fetch_array($selectss);
    $sub_cat_name=$ros['sub_cat_name'];

    $price=$_POST['price'];
    $quantity=$_POST['quantity'];
    $total=$_POST['total'];
    $image=$_FILES['image']['name'];
    $tmp_name=$_FILES['image']['tmp_name'];
    $dir='upload/'.$image;
    move_uploaded_file($tmp_name,$dir);
    $insert=mysql_query("insert into demo(category,sub_category,price,quantity,total,image,category_name,sub_cat_name) values('$categorys','$sub_category','$price','$quantity','$total','$image','$cat_name','$sub_cat_name')");
    if($insert)
    {
        echo "inserted";
    }
    else
    {
        echo "not inserted";
    }
}?>
<?php
/*if(isset($_POST['search_list'])) {
        if(trim($_POST['category'])) {
            $con[] = " category_name LIKE '%".trim($_POST['category'])."%' ";
        }
        if($con) {
            $condition = " WHERE ";
            $condition .= implode(" AND ", $con);
        }}
        $query4 = "SELECT * FROM demo $condition ORDER BY category ASC";
    $result4 = mysql_query($query4);
    while($row4 = mysql_fetch_array($result4)) {
        $city[] = $row4;
    }*/
?>
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title>Ajax Table Editing</title>
<style>

.editbox
{
display:none
}
td
{
padding:5px;
}
.editbox
{
font-size:12px;
width:120px;
background-color:#ffffcc;
border:solid 1px #000;
padding:4px;
}
.edit_tr:hover
{
background-image:url(download.jpg) right no-repeat;
cursor:pointer;
}
*{
    font-family: verdana;
    font-size: 12px;
}
input[type='button']{
    background: #5B8EEE;
    width: 90px;
    height: 30px;
    border: 1px solid #CBDBFA;
    color: white;
    font-weight: bold;
    margin-right: 10px;
}
.table-list{
    font-family: verdana;
    font-size: 12px;
    border: 1px solid #EAEAEA;
    padding: 2px;
}
.table-list th{
    background: #EDF2F6;
    border-bottom: 1px dotted #DDDDDD;
    color: #444444;
    font-size: 12px;
    font-weight: normal !important;
    height: 28px;
    line-height: px;
    padding-left: 5px;
    text-align: center;
}
.table-list td{
    border-bottom: 1px dotted #EAEAEA;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    height: 28px;
    padding: 5px;
    text-align: center;
}
.table-list tr:hover{
    background: #E3F3F9;
}
.entry-form{
    background: #EDF2F6;
    width: 350px;
    padding: 10px;
    border: 5px solid #C5D7E2;
    box-shadow: 3px 3px 5px #888;
    position: absolute;
    top: 25%;
    left: 35%;
    display: none;
    border-radius: 5px;
}
.entry-form input[type='text']{
    border: 0px solid #BBBBBB;
    box-shadow: 2px 2px 4px #C5D7E2 inset;
    height: 25px;
    width: 100px;
}
.entry-form input[type='text']:focus{
    border: 1px solid #C5D7E2;
}

#main {
padding: 10px;
margin: 100px;
margin-left: 300px;
color: Green;
border: 1px dotted;
width: 520px;
}
#display_results {
color: red;
background: #CCCCFF;
}
</style>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".edit_tr").click(function()
{
var ID=$(this).attr('id');
$("#category_"+ID).hide();
$("#sub_category_"+ID).hide();
$("#price_"+ID).hide();
$("#quantity_"+ID).hide();
$("#total_"+ID).hide();
$("#category_input_"+ID).show();
$("#sub_category_input_"+ID).show();
$("#price_input_"+ID).show();
$("#quantity_input_"+ID).show();
$("#total_input_"+ID).show();
}).change(function()
{
var ID=$(this).attr('id');
var category=$("#category_input_"+ID).val();
var sub_category=$("#sub_category_input_"+ID).val();
var price=$("#price_input_"+ID).val();
var quantity=$("#quantity_input_"+ID).val();
var total=$("#total_input_"+ID).val();
var dataString = 'id='+ ID +'&category='+category+'&sub_category='+sub_category+'&price='+price+'&quantity='+quantity+'&total='+total;
$("#category_"+ID).html('<img src="load.jpg" />'); // Loading image

if(category.length>0&& sub_category.length>0&&price.length>0&&quantity.length>0&&total.length>0)
{

$.ajax({
type: "POST",
url: "inline.php",
data: dataString,
cache: false,
success: function(html)
{
$("#category_"+ID).html(category);
$("#sub_category_"+ID).html(sub_category);
$("#price_"+ID).html(price);
$("#quantity_"+ID).html(quantity);
$("#total_"+ID).html(total);
}
});
}
else
{
alert('Enter something.');
}

});

// Edit input box click action
$(".editbox").mouseup(function()
{
return false
});

// Outside click action
$(document).mouseup(function()
{
$(".editbox").hide();
$(".text").show();
});

});
</script>




<link rel="stylesheet" href="css/style.css">
</head>
<script>
function showCustomer(str)
        {
        var xmlhttp;
        if (str=="")
          {
          document.getElementById("txtHint").innerHTML="";
          return;
          }
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","ajax_cat.php?q="+str,true);
        xmlhttp.send();
        }
        </script>
<script>
function showSearch(str)
        {
        var xmlhttp;
        if (str=="")
          {
          document.getElementById("txtHint1").innerHTML="";
          return;
          }
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("txtHint1").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","ajax_search.php?q1="+str,true);
        xmlhttp.send();
        }
        </script>

        <script>
function showSearchs(str)
        {
        var xmlhttp;
        if (str=="")
          {
          document.getElementById("txtHint2").innerHTML="";
          return;
          }
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("txtHint2").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","search.php?q2="+str,true);
        xmlhttp.send();
        }
        </script>

<script type="text/javascript">
function calculate() {
var myBox1 = document.getElementById('box1').value;
var myBox2 = document.getElementById('box2').value;
var result = document.getElementById('result');
var myResult = myBox1 * myBox2 ;
result.value = myResult;
}
</script>

</head>
<body>
<div>
    <form name="form" method="post" enctype="multipart/form-data">
<p><label for="category">Category</label>
<select name="categorys" onChange="showCustomer(this.value)">
<option value="">--select--</option>
<?php
$select=mysql_query("select * from categories");
while($cat=mysql_fetch_array($select))
{
?>
<option value="<?php echo $cat['cat_id'];?>"><?php echo $cat['cat_name'];?></option>
<?php }?>
</select>
</p><p>
<label>Sub Category</label>
<p id="txtHint">
    <select name="sub_category">
<option><----Select----></option>
    </select>
</p></p>
<p><label>Price</label>
<input id="box1" type="text" name="price" oninput="calculate()" />
</p>
<p><label>Quantity</label>
<input id="box2" type="text" name="quantity" oninput="calculate()" />
</p>
<p><label>Total</label>
<input id="result" name="total"/>
</p>
<p><label>Image Upload</label>
<input type="file" name="image" value=""/>
</p>
<p><input type="submit" name="submit" value="Submit"/></p>
</div>

<br>
<tr>
<td><select name="search" onChange="showSearch(this.value)" >
    <option value=""><----Search----></option>
    <?php
$selects=mysql_query("select * from categories");
while($cats=mysql_fetch_array($selects))
{
?>
<option value="<?php echo $cats['cat_id'];?>"><?php echo $cats['cat_name'];?></option>
<?php }?>
</select>

</td>
</tr>
<form method="post" action="" id="form1">
<div style="margin: 0px 0px 0px 516px;">
<input type="text" id="category" name="category"   value="" onkeyup="showSearchs(this.value)"/>
<input type="submit" class="but_style" name="search_list" value="Search" style="width:auto; border:solid thin #b32d00;
border-radius:.3em; color:#FFF; background-color:#f7803b; cursor:pointer; height:27px;" ></div>
</form>
</body>
    <table width="70%" border="1" id="txtHint1" cellpadding="0" cellspacing="0" class="table-list" style="text-align:center;">
        <tr>
            <th width="20%">S.no</th>
            <th width="20%">Category</th>
                <th width="20%">Category Name</th>
            <th width="40%">Sub Category name</th>
            <th width="40%">Sub Category </th>
            <th width="20%">Price</th>
            <th width="20%">Quantity</th>
            <th width="20%">Total</th>
                    <th width="20%">Image</th>



        </tr>
        <tbody id="txtHint2">
        <tr>
        <?php
        $i=1;
$select3=mysql_query("select * from demo");
while($cat3=mysql_fetch_array($select3))
{
    $id=$cat3['id'];
    $pr=$cat3['price'];
    $cat=$cat3['category'];
    $cat1=$cat3['category_name'];
    $sub=$cat3['sub_category'];
    $images=$cat3['image'];
    $selcts=mysql_query("select * from categories where cat_id='$cat'");
    $ro=mysql_fetch_array($selcts);
    $ca=$ro['cat_name'];
    $selcts1=mysql_query("select * from sub_categories where sub_cat_id='$sub'");
    $ro1=mysql_fetch_array($selcts1);
    $su=$ro1['sub_cat_name'];
?>

<tr id="<?php echo $id; ?>" class="edit_tr">
<td><?php echo $i++;?></td>
<td class="edit_td">
<span id="category_<?php echo $id; ?>" class="text"><?php echo $cat; ?></span>
<input type="text" value="<?php echo $cat; ?>" class="editbox" id="category_input_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
<span id="category_name_<?php echo $id; ?>" class="text"><?php echo $ca; ?></span>
<input type="text" value="<?php echo $ca; ?>" class="editbox" id="category_name_input_<?php echo $id; ?>" />
</td>

<td class="edit_td">
<span id="sub_category_<?php echo $id; ?>" class="text"><?php echo $su; ?></span>
<input type="text" value="<?php echo $su; ?>" class="editbox" id="sub_category_input_<?php echo $id; ?>"/>
</td>

<td class="edit_td">
<span id="price_<?php echo $id; ?>" class="text"><?php echo $pr; ?></span>
<input type="text" value="<?php echo $pr; ?>" class="editbox" id="price_input_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
    <span id="quantity_<?php echo $id;?>" class="text">    <?php echo $cat3['quantity'];?></span>
    <input type="text" value="<?php echo $cat3['quantity'];?>" class="editbox" id="quantity_input_<?php echo $id;?>"/>
    </td>
<td>
    <span id="total_<?php echo $id;?>" class="text"><?php echo $cat3['total'];?></span>
<input type="text" value="<?php echo $cat3['total'];?>" class="editbox" id="total_input_<?php echo $id;?>"/>
</td>
<td><img src="upload/<?php echo $cat3['image'];?>"width="30px" height="30px"/></td>
<td><a href="#" id="'.$row['id'].'" class="del">Delete</a></td>
</tr>
<?php
}
?>
<tbody>
</table>
    </div>

</body>

<?php
/*if($city) {
foreach($city as $key1 => $val1) {
$slno = $key1+1;
if($slno > 10 ) {
echo "<tr class='table_tr2' id='row$slno' style='display:none;'>";
}else{
echo "<tr class='table_tr2' id='row$slno'>";
}
echo '<td width="5%">'.$slno.'</td>';
echo '<td width="12%">'.$val1['category'].'</td>';
echo '<td width="12%">'.$val1['category_name'].'</td>';
echo '<td width="12%">'.$val1['sub_category'].'</td>';
echo '<td width="15%">'.$val1['price'].'</td>';
echo '<td width="15%">'.$val1['quantity'].'</td>';
echo '<td width="15%">'.$val1['total'].'</td>';

//echo '<td><img src=upload/$val1['image] width=50px height=50px></td>';
echo '</tr>';
}
} else {
echo "<tr class='table_tr2'><td colspan='7' style='text-align:center;height:125px;'><span class='NoResult'>No Records Found</span></td></tr>";
}*/
?>
</table>
</form>

</html>

Search.php
<?php
include('conn.php');
if($_GET['q2'])
{
   $id3=$_GET['q2'];
$select=mysql_query("select * from demo where category_name='$id3'");


while($search=mysql_fetch_array($select))
{
    $id=$search['id'];
    $pr=$search['price'];
    $qu=$search['quantity'];
    $to=$search['total'];
    $cat=$search['category'];
    $cat1=$search['category_name'];
    $sub=$search['sub_category'];
    $su=$search['sub_cat_name'];
    $images=$search['image'];

echo "<tr>";
   echo "<td>" . $id . "</td>";
     echo "<td>" . $cat. "</td>";
echo "<td>" . $cat1. "</td>";
echo "<td>" . $sub . "</td>";
echo "<td>" . $su . "</td>";
echo "<td>" . $pr . "</td>";
echo "<td>" . $qu . "</td>";
echo "<td>" . $to. "</td>";
    echo "<td><img src=upload/$images width='50px' height='50px'></td>";
echo "</tr>";
}}
?>

inline.php
<?php
include("conn.php");
if($_POST['id'])
{
$id=$_POST['id'];
$category=$_POST['category'];
$sub_category=$_POST['sub_category'];
$price=$_POST['price'];
$quantity=$_POST['quantity'];
$total=$price*$quantity;
$sql = "update demo set category='$category',sub_category='$sub_category',price='$price',quantity='$quantity',total='$total' where id='$id'";
mysql_query($sql);
}
?>
ajax_search.php

<?php
include('conn.php');
if($_GET['q1'])
{
    $id2=$_GET['q1'];
        $i=1;
    $select=mysql_query("select * from demo where category='$id2'");
    echo "<table border='1'>
    <tr>
    <th>S.No</th>
    <th >Category</th>
            <th >Category Name</th>
            <th >Sub Category</th>
            <th >Sub Category Name</th>
                <th >Price</th>
                    <th >Quantity</th>
                        <th >Total</th>
                            <th >Image</th>



    </tr>";

while($search=mysql_fetch_array($select))
{
    $id=$search['id'];
    $pr=$search['price'];
    $qu=$search['quantity'];
    $to=$search['total'];
    $cat=$search['category'];
    $cat1=$search['category_name'];
    $sub=$search['sub_category'];
    $images=$search['image'];
    $selcts=mysql_query("select * from categories where cat_id='$cat'");
    $ro=mysql_fetch_array($selcts);
    $ca=$ro['cat_name'];
    $selcts1=mysql_query("select * from sub_categories where sub_cat_id='$sub'");
    $ro1=mysql_fetch_array($selcts1);
    $su=$ro1['sub_cat_name'];

echo "<tr>";
   echo "<td>" . $id . "</td>";
     echo "<td>" . $cat. "</td>";
echo "<td>" . $cat1. "</td>";
echo "<td>" . $sub . "</td>";
echo "<td>" . $su . "</td>";
echo "<td>" . $pr . "</td>";
echo "<td>" . $qu . "</td>";
echo "<td>" . $to. "</td>";
    echo "<td><img src=upload/$images width='50px' height='50px'></td>";
echo "</tr>";
}}
?>
ajax_cat.php

<?php
include('conn.php');
?>
<?php
if(isset($_GET['q']))
{
    //print_r($_GET);
    $id1=$_GET['q'];

    ?>
<p>
<select name="sub_category">
    <option><----Select----></option>
<?php
$select1=mysql_query("select * from sub_categories where cat_id=$id1") ;
while($cat1=mysql_fetch_array($select1))
{
?>
<option value="<?php echo $cat1['sub_cat_id'];?>"><?php echo $cat1['sub_cat_name'];?></option>
<?php }?>
</select>
</p>
<?php }?>

conn.php
<?php
$conn=mysql_connect("localhost","root","") or die(mysql_error());
$db=mysql_select_db("gomathi",$conn)or die(mysql_error());
?>

categories.sql
CREATE TABLE IF NOT EXISTS `categories` (
`cat_id` int(11) NOT NULL AUTO_INCREMENT,
`cat_name` varchar(150) NOT NULL,
PRIMARY KEY (`cat_id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

sub_categories.sql
CREATE TABLE IF NOT EXISTS `sub_categories` (
`sub_cat_id` int(11) NOT NULL,
`cat_id` int(10) NOT NULL,
`sub_cat_name` varchar(150) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
final Demo.sql
--
-- Table structure for table `demo`
--

CREATE TABLE IF NOT EXISTS `demo` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`category` varchar(150) NOT NULL,
`category_name` varchar(150) NOT NULL,
`sub_category` varchar(150) NOT NULL,
`price` int(30) NOT NULL,
`quantity` int(30) NOT NULL,
`total` int(30) NOT NULL,
`image` varchar(150) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE

Saturday 22 November 2014

Uplaod PDF File into Database Using PHP and Javascript

Explaination:
In this tutorial i has explained about the upload the PDF file only using PHP and Javascript.
SO this coding is easy to understand and very helpfull for the develoers for to code the
sites.
enctype="multipart/form-data" - The enctype attribute specifies how the form-data should be encoded
when submitting it to the server.
action="" - The name of our PHP page that will be created, shortly.This can be used for after upload
it work's through in that page which url u gave in that Action.
method="POST" - Submits data to be processed to a specified resource.
input name="pdf" - uploadedfile is how we will access the file in our PHP script.

Now that we have the right HTML form wto upload the PDF files.
Typically, the PHP file should make a key decision with all uploads: keep the file or not accept.
the folling files are not accept in the upload form.The including files are:

1.The file is too large and do not accept.
2.If u want to upload Images or CSV file or XLSX fole/Xls is should not upload.
3.There were problems uploading the file and so you can't keep it.

HTML FORM:

<form action="pdf_upload.php" name="formLogin" method="post" enctype="multipart/form-data" onSubmit="return validate();">

<div class="form-group">

<input type="file" name="pdf" value="" id="file" class="form-control">

</div>

<div class="form-group">

<input type="submit" name="add" class="btn btn-primary">

</div>

</form>

pdf_upload.php:

When the pdf_upload.php file is executed, the uploaded file exists in a temporary storage area on the server.
If the file is not moved to a different location it will be destroyed! To save our precious file we are going to need to make use of the
$_FILES associative array.

The $_FILES array is where PHP stores all the information about files.

1.We have to POST the values throught the submit button.
$_FILES['pdf']['name'] - name contains the original path of the user uploaded file.
$_FILES['pdf']['name'] - tmp_name contains the path to the temporary file that resides on the server. The file should exist on the server in a temporary directory with a temporary name.
Pdf is the name of the field.Now we can finally start to write a basic PHP upload manager script! Here is how we would get the temporary file name, choose a permanent name, and choose a place to store the file.

<?php
error_reporting(0);
$conn=mysql_connect("localhost","root","") or die(mysql_error());
$db=mysql_select_db("db_name",$conn)or die(mysql_error());
$main=new main();

if(isset($_POST['add']))
{
if(($_FILES['pdf']['name']!='')) 
{ 
$name=str_replace("'","",$_FILES['pdf']['name']);
$pdf=$name;
$size=$_FILES['pdf']['size'];
$type=$_FILES['pdf']['type'];
$temp=$_FILES['pdf']['tmp_name'];
$target=("../pdf/".$pdf);
move_uploaded_file($temp,$target);
}
else
{
$error="** &nbsp; Check your file type &nbsp;!! &nbsp;**";
}
$insert="insert into file_tbl (id,file) values ('','$pdf')";
if($main->db->query($insert))
{
// header('location:dashboard.php');
}
else
{ 
$error="** &nbsp; Check your Connection &nbsp;!! &nbsp;**";
}
}
?>

Javascript:


<script type="text/javascript">
function validate(){var imgpath=$("#file").val();var imgpath1 = document.getElementById('file').value;if(imgpath1 == ""){alert( "Upload PDF File" );return false;}else{var arr1 = new Array;arr1 = imgpath.split("\\");var len = arr1.length;var img1 = arr1[len-1];var filext = img1.substring(img1.lastIndexOf(".")+1);if(filext == "pdf" || filext == "doc"|| filext == "docx"){}else{alert("Invalid File Format Selected");return false;}}}

</script>

Database Structure:

CREATE TABLE IF NOT EXISTS `file_tbl` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`title` varchar(100) NOT NULL,
`study` varchar(55) NOT NULL,
`file` varchar(200) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=34 ;

Friday 14 November 2014

Change the Text by using Javascript

Defintion of .html():
The html() method sets or returns the content (innerHTML) of the selected elements.
Get the HTML contents of the first element in the set of matched elements.
This method does not accept any arguments.
This method is not available on XML documents.

Description:
In an HTML document, .html() can be used to get the contents of any element. If the selector expression matches more than one element,
only the first match will have its HTML content returned.
Example Code:
$(".cointaner div").html();
Screenshot:
Step 1:

Step 2:

Style:
<style>
#type1
{
border: 1px solid #000;
float: left;
padding: 3px 67px 6px 50px;
width: 2px;background-color: #000000;
color: #FFFFFF;
}
#type2
{
border: 1px solid #000;
float: left;
padding: 3px 67px 6px 50px;
width: 2px;background-color:blue;
color: #FFFFFF;
}
.cointaner
{
border: 1px solid #FFF;
width:34%;
height:75px;
}
.heading1
{
margin:57px -15px 36px -115px;
}
#sel_hotel
{
font-size:16px;
color:green;
font-weight:bold;
}
</style>

HTML Form:
<body>
<form name="form1" id="form1" method="post">
<div class="cointaner">
<div id="type1" class="change_ho">PHP</div>
<div id="type2" class="change_ho">JS</div>
<div><input type="hidden" id="type3" name="type" value="PHP"></div>
<div align="center" class="heading1" id="sel_hotel">Search Creatersite</div>
</div>
</form>
</body>
Javascript:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
//$("#type3").removeAttr("disabled");
$(".cointaner div").click(function(){
var htmlone=$(this).html();
$("#type1").removeClass("change_ho");
$("#type2").removeClass("change_ho");
if(htmlone == "PHP") {
$("#type3").val("PHP");
$("#sel_hotel").html("Search Creatersite");
} else {
$("#type3").val("JS");
$("#sel_hotel").html("Creatersite is a Blog");
}
});
});
</script>

Thursday 13 November 2014

Concatenation the Strings in PHP and HTML

Defintion:

The concat() method is used to join two or more strings.

This method does not change the existing strings, but returns a new string containing the text of the joined strings.

Syntax:

string.concat(string1, string2, ..., stringX)

string1 - First string to be joined.

string2 - Second string to be joined. Up to N number of strings can be specified this way.

Explaination:
when you need Displaying more than one strings or combining the two strings where there may be variables or other things between them,
it would be annoying to write a new statement to echo all the parts. php has a nice way of doing this for you, string concatenating
let me show you an example:
The . operator is the string concatenation operator and is very useful for situations like this.
( i left spaces after and before '.' operators to make them more visible. this is not needed in fact. )

Example For HTML String
<div class="test" name="<?php echo This." ".is." ".$row['name']." ".Blog; ?>"><div>

Example For PHP String
<?php
echo '<div class="test" name=" '.This.' '.is.' '.$row['name'].' '.ucwords($row['blog']).'"></div>';
?>

Tuesday 11 November 2014

Append the HTML Elements Using Javascript and Jquery

Explaination:

Defintion of Append:

The append() method inserts specified content at the end of the selected elements.
(or)

The .append() method inserts the specified content as the last child of each element in the jQuery collection.

Syntax:

$(selector).append(content,function(index,html))

Append means to add r insert the elements using jquery.Here if we want to add the more forms using a button.
If we click on that button it will add the forms one by one if you dont want we can delete by using
delete button for both add and delete the elements using ID's to delete."#add1" this can be used for
add the elements and "#delete1" this can be used for to delete the elements.I hope this tutorial is very helpfull for the add and delete the html elements using Javascript and Jquery.
Screenshot:

HTML Form:

<html>

<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

</head>

<body style="background-color: rgb(224, 255, 240);">

<form name="form" method="post" enctype="multipart/form-data" id="article">

<div class="col-sm-9" id="box" style="width: 27%;">