Thursday, 20 November 2014

how to call css and js in laravel

 Path start from root directory :-

//like (laravel/admin_asset/css/style.css)

{{ HTML::style('admin_asset/css/style.css'); }}

{{ HTML::script('admin_asset/js/jquery.js'); }}

how to define dynamic title in laravel

First set section name (title) and value (Home page) in view pages  :-

@section('title')
Home page(define head title here)
@stop


And In  layout page call the title section :-
 <title>@yield('title')</title>

Remember which tab was active after refresh.

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script>

$(function() {
 
    var index = 'key';
  
    var dataStore = window.sessionStorage;
 
    try {
     
        var oldIndex = dataStore.getItem(index);
    } catch(e) {
     
        var oldIndex = 0;
    }
    $('#tabs').tabs({
      
        active : oldIndex,
      
        activate : function( event, ui ){
         
            var newIndex = ui.newTab.parent().children().index(ui.newTab);
         
            dataStore.setItem( index, newIndex )
        }
    });
    });
</script>

 /*-------------------------------------------------------------------------------------------------------------------------*/

<div id="tabs">
<ul>
<li><a href="#tabs-1">Lalit1</a></li>
<li><a href="#tabs-2">Lalit2</a></li>
<li><a href="#tabs-3">Lalit13</a></li>
</ul>
<div id="tabs-1">
<p>Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p>


</div>
<div id="tabs-2">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. .</p>
</div>
<div id="tabs-3">
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.</p>
</div>
</div>






Monday, 17 November 2014

how to get date difference in javascript

<script>

function calcDate() {
var today = new Date();
var past = new Date(2010,05,01);
    var diff = Math.floor(today.getTime() - past.getTime());
    var day = 1000 * 60 * 60 * 24;

    var days = Math.floor(diff/day);
    var months = Math.floor(days/31);
    var years = Math.floor(months/12);

    var message = past.toDateString();
    message += " was "
    message += days + " days "
    message += months + " months "
    message += years + " years ago \n"

  alert(message);
  return false;
    }
</script>

Thursday, 13 November 2014

detect copy, paste and cut behavior with jQuery

 <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
        <style type="text/css">
        span{
            color:green;
            font-weight:bold;
        }
        </style>

 <label>Text Box : </label>
            <input id="textA" type="text" size="50" value="Copy, paste or cut any text here" />



<script type="text/javascript">
        $(document).ready(function() {
            $("#textA").bind({
                copy : function(){
                $('#message').text('copy behaviour detected!');
                },
                paste : function(){
                return false;  /*you can't paste in textbox*/
                //$('#message').text('paste behaviour detected!');
                },
                cut : function(){
                $('#message').text('cut behaviour detected!');
                }
            });
        });
        </script>

Saturday, 8 November 2014

Drag and drop div into another div and change order through ajax

First create two tables table_name(fields = 'id','name','sort_order') and second is table_name(fields = 'id','t_id','name','sort_order').
create db connection in db file:-

in db.php file :-

<?php
mysql_connect("localhost", "root", "") or die ("Error connecting to mysql");
mysql_select_db("db_name");
?>
/*------------------------------------------------------------------------------------------*/
in index.php file :-

<?php
include("db.php");
?>
<!doctype html>

<html lang="en">
<head>
    <title>jQuery UI Sortable - Connect lists</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

    <style>
    .connectedSortable{min-height:100px;min-width:400px;list-style-type: none; margin: 0; padding: 0 0 2.5em; float: left; margin-right: 10px; }
   
    .connectedSortable li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 390px; }
    .sec h3 {
    background: none repeat scroll 0 0 #40E0D0;
    font-size: 22px;
    height: 47px;
    margin-left: 10px;
    padding: 0 7px;
    width: 372px;
    text-align:center
}
.sec {
    background-color: #9ACD32;
    float: left;
    margin-left: 10px;
    width: 413px;
}
.trans {
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
}
    </style>
    <script>
    $(function() {
        $( ".connectedSortable" ).sortable({
 cursor: "move",
            connectWith: ".connectedSortable",
            receive: function(event,ui){
                 console.log("old ui id = "+ui.sender.attr("id")+" new ul id = "+this.id+" li id "+$(ui.item).attr("id"));  
                                
                 if(ui.sender.attr("id") != this.id)
                 {

                  $(ui.item).removeClass("trans");
                  $.ajax({
                    type: "POST",
                    url: "logic.php",
                  data: { start: ui.sender.attr("id"), drop: this.id , id:$(ui.item).attr("id") }
                })/*.done(function( msg ) {
                              alert( "Data Saved: " + msg );
                            })*/;
                
                 }
                 
               
             } ,
           
    start: function( event, ui ) {
   
    ui.helper.addClass("trans");
   
   
   
    },
    stop: function( event, ui ) {
   
    $(this).find('li,div').removeClass("trans");
   
   
   
    }
    }).disableSelection();
       
        $('.connectedSortable , .team_sec ').sortable({
   
    update: function (event, ui) {
        var data = $(this).sortable('serialize');
  
   $.ajax({
                    type: "POST",
                    url: "order_change.php",
                  data: {id:$(ui.item).attr("id") , prev:ui.item.prev().attr('id'),team:this.id,data: $(this).sortable('serialize') }
                })/*.done(function( msg ) {
                              alert( "Data Saved: " + msg );
                            });*/
    }
});




       
    });
   
   
    </script>
</head>
<body>
<div class="team_sec">
<?php
$team_res = mysql_query("select * from team order by sort_order");
while($team = mysql_fetch_assoc($team_res))
{
?>

<div class="sec" id="sec_<?php echo $team['id'];?>">
<h3><?php echo $team['name'];?></h3>

<ul id="<?php echo $team['id'];?>" class="connectedSortable">

<?php
$ids = $team['id'];
$task_res = mysql_query("select * from task where t_id = $ids order by sort_order");
while($task = mysql_fetch_assoc($task_res))
{
?>
    <li id="<?php echo $task['id'];?>_<?php echo $team['id'];?>" value="<?php echo $team['id'];?>" class="ui-state-default"><?php echo $task['id'];?>__<?php echo $task['name'];?></li>
 <?php
 }
 ?>
</ul></div>
<?php } ?>
</div>
</body>
</html>

/*------------------------------------------------------------------------------------------*/

creat a php file for ajax request like logic.php :-

<?php
include("db.php");

$arid = explode('_',$_POST['id']);
$id = $arid[0];
$tid = $_POST['drop'];
$task_res = mysql_query("update task set t_id = '$tid' where id = $id");

?>
/*------------------------------------------------------------------------------------------*/
creat another php file for second ajax request like order_change.php :-

<?php
include("db.php");

$secid = explode('_',$_POST['id']);
$arr = explode('&',$_POST['data']);
if($secid[0]=="sec")
{

$count = 1;
foreach($arr as $ordr)
{

$ordid = explode('=',$ordr);
 $o_id = $ordid[1];
$task_res = mysql_query("update team set sort_order = '$count' where id = $o_id");
$count++;
}

}else
 {

 $arid = $_POST['team'];

$count = 1;
foreach($arr as $ordr)
{

$ordid = explode('[',$ordr);
 $o_id = $ordid[0];
$task_res = mysql_query("update task set sort_order = '$count' where t_id = $arid and id = $o_id");
$count++;
}
}
?>
/*-----------------------------------------end----------------------------------------------*/

Thursday, 6 November 2014

manage multiple category tree in single table in php

 Create a table with catgory_id,name,parent,sort_order field

<?php
$g_link = mysql_connect( 'localhost', 'root', '');
        mysql_select_db('your_database_name');
       
       
$result = mysql_query("SELECT category_id,name,parent,sort_order FROM category ORDER BY parent,sort_order,name");
 
 
$category = array('categories' => array(),'parent_cats' => array());
 
        while ($row = mysql_fetch_assoc($result)) {
            
            $category['categories'][$row['category_id']] = $row;
            
            $category['parent_cats'][$row['parent']][] = $row['category_id'];
        }
        ?>


/*This function used for show add category (in select box for select parent category) in menu*/ 


<select name="cat">
<option value="0"></option>
<?php

function buildCategory($parent, $category,$name) {
            $html = "";
            if (isset($category['parent_cats'][$parent])) {
                
                foreach ($category['parent_cats'][$parent] as $cat_id) {
                    if (!isset($category['parent_cats'][$cat_id])) {
                        $html .= "<option value='".$category['categories'][$cat_id]['category_id']."'>" . trim($name."->". $category['categories'][$cat_id]['name'],"->") . "</option>";
                    }
                    if (isset($category['parent_cats'][$cat_id])) {
                        $html .= "<option value='".$category['categories'][$cat_id]['category_id']."'>" . trim($name."->".$category['categories'][$cat_id]['name'],"->") . "</option>";
                        $html .= buildCategory($cat_id, $category,trim($name."->".$category['categories'][$cat_id]['name'],"->"));
                        $html .= "</option>";
                    }
                }
                
            }
            return $html;
        }
        echo buildCategory(0, $category ,'');
?>
</select>
<?php
        echo '<br><br>';
        /*--------------------------------end-------------------------------------------------------------------------------------------------------------------------*/

/*This function used for show all categories in menu*/ 


function buildCategory1($parent, $category) {
            $html = "";
            if (isset($category['parent_cats'][$parent])) {
                $html .= "<ul>\n";
                foreach ($category['parent_cats'][$parent] as $cat_id) {
                    if (!isset($category['parent_cats'][$cat_id])) {
                        $html .= "<li>\n  <a href='#'>" .$category['categories'][$cat_id]['name'] . "</a>\n</li> \n";
                    }
                    if (isset($category['parent_cats'][$cat_id])) {
                        $html .= "<li>\n  <a href='#'>" .$category['categories'][$cat_id]['name'] . "</a> \n";
                        $html .= buildCategory1($cat_id, $category);
                        $html .= "</li> \n";
                    }
                }
                $html .= "</ul> \n";
            }
            return $html;
        }
        echo buildCategory1(0, $category);
/*--------------------------------end-------------------------------------------------------------------------------------------------------------------------*/

?>