Wednesday 21 November 2012

Dompdf every page with header and footer

Dompdf used to generate PDF but there is occurred a problem to attach header and footer on every page . Following is a solution to attach header and footer on every page.

copy whole code.

This code have all setting is correctly done.
just you need include library of dompdf.

require_once("dompdf/dompdf_config.inc.php");
$html = '
<html>
<head>
  <style>
    @page { margin: 180px 50px; }
    #header { position: fixed; left: 0px; top: -180px; right: 0px; height: 150px; background-color: orange; text-align: center; }
    #footer { position: fixed; left: 0px; bottom: -180px; right: 0px; height: 150px; background-color: lightblue; }
    #footer .page:after { content: counter(page, upper-roman); }
  </style>
<body>
  <div id="header">
    <h1>ibmphp.blogspot.com</h1>
  </div>
  <div id="footer">
    <p class="page"><a href="ibmphp.blogspot.com"></a></p>
  </div>
  <div id="content">
    <p><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
    <p style="page-break-before: always;"><a href="ibmphp.blogspot.com">ibmphp.blogspot.com</a></p>
  </div>
</body>
</html>
';

$dompdf = new DOMPDF();
$dompdf->load_html($html);
$dompdf->render();
$dompdf->stream("paulsmith.pdf");

This will definately help you.

Sunday 4 November 2012

Submit Form On Laod Page

Following is javascript function which submit the form on load page.



<script type="text/javascript">       

    function myfunc () {  

             var frm = document.getElementById("formName");   

             frm.submit(); 

  }  

 window.onload = myfunc; 

</script>


This submit form on load page

How to css suport internet explorer browser Compatibility

Following is the code for the purpose Internet explorer browser Compatibility of css and html tag.
 

  For example your css is following path

       <link rel="stylesheet" type="text/css" href="/ui/stylesheets/default.css"media="screen, projector, print"/>
       <link rel="stylesheet" type="text/css" href="/ui/stylesheets/print.css"media="print" />

Then for  Internet explorer browser Compatibility do following step.

 <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie6_overrides.css"media="screen, projector, print" />
    <link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie6_overrides_print.css"media="print" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie7_overrides.css"media="screen, projector, print" />
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie7_overrides_print.css"media="print" />
<![endif]-->
<!--[if IE 7.0a]>
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie7_overrides.css"media="screen, projector, print" />
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie7_overrides_print.css"media="print" />
<![endif]-->
<!--[if IE 7.0b]>
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie7_overrides.css"media="screen, projector, print" />
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie7_overrides_print.css"media="print" />
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie8_overrides.css"media="screen, projector, print" />
<link rel="stylesheet" type="text/css" href="/ui/stylesheets/ie8_overrides_print.css"media="print" />
<![endif]-->



This will help you for solve the problem

Thursday 1 November 2012

How Refresh Web Page With Javascript and Jquery

There is many way to refresh the page with javascript and jquery and also you can set timing for refreshing the page, these details are giving below.

1. Javascript refresh the page

      <a href="javascript:location.reload(true)">Refresh Page</a>

2. Auto refresh the page with javascript

   
<html>
<head>
<script type="text/JavaScript">
<!--
function AutoRefresh( t ) {
 setTimeout("location.reload(true);", t);
}
//   -->
</script>
</head>
<body onload="JavaScript:AutoRefresh(5000);">
<p>This page will refresh every 5 seconds.</p>
</body>
</html>

3. Jquery using refresh the page

    $('#something').click(function() {
    location.reload();
});                               
4. In Html tag
  <input type="button" value="Reload Page" onClick="document.location.reload(true)">                     

These are the method using for page refresh.                         

Wednesday 31 October 2012

Checkbox Button For Checked Checkbox Using Javascript

Using javascript for check and uncheck all checkbox on click, There is two type button both are different like check all and uncheck all.





Please choose your sports which you likes.

Hockey
Fooball
Tennis
Cricket
Badminton
Basket Ball
Volley Ball
Long Jump
High Jump
Shotput


The javascript code is following, which do this all action. Take a look on that and remeber these thing is very easy and you will need to learn about these action



function check_all(formName){
    for (i = 0; i < formName.length; i++){
        formName[i].checked = true ;
    }
}
function uncheck_all(formName){
    for (i = 0; i < formName.length; i++){
        formName[i].checked = false ;
    }
}

Just you need to follow following things, keep it in mind when you are going to do this.

1. All checkbox need to same name.

2. Give to form name in your form tag.

These thing you need to know. Following giving working code just you need to copy and paste in our page and run.


This is javascript check and uncheck code.

Checkbox check onclick master checkbox

Using javascript for check and uncheck all checkbox on click master checkbox.You can see action at following, just click on master checkbox for check and uncheck all checkbox.



Click for Check and Uncheck all checkbox.

Please choose your sports which you likes.

Hockey
Fooball
Tennis
Cricket
Badminton
Basket Ball
Volley Ball
Long Jump
High Jump
Shotput


The javascript code is following, which do this all action. Take a look on that and remeber these thing is very easy and you will need to learn about these action



function check_uncheck_all(formName){
    var action = true;
    if(document.getElementById('master').checked==true){
        action = true;
    }
    else {
        action = false;
    }
    for (i = 0; i < formName.length; i++){
        formName[i].checked = action ;
    }
}

Just you need to follow following things, keep it in mind when you are going to do this.

1. All checkbox need to same name.

2. Give to form name in your form tag.

3. Give id to your master checkbox.

These thing you need to know. Following giving working code just you need to copy and paste in our page and run.


This is javascript check and uncheck code.

Checkbox Onclick Select All And Unselect All


Following check the effect of jquery select all and unselect all.          

                                                         

                                     31 32 33 34 37 38 39 40

                                     10 11 12 13 14 17 18 19

                                     20 21 22 23 24 27 28 29

This is the jquery simple select all and unselect function. These function is following just check it.

  $(function(){$("#select_all").click(function() {
        $('input[name*="chk2"]').attr("checked","checked"); });
    });
    $(function() { $("#unselect_all").click(function() {
        $('input[name*="chk2"]').removeAttr("checked"); });
    });


These two function work to select all or unselect all checkbox. Following is given code of these functionality in textarea.

Just copy and paste in your page for testing purpose. This is for demo copy code and run.

This is great code for select and uselect and optimisation code.