Saturday, June 6
Friday, June 5
Check uploaded file is actually an image using PHP.
<?php
if (@getimagesize($_FILES["file"]["tmp_name"]) !== false) {
$destination = "uploads/" . $_FILES["file"]["name"];
move_uploaded_file($_FILES["file"]["tmp_name"], $destination);
}
?>
Monday, June 1
Remove all characters except letters and numbers.
Receiving short codes in an app via URL query strings? Instead of using complex sanitization functions, this simple RegEx replace will get rid of all the junk in the input $string except for letters and numbers:
$clean_code = preg_replace('/[^\w]/', '', $string);
If you want more control over which character classes are preserved, you can specify them explicitly: $clean_code = preg_replace('/[^a-zA-Z0-9]/', '', $string);
Wednesday, May 20
Passing Values From JavaScript to PHP and Back
1. PHP to JavaScript
<?php
echo "Just wanted to say $hello";
?>
2. JavaScript to PHP
<script>
function sayHelloWorld() {
var hello = "hello";
var world = "world";
window.location.href = "somepage.php?w1=" + hello + "&w2=" + world;
}
</script>
3. PHP Receiving and Processing The Variables
<?php
function sayHiBack() {
// Check if we have parameters w1 and w2 being passed to the script through the URL
if (isset($_GET["w1"]) && isset($_GET["w2"])) {
// Put the two words together with a space in the middle to form "hello world"
$hello = $_GET["w1"] . " " . $_GET["w2"];
// Print out some JavaScript with $hello stuck in there which will put "hello world" into the javascript.
echo "<script language='text/javascript'>function sayHiFromPHP() { alert('Just wanted to say $hello!'); }</script>";
}
}
?>
<?php
echo "Just wanted to say $hello";
?>
2. JavaScript to PHP
<script>
function sayHelloWorld() {
var hello = "hello";
var world = "world";
window.location.href = "somepage.php?w1=" + hello + "&w2=" + world;
}
</script>
3. PHP Receiving and Processing The Variables
<?php
function sayHiBack() {
// Check if we have parameters w1 and w2 being passed to the script through the URL
if (isset($_GET["w1"]) && isset($_GET["w2"])) {
// Put the two words together with a space in the middle to form "hello world"
$hello = $_GET["w1"] . " " . $_GET["w2"];
// Print out some JavaScript with $hello stuck in there which will put "hello world" into the javascript.
echo "<script language='text/javascript'>function sayHiFromPHP() { alert('Just wanted to say $hello!'); }</script>";
}
}
?>
Post Multiple JavaScript Values to PHP Using jQuery AJAX
Step 1. To Package Up data for Sending
<script>
// Create an object using an object literal.
var ourObj = {};
// Create a string member called "data" and give it a string.
// Also create an array of simple object literals for our object.
ourObj.data = "Some Data Points";
ourObj.arPoints = [{'x':1, 'y': 2},{'x': 2.3, 'y': 3.3},{'x': -1, 'y': -4}];
</script>
Step 2: Transmitting This Data in jQuery AJAX
<script>
$.ajax({
url: 'process-data.php',
type: 'post',
data: {"points" : JSON.stringify(ourObj)},
success: function(data) {
// Do something with data that came back.
}
});
</script>
Step 3: Package Sent, Package Received
<?php
// Test if our data came through
if (isset($_POST["points"])) {
// Decode our JSON into PHP objects we can use
$points = json_decode($_POST["points"]);
// Access our object's data and array values.
echo "Data is: " . $points->data . "<br>";
echo "Point 1: " . $points->arPoints[0]->x . ", " . $points->arPoints[0]->y;
}
?>
<script>
// Create an object using an object literal.
var ourObj = {};
// Create a string member called "data" and give it a string.
// Also create an array of simple object literals for our object.
ourObj.data = "Some Data Points";
ourObj.arPoints = [{'x':1, 'y': 2},{'x': 2.3, 'y': 3.3},{'x': -1, 'y': -4}];
</script>
Step 2: Transmitting This Data in jQuery AJAX
<script>
$.ajax({
url: 'process-data.php',
type: 'post',
data: {"points" : JSON.stringify(ourObj)},
success: function(data) {
// Do something with data that came back.
}
});
</script>
Step 3: Package Sent, Package Received
<?php
// Test if our data came through
if (isset($_POST["points"])) {
// Decode our JSON into PHP objects we can use
$points = json_decode($_POST["points"]);
// Access our object's data and array values.
echo "Data is: " . $points->data . "<br>";
echo "Point 1: " . $points->arPoints[0]->x . ", " . $points->arPoints[0]->y;
}
?>
Monday, May 11
Multiple File Extensions validate using PHP.
<?php
$valid_file_extensions = array(".jpg", ".jpeg", ".gif", ".png");
$file_extension = strrchr($_FILES["file"]["name"], ".");
// Check that the uploaded file is actually an image
// and move it to the right folder if is.
if (in_array($file_extension, $valid_file_extensions)) {
$destination = "uploads/" . $_FILES["file"]["name"];
move_uploaded_file($_FILES["file"]["tmp_name"], $destination);
}
?>
Saturday, May 9
Tabbed Navigation with CSS
Navigation on web pages is a form of list, and tabbed navigation is like a horizontal list. It's fairly easy to create horizontal tabbed navigation with CSS, but CSS 3 gives us a few more tools to make them look even nicer.
This code tutorial will take you through the HTML and CSS needed to create a CSS tabbed menu.
<!DOCTYPE html>
<html>
<head>
<style>
.tablist {
list-style:none;
height:2em;
padding:0;
margin:0;
border: none;
}
.tablist li {
float:left;
margin-right:0.13em;
}
.tablist li a {
display:block;
padding:0 1em;
text-decoration:none;
border:0.06em solid #000;
border-bottom:0;
font:bold 0.88em/2em arial,geneva,helvetica,sans-serif;
color:#000;
background-color:#ccc;
/* CSS 3 elements */
webkit-border-top-right-radius:0.50em;
-webkit-border-top-left-radius:0.50em;
-moz-border-radius-topright:0.50em;
-moz-border-radius-topleft:0.50em;
border-top-right-radius:0.50em;
border-top-left-radius:0.50em;
}
.tablist li a:hover {
background:#3cf;
color:#fff;
text-decoration:none;
}
.tablist li#current a {
background-color: #777;
color: #fff;
}
.tablist li#current a:hover {
background: #39C;
}
</style>
</head>
<body>
<nav>
<ul class="tablist">
<li><a href="#">CSS 3</a></li>
<li id="current"><a href="#">Tabs</a></li>
<li><a href="#">For</a></li>
<li><a href="#">Menus</a></li>
</ul>
</nav>
</body>
</html>
Subscribe to:
Posts (Atom)