Web 개발: 코드

레이블이 코드인 게시물을 표시합니다. 모든 게시물 표시

2012년 2월 28일 화요일

Ajax 사용

참고(ajax): http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp
참고(convert html special character): http://stackoverflow.com/questions/784586/convert-special-characters-to-html-in-javascript

코드:

<script type="text/javascript">
function getXmlHttp() {
 var xmlhttp;
  
 if (window.XMLHttpRequest) {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
 } else {
  // code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 
 return xmlhttp;
}

function ajaxQuery(method, query, cb_onsuccess) {
 var xmlhttp = getXmlHttp();
 xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
   cb_onsuccess(xmlhttp);
  }
 }
 xmlhttp.open(method, query, true);
 xmlhttp.send();
}
</script>

팁) html 특수 문자 변환

<script type="text/javascript">
function htmlspecialchars(str) {
 return str.replace(/&/g, "&amp;").replace(/>/g, "&gt;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
}
</script>

주의 사항: url 을 외부 사이트로 할 경우 외부 사이트에서 허용을 해야만 접근 가능

CORS 참고 - 링크

테스트: ajaxQuery('GET', '/', function(xmlhttp){document.getElementById('ajax-result').innerHTML = htmlspecialchars(xmlhttp.responseText);});

결과:

2012년 2월 15일 수요일

Email Regex

참고: http://www.regular-expressions.info/email.html

Result:

^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$

<script type="text/javascript">
function check(email) {
    var pattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
    return pattern.test(email);
}
</script>

2012년 2월 14일 화요일

Dialog 코드 샘플

Javascript

<script type="text/javascript">
function get(obj) {
    if (typeof obj == "object") {
        return obj;
    }
    return document.getElementById(obj);
}
function show(obj) {
    get(obj).style.display = "block";
}
function hide(obj) {
    get(obj).style.display = "none";
}
function showDialog(title, message, buttons) {
    var dlgTitleElt = get("dlg-title");
    var dlgMessageElt = get("dlg-message");
    var dlgButtonsElt = get("dlg-buttons");
    show("gray-out");
    show("popup-dialog");
    dlgTitleElt.innerHTML = title;
    dlgMessageElt.innerHTML = message;
}
function hideDialog() {
    hide("gray-out");
    hide("popup-dialog");
}
</script>

CSS

<style type="text/css">
    #gray-out {z-index:100;top:0px;left:0px;width:100%;height:100%;position:fixed;display:none;background-color:black;opacity:0.5;filter:alpha(opacity=50);}
    #popup-dialog {z-index:101;display:none;position:fixed;left:50%;top:50%;padding:0px;margin:-150px -250px;width:500px;height:300px;border:2px solid black;background-color:white;box-shadow:3px 3px 3px #606060;}
    #dlg-title {font-size:20pt;background-color:black;color:white;padding:5px;margin:0px;}
    #dlg-message {height:70%;border:1px solid silver;padding:3px;margin:3px;font-size:10pt;overflow:auto;}
    #dlg-buttons {position:absolute;bottom:10px;width:100%;text-align:center;}
</style>

HTML


<div id="gray-out"></div>
<div id="popup-dialog">
    <h2 id="dlg-title"></h2>
    <div id="dlg-message"></div>
    <div id="dlg-buttons">
        <a href="javascript:hideDialog();">close</a>
    </div>
</div>

2012년 2월 10일 금요일

RSS 내용을 파싱하기로 하였다.

RSS 소스 : http://feeds.nytimes.com/nyt/rss/World

domxml_open_mem() : XML 데이터를 파싱하여 DOM 객체(DomDocument)를 리턴한다.
DomDocument::get_elements_by_tagname() : 특정 태그 이름을 갖는 DomNode 들을 배열 형태로 리턴한다.
DomNode::child_nodes() : Node 가 포함하고 있는 Node 들을 배열 형태로 리턴한다.
DomNode::node_name() : 태그명을 리턴한다.
DomNode::get_content() : 태그가 갖고 있는 내용물을 리턴한다.

XML parsing 하는 소스

<!DOCTYPE html>

<html>
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf8">
    <title>XML</title>
    <style type="text/css">
      div.item {border:2px solid black; margin:10px; padding:5px;}
      span.item-name {font-weight:bold;}
    </style>
  </head>
  
  <body>
  <?
  
  // Get XML Data
  $url = "http://feeds.nytimes.com/nyt/rss/World";
  
  $curl = curl_init();
  curl_setopt($curl, CURLOPT_URL, $url);
  curl_setopt($curl, CURLOPT_HEADER, 0);
  curl_setopt($curl, CURLOPT_FOLLOWLOCATION, 1);
  curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
  $xml = curl_exec($curl);
  $info = curl_getinfo($curl);
  curl_close($curl);
  
  // Parse XML Data
  if (!$doc = domxml_open_mem($xml)) {
   echo "Could not load xml...";
  } else {
   $items = $doc->get_elements_by_tagname("item");
   foreach ($items as $item) {
    ?>
    <div class="item">
    <?
    $id = 0;
    $children = $item->child_nodes();
    foreach ($children as $child) {
     $name = $child->node_name();
        if ($name != "#text") {
          $content = $child->get_content();
          $content = htmlspecialchars($content, ENT_QUOTES, "UTF-8");
          $new = str_replace("\n", "< br / >", $content);
          echo "<span class='item-name'>{$name} : </span>{$new}< br / >";
        }
    }
    ?></div><?
   }
  }  
  ?>
  </body>
</html>

2012년 2월 5일 일요일

PHP 에서 Mysql 사용시 자주 사용하는 코드

1) DB 연결과 해제:

<?php
 $conn = mysql_connect("hostname", "mysql_user_id", "mysql_user_password");

 if (!$conn) {
  die("mysql_create() error");
 }

 mysql_select_db("dbname");

 mysql_close($conn);
?>

2) DB 테이블 내용 조회:

<?php
 $conn = mysql_connect("hostname", "mysql_user_id", "mysql_user_password");
 if (!$conn) {
  die("mysql_create() error");
 }
 
 mysql_select_db("dbname");
 $query = "select * from 'tablename'";
 $result = mysql_query($query);
 if (!$result) {
  die("mysql_query() error");
 }

 while ($row = mysql_fetch_assoc($result)) {
  // handle row
 }

 mysql_free_result($result);
 mysql_close($conn);
?>

팁) 페이징 처리
select * from 'tablename' limit <start index>, <view count>

3) 간단 조회:

<?php
 $conn = mysql_connect("hostname", "mysql_user_id", "mysql_user_password");
 if (!$conn) {
  die("mysql_create() error");
 }
 mysql_select_db("dbname");

 $query = "select count(*) from 'tablename'";
 $result = mysql_query($query);
 if (!$result) {
  die("mysql_query() error");
 }

 $count = mysql_result($result, 0, 0);

 mysql_free_result($result);
 mysql_close($conn);
?>