Useful Programming: June 2013

Checking the uploading image size without submitting the form / Posting the upload file details without submitting the form

html:
--------

<form id="upload_form" >
      <input type="file" class="file" name="filename[]" onchange="validateFileSize()" />
</form>

js:
----

function validateFileSize(){
    var form_obj = document.getElementById("upload_form"); //upload_form is a form id
        try{
            var formData = new FormData(form_obj);
            $.ajax({
                url: 'upload.php', //server script to process data
                type: 'POST',
                success: function(data){},
                error: function(data){},
                data: formData,
                cache: false,
                contentType: false,
                processData: false
            });
        }catch(e){
        }
}

upload.php:
-----------------

if (isset($_FILES["filename"]["name"])) {
    try {
           echo "Upload: " . $_FILES["filename"]["name"] . "<br />";
            echo "Type: " . $_FILES["filename"]["type"] . "<br />";
            echo "Size: " . ($_FILES["filename"]["size"] / 1024) . " Kb<br />";
            echo "Temp file: " . $_FILES["filename"]["tmp_name"] . "<br />";
          } catch (Exception $e) {
             print_r($e);
          }
    }

Note : FormData will not work in old browsers and IE
For old browser, we can use iframe

http://stackoverflow.com/questions/166221/how-can-i-upload-files-asynchronously-with-jquery
http://stackoverflow.com/questions/9516251/upload-files-without-refresh-page ===> using iframe

To Override document.write / alternative solution for document.write using javascript

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
hai
<div id="div"></div>

<script>
document.write = function(w) {
document.getElementById("div").innerHTML += w; //w has the write statement from document.write
}

document.write("Hello");
document.write("world");

</script>
</body>
</html>

Getting ViewPort / Device Screen Size using Javascript (subtracting from browser scrollbar size):

Useful Programming

Monday 24 June 2013

Checking the uploading image size without submitting the form / Posting the upload file details without submitting the form

To Override document.write / alternative solution for document.write using javascript

Getting ViewPort / Device Screen Size using Javascript (subtracting from browser scrollbar size):

FB Page Badge

Like this page