Saturday 30 August 2014

Add two textbox values and display the sum in a third textbox automatically

<div>  
                <label>
                    <span>price</span>
                    <input placeholder="price" type="text" name="price" id="pri" onkeyup="sum();" required>
                </label>
               <script> function sum() {
            var txtFirstNumberValue = document.getElementById('pri').value;
            var txtSecondNumberValue = document.getElementById('load').value;
            var result = parseFloat(txtFirstNumberValue) + parseFloat(txtSecondNumberValue);
            if (!isNaN(result)) {
                document.getElementById('total').value = result;
            }
        }</script>
            </div>
             <div>
                <label>
                    <span>loading charge</span>
                    <input placeholder="loading" type="text" name="loading" id="load" onkeyup="sum();"  required>
                </label>
            </div>           
              <div>
                <label>
                    <span>Total Price</span>
                    <input placeholder="loading" type="text" name="loading" id="total"  required>
                </label>
            </div>


Demo:


Monday 25 August 2014

jQuery Get input Text value and set Value

<html>
<head>
<title>example</title>

<link
 href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
 rel="stylesheet" type="text/css" />

<script
 src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"
 type="text/javascript"></script>
<script
 src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
 type="text/javascript"></script>
<script type="text/javascript">
        $(document).ready(function() {
            $('#myInputText').keyup(function() {
             $('#myOutputText').val($(this).val());
             $('#myDIVTag').html('<b>' + $(this).val() + '</b>');
            });
        });   
    </script>
</head>
<body>

  <form id="myForm" action="">
   <fieldset>
    <legend>jQuery Get and Set input Text value</legend>

    <p>
     <label for="myInputText">
      Type something here:
     </label>
 
     <input
     id="myInputText" type="text" name="inputBox" />
    </p>
    <p>
     <label for="myOutputText">
      See Result in this Text Box:
     </label>
 
     <input
     id="myOutputText" type="text" name="outputBox"
      readonly="readonly" />
    </p>
    <p>
     See Result in this DIV section:
    </p>
     <div id="myDIVTag"></div>
   </fieldset>
  </form>
 </div>
</body>
</html>

Demo:
example
jQuery Get and Set input Text value

See Result in this DIV section:

Dispaly value of one textbox to another textbox using Jquery & Javascript

Dispaly value of one textbox to another textbox using Jquery & Javascript

 <script>
function copyText2() {
txtHint = document.getElementById("txtHint");
color = document.getElementById("color");
color.value = txtHint.value;
}
</script>
<div>
TextBox 1 : <input type="text" id="txtHint" onkeyUp="copyText2()"></input>
TextBox 2 : <input type="text" id="color"></input>
</div>
</html>

Demo:

 
TextBox 1 : TextBox 2 :

Thursday 21 August 2014

HTML: Fixed Size , Resizable Text Area and character limit.

Text Area are mostly used for data entry in web forms. They could be resizable on run-time and can also be created with fixed size having particular width and height.


Resizable Text Area:

Below I am showing a Resizable text area and its respective code which I have used to create it.

Below is the html code that has been used to create Resizable text area.


<textarea style="height: 134px; width: 296px;">Resizable Text Area</textarea>


Fixed Size Text Area & character limit fixed:

Now next I am going to show an example of fixed size Text Area.


Here is the html source used to create Fixed Size Text Area:

<textarea style="height: 134px; resize: none; width: 296px;" maxlength="50">Fixed Size Text Area</textarea>

Wednesday 20 August 2014

Button click to send email in php

<form action="" method="post">
    <input type="submit" value="Send details to...." />
    <input type="hidden" name="button_pressed" value="Email" />
</form>

<?php

if(isset($_POST['button_pressed']))
{
    $to      = 'who@example.com';
    $subject = 'subject Message';
    $message = 'All is well';
    $headers = 'From: fhfh@example.com' . "\r\n" .
        'Reply-To: fhfh@example.com' . "\r\n" .
        'X-Mailer: PHP/' . phpversion();
$headers .= 'Cc: myham@example.com' . "\r\n"; 
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n"; 

    mail($to, $subject, $message, $headers);

    echo 'Email Sent.';
}

?>

Tuesday 19 August 2014

.ht access ( extension remove )

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}\.html -f
RewriteRule ^(.*)$ $1.html
-------------------------------------------------------------------
#To remove PHP pages extension just copy the below 4 lines of code and past into your htaccess.

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}\.php -f
RewriteRule ^(.*)$ $1.php
-----------------------------------------------------------------
#index remove:

RewriteEngine On
RewriteRule ^index\.html$ / [R=301,L]
RewriteRule ^(.*)/index\.html$ /$1/ [R=301,L]
------------------------------------------------------------
#404 page create

ErrorDocument 404 http://molasses.co.in/404.html
-------------------------------------------------------------
#canonical link enable:

<link rel="canonical" href="http://www.fawzulhameed.com/" />
RewriteEngine on

RewriteCond %{HTTP_HOST} ^fawzulhameed.com$
RewriteRule ^(.*)$ http://www.^fawzulhameed.com/$1 [R=301,L]