web programming bookmark: มกราคม 2011

วันจันทร์ที่ 24 มกราคม พ.ศ. 2554

jquery prepend and prependTo


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=tis-620" />
<title>prepend and prependTo</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
//<![CDATA[
$(function(){
 $('#button1').click(function(){
   //method 1, append
   var new_data = '<div>'+$('#data').val()+'</div>';
   var container_el = $('#container').prepend(new_data);
   alert(container_el.attr('id'));
 });
 $('#button2').click(function(){
   //method 2, appendTo
   var new_data = '<div class="t">'+$('#data').val()+'</div>';
   var new_data_el = $(new_data).prependTo('#container');
   alert(new_data_el.attr('class'));
 });
});
//]]>
</script>
</head>
  
<body>

    <div id="container">
        <div id="a">#</div>
        <div id="b">#</div>
        <div id="c">#</div>
        <div id="d">#</div>
        <div id="e">#</div>
    </div>
    
    <input type="text" id="data" value="test"/>
    <button id="button1">button1 prepend</button>
    <button id="button2">button2 prependTo</button>
  
</body>
</html>

jquery append and appendTo


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=tis-620" />
<title>append and appendTo</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
//<![CDATA[
$(function(){
 $('#button1').click(function(){
   //method 1, append
   var new_data = '<div>'+$('#data').val()+'</div>';
   var container_el = $('#container').append(new_data);
   alert(container_el.attr('id'));
 });
 $('#button2').click(function(){
   //method 2, appendTo
   var new_data = '<div class="t">'+$('#data').val()+'</div>';
   var new_data_el = $(new_data).appendTo('#container');
   alert(new_data_el.attr('class'));
 });
});
//]]>
</script>
</head>
  
<body>

    <div id="container">
        <div id="a">#</div>
        <div id="b">#</div>
        <div id="c">#</div>
        <div id="d">#</div>
        <div id="e">#</div>
    </div>
    
    
    <input type="text" id="data" value="test"/>
    <button id="button1">button1 append</button>
    <button id="button2">button2 appendTo</button>
  
</body>
</html>

วันจันทร์ที่ 17 มกราคม พ.ศ. 2554

javascript เปลี่ยนเป็น tab เป็น enter

โค้ด javascript เปลี่ยน tab เป็น enter ครับ


<html>
<head>
<script>
function handleEnter(event){
var e=window.event?window.event:event;
var keyCode=e.keyCode?e.keyCode:e.which?e.which:e.charCode;
if (keyCode == 13){
if (this.className && this.className=='last'){
this.form.submit();
return true;
}
var i;
for (i = 0; i < this.form.elements.length; i++)
if (this == this.form.elements[i])
break;
if (this.type=='textarea' && e.shiftKey)
return true;
else if (this.type=='radio')
this.form.elements[i+this.form.elements[this.name].length].focus();
else
this.form.elements[i+1].focus();
return false;
}
else
return true;
}

window.onload=function(){
var a=document.formA;
for(var i=0;i<a.elements.length;i++){
var e=a.elements[i];
e.onkeypress=handleEnter;
}
}

</script>
</head>
<body>
<?php echo 'random='.rand(1,200); ?>

<form name="formA">
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" class='last' />
<input type="submit" value="submit" />
</form>

</body>
</html>

inline update by num


<?php
 if ($_SERVER['REQUEST_METHOD'] == 'POST' && $_GET['action'] == 'approve'){
   $id = intval(@$_GET['id']);
   echo 'update tb1 set APPROVE=1 where id='.$id;
   //you will do real update yourself.
   die;
 }
 if ($_SERVER['REQUEST_METHOD'] == 'POST' && $_GET['action'] == 'unapprove'){
   $id = intval(@$_GET['id']);
   echo 'update tb1 set APPROVE=0 where id='.$id;
   //you will do real update yourself.
   die;
 }
?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=tis-620" />
<title>inline update by num</title>
<style type="text/css">
* {margin:0;padding:0}
tr.checked {background-color:#ccc;}
#tb tr.orange {background-color:#F90;}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
//<![CDATA[
$(function(){
 $('.approve:checked').parents('tr').addClass('checked');
    $('.approve').click(function(e){
  var tr = $(this).parents('.tr');        
  var record_id = $(this).val();  
  tr.addClass('orange');
  
  //set to valid
  if ($(this).is(':checked')){
   if (confirm('set to valid?')){
    $.ajax({  //ajax update
     url:'?action=approve&id='+record_id,
     type:'POST',
     dataType:'html',
     success:function(data){
       alert(data);
             tr.removeClass('orange').addClass('checked');
     }
    }); //end ajax update
   }else{
          e.preventDefault();
    tr.removeClass('orange').removeClass('checked');
   }
  }
  
  //set to invalid
  if (!$(this).is(':checked')){
   if (confirm('set to invalid?')){
    $.ajax({  //ajax update
     url:'?action=unapprove&id='+record_id,
     type:'POST',
     dataType:'html',
     success:function(data){
       alert(data);
             tr.removeClass('orange').removeClass('checked');
     }
    }); //end ajax update
   }else{
          e.preventDefault();
    tr.removeClass('orange').addClass('checked');
   }
  }
  
    });
});
//]]>
</script>
</head>
 
<body>
 
    <table border="1">
        <tbody id="tb">
        <tr class="tr"><td>###### 1</td><td><input type="checkbox" value="1" class="approve" /></td></tr>
        <tr class="tr"><td>###### 2</td><td><input type="checkbox" value="2" class="approve" /></td></tr>
        <tr class="tr"><td>###### 3</td><td><input type="checkbox" value="3" class="approve" checked="checked" /></td></tr>
        </tbody>
    </table>
 
</body>
</html>

วันเสาร์ที่ 15 มกราคม พ.ศ. 2554

delete record confirmation by num


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=tis-620" />
<title>delete record confirmation by num</title>
<style type="text/css">
* {margin:0;padding:0}
tr.selected {background-color:#ccc;}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
//<![CDATA[
$(function(){
    $('.del').click(function(e){
        e.preventDefault();
        $(this).parents('.tr').addClass('selected');
        if (confirm('delete?')){            
            //ajax delete
            //var id = $(this).attr('rel');
            //$.post('delete-action.php?id='+id);
            $(this).parents('.tr').remove();
        }else{
            $(this).parents('.tr').removeClass('selected');
        }
    });
});
//]]>
</script>
</head>

<body>

    <table border="1">
        <tbody id="tb">
        <tr class="tr"><td>###### 1</td><td><a href="#" class="del" rel="1">del</a></td></tr>
        <tr class="tr"><td>###### 2</td><td><a href="#" class="del" rel="2">del</a></td></tr>
        </tbody>
    </table>

</body>
</html>

add dynamic method to object


<?php

class MyPrinter{
    public static function echoStar($obj,$s){
        echo '*******',$obj->data,'********',$s;
    }
    public static function echoLine($obj,$s){
        echo '<br>--------------',$obj->data,'----------',$s;
    }
    public static function AddTo($obj){
        $m = get_class_methods(__CLASS__);
        foreach($m as $i)$obj->methods[$i] = array(__CLASS__,$i);
    }
}

class MyData
{
    public $methods = array();
    public $data;
    public function  __construct($data) {
        $this->data = $data;
    }
    public function __call($name,$args){
        if (in_array($name,array_keys($this->methods))){
            array_unshift($args,$this);
            return call_user_func_array($this->methods[$name],$args);
        }else{
            die('call undefined function '.$name.'.');
        }
    }
}

$c = new MyData('hello');
MyPrinter::AddTo($c);
echo $c->echoStar('aaaaaaa');
echo '<hr>';
echo $c->echoLine('bbbbbbb');

?>

วันพุธที่ 5 มกราคม พ.ศ. 2554

javascript effect

http://www.openrise.com/lab/FlowerPower/
http://www.javascript-fx.com/submitscripts/fireworks/

วันจันทร์ที่ 3 มกราคม พ.ศ. 2554

php encryption

ทดสอบการเข้ารหัส
download libmcrypt.dll ไปไว้ที่ C:\Windows\system32\
http://files.edin.dk/php/win32/mcrypt/
แก้ไข php.ini
;extension=php_mcrypt.dll
เป็น
extension=php_mcrypt.dll
restart apache


<?php

$iv_size = mcrypt_get_iv_size(MCRYPT_3DES, MCRYPT_MODE_CBC);
$iv = mcrypt_create_iv($iv_size, MCRYPT_RAND);
$key = 'keytest';
$data = 'data-test';
$edata = mcrypt_encrypt(MCRYPT_3DES, $key, $data, MCRYPT_MODE_CBC,$iv);
$ddata = trim(mcrypt_decrypt(MCRYPT_3DES, $key, $edata, MCRYPT_MODE_CBC,$iv),"\0");

echo '<br>data='.$data;
echo '<br>edata='.$edata;
echo '<br>data='.$ddata;

?>



<?php

$iv_size = mcrypt_get_iv_size(MCRYPT_3DES, MCRYPT_MODE_CBC);
$iv = mcrypt_create_iv($iv_size, MCRYPT_RAND);
$key = 'keytest';
$data = 'data-test';

$edata = mcrypt_encrypt(MCRYPT_3DES, $key, $data, MCRYPT_MODE_CBC,$iv);
$edata .= $iv;

//สมมุติว่า edata ถูกส่งมา ในรูปแบบ $edata ต่อท้ายด้วย $iv
$iv_size = mcrypt_get_iv_size(MCRYPT_3DES, MCRYPT_MODE_CBC);
//แยกข้อมูลออกเป็น $edata และ $iv
$temp = $edata;
$edata = substr($temp,0,-$iv_size);
$iv = substr($temp,-$iv_size);
//ทำการแปลงค่าตามปกติ
$ddata = trim(mcrypt_decrypt(MCRYPT_3DES, $key, $edata, MCRYPT_MODE_CBC,$iv),"\0");

echo '<br>data='.$data;
echo '<br>edata='.$edata;
echo '<br>data='.$ddata;

?>

หน้าเว็บ

วันจันทร์ที่ 24 มกราคม พ.ศ. 2554

วันจันทร์ที่ 17 มกราคม พ.ศ. 2554

วันเสาร์ที่ 15 มกราคม พ.ศ. 2554

วันพุธที่ 5 มกราคม พ.ศ. 2554

วันจันทร์ที่ 3 มกราคม พ.ศ. 2554