printing - auto print using jquery -

i have data in following format:

(dummy entries)(id=posgridview)

as process sale, small receipt print automatically selected columns, not columns.

because data available in grid view, how can print dynamically format jquery?

edited

actually want print in format dynamically above grid view

printing

there's no need jquery printing page, need javascript function: window.print();.

if need print specific content, can hide rest (and format printed area) css:

<style media="screen">   .noprint{ display: block; }   .yesprint{ display: block !important; } </style>  <style media="print">   .noprint{ display: none; }   .yesprint{ display: block !important; } </style> 

as can see, setting media attribute of style tag, can set styles both normal view (screen) , printing view (print). full article here.

dynamism

you can add dynamism process, keep in mind can dinamically user, in code you'll have find , event attach printing. event click in anchor:

<a href='javascript:window.print();'>print</a>

it onload event of page:

window.onload = function () {     window.print(); } 

or other event might need aware (notice i'm using jquery):

var doprintpage;  function printpage(){     window.print(); }  $(document).ready(function(){     $('input').blur(function(){         //3sec after user leaves input, printpage fire         doprintpage = settimeout('printpage();', 3000);     });     $('input').focus(function(){         //but if input gains focus printpage won't fire         cleartimeout(doprintpage);     }); }); 

the code above pretty straight-forward: after 3 seconds of user leaving input, printpage fire. if input focus in 3 seconds, printpage won't called. don't think precise code need, i'll make point how emulate dynamism. here can see settimeout , cleartimeout definitions.

edit: hardly suggest hide unwanted-to-print html through css explained above , call window.print. anyway, here i'm adding code doing through new page.

printing brand new page

if want print from totally different page 1 you're showing, can ask page, manage html in server-side , tell page print loaded. there's @ least 2 ways this. let see them step step:

a) first choice send gridview new page , print there. problem can't open new page this, you'll have browse page new 1 showing html-to-print.

a1) this, need surround gridview form:

<form runat="server"> <asp:gridview id="gridview" /> <asp:button id="btnprint" text="print" runat="server" onclick="btnprint_click" /> </form> 

a2) *btnprint_click* you'll call "printpage.aspx". remember if changed gridview js/jquery, changes not available (since it's .net reads hidden state variable rather gridview).

b) second way through javascript. remember choice you'll have hard time if want edit table in new page (because won't receiving gridview, you'll receiving html). thing can open new page:

b1) off course, you'll need form (notice target , action), like:

<form id="mypageform" name="mypageform" target="_blank" action="printpage.aspx">     <input type="hidden" name="htmltoprint" id="htmltoprint" />     <input type="button" value="submit">print</button> </form> 

b2) you'll have pass data anchor. before submitting form, set input table data:

$(document).ready(function(){     $('#mypageform').submit(function(){         //filling hidden input         var htmltoprint = $(".posgridview").html(); //i'm using class , not id 'cause .net change gridview's id when rendering page         $("#htmltoprint").value(htmltoprint);         return true;     }); }); 

once have data in server side (printpage.asx), can create html-to-print , call window.print() on page onload, described above.