JavaScript / DHTML / AJAX RSS JavaScript / DHTML / AJAX RSS

how to refresh paritcular div of a table

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Reply

•
•
Join Date: Apr 2009
Posts: 83
Reputation: nish123 is an unknown quantity at this point 
Solved Threads: 0
nish123's Avatar
nish123 nish123 is offline Offline
Junior Poster in Training

how to refresh paritcular div of a table

 
0
  #1
Jul 3rd, 2009
hello friends have a look on my attechments..

the rows are dynamically genrated from database..!! In column Amount user fills values....!!!

when user click on add ledger.. a new popup window will open with a form... after adding ledger and closing the popup window...!! the parent page will refresh.. so that new ledger can be seen in the list...!!

but now problem comes that when page refresh.. the values which user filled got vanished...!!

so i wondering is there any way to hold the values..!!

what if i take particular column in div... and after close the popup..i made refresh that div only....!!!

is it possible..!!

waiting for positive reply
Last edited by nish123; Jul 3rd, 2009 at 9:40 am.
Attached Thumbnails
view2.JPG  
Reply With Quote Quick reply to this message  
•
•
Join Date: Apr 2009
Posts: 83
Reputation: nish123 is an unknown quantity at this point 
Solved Threads: 0
nish123's Avatar
nish123 nish123 is offline Offline
Junior Poster in Training

Re: how to refresh paritcular div of a table

 
0
  #2
Jul 4th, 2009
No replies... is it not possible...?????? :O
Reply With Quote Quick reply to this message  
•
•
Join Date: Aug 2008
Posts: 954
Reputation: essential will become famous soon enough essential will become famous soon enough 
Solved Threads: 131
Featured Poster
essential's Avatar
essential essential is offline Offline
Posting Shark

Re: how to refresh paritcular div of a table

 
0
  #3
Jul 4th, 2009
Sorry i am unable to open your attached file. Can you post the actual code, or would you prefer a different sample?
Reply With Quote Quick reply to this message  
•
•
Join Date: Apr 2009
Posts: 83
Reputation: nish123 is an unknown quantity at this point 
Solved Threads: 0
nish123's Avatar
nish123 nish123 is offline Offline
Junior Poster in Training

Re: how to refresh paritcular div of a table

 
0
  #4
Jul 4th, 2009
php Syntax (Toggle Plain Text) 
  1. <?while($row=mysql_fetch_array($result))
  2. {?>
  3. <td><?echo $row['ledgerName']; ?></td>// column name Ledgers
  4. <td><input type="textbox"></td>// column name Amount
  5. <?}?>
  6. <input type='button' value='add New ledger' onclick='myPopWindow();'>
  7.  
  8. <input type='submit'>

Now Suppose there are 5 records in database.. means five rows will appear on the page.. user start filling the values in textbox... after filling the value... user want to add a new Ledger..!! then he will click on Add new ledger button.. and a pop-up window will appear..and after adding the ledger... the parent page(in which i m showing the listing..) will refresh.. so that new ledger can seen in the list..... but the values which user fill disappears on page refresh....!!!

so i thought instead of full page refresh... LedgerName column in div and refresh that part only..!!
Last edited by nish123; Jul 4th, 2009 at 4:59 am.
Reply With Quote Quick reply to this message  
•
•
Join Date: Aug 2008
Posts: 954
Reputation: essential will become famous soon enough essential will become famous soon enough 
Solved Threads: 131
Featured Poster
essential's Avatar
essential essential is offline Offline
Posting Shark

Re: how to refresh paritcular div of a table

 
0
  #5
Jul 4th, 2009
Since you've provided me with insufficient code, then i will just have to mimic everything on this demo.

To be able for this to work, you must provide all valid variables and including querystring on each document, especially inside the ledger.php where it needs valid information, so it can provide valid results sent back to the AJAX request.

This program offers easy update's w/o reloading the actual page ( parent page ).

Here's the code for the mainpage:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <?xml version="1.0" encoding="utf-8" standalone="no"?>
  2. <?xml-stylesheet type="text/css" href="#css21" media="screen"?>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  4.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html id="xhtml10S" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head profile="http://www.w3.org/2005/10/profile">
  7. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
  8. <meta http-equiv="Window-target" content="_top" />
  9. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  10. <meta http-equiv="Content-Style-Type" content="text/css" />
  11. <meta http-equiv="Content-Script-Type" content="text/javascript" />
  12. <title>Free Live Help!</title>
  13. <style id="css21" type="text/css" media="screen">
  14. /* <![CDATA[ */
  15. td { padding : .300em .300em 0 .300em; }
  16. /* ]]> */
  17. </style> 
  18. <script type="text/javascript">
  19. // <![CDATA[
  20. var xmlHttp;
  21. var win;
  22. var wintitle = "Form Window";
  23. var winprops;
  24. var myPopWindow = function( loc, w, h ) {
  25.    var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
  26.    var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
  27.    w = (( w ) ? (( winW ) - w ) : winW );
  28.    h = (( h ) ? (( winH ) - h ) : winH );
  29.    var opened = "active";
  30.    var winprops = "";
  31.    winprops += "width=" + w;
  32.    winprops += ", height=" + h;
  33.    winprops += ", top=0, left=0";
  34.    winprops += ", scrollbars=yes";
  35.    winprops += ", menubar=yes";
  36.    winprops += ", toolbar=yes";
  37.    winprops += ", resizable=yes"; 
  38.    winprops += ", location=yes";   
  39.    if ( window.status === loc ) {
  40.       if ( typeof win !== "undefined" ) {
  41.          if ( typeof (( win.opener ) ? win.opener : win.parent ) !== "undefined" ) { 
  42.          win.focus();
  43.          return false;
  44.          } else {
  45.          win = window.open( loc, target = opened, wintitle, winprops );
  46.          win.focus();
  47.          return false;
  48.          }
  49.       } else { 
  50.       win = window.open( "", target = opened, wintitle, winprops );
  51.       win.focus();
  52.       return false; 
  53.       }      
  54.    } else if ( window.status !== loc ) {
  55.       if ( typeof win !== "undefined" ) {
  56.          if ( typeof (( win.opener ) ? win.opener : win.parent ) !== "undefined" ) {
  57.          win.location.href = loc;
  58.          window.status = loc;
  59.          win.focus();
  60.          return false;
  61.          } 
  62.       }
  63.    } win = window.open( loc, target = opened, wintitle, winprops );
  64.      window.status = loc;
  65.      return false;
  66. };
  67.  
  68. var update = function() {
  69.    if ( xmlHttp.readyState === 4 || xmlHttp.readyState === "complete" ) {
  70.       if ( xmlHttp.status === 200 ) {
  71.    (( document.getElementById ) ? document.getElementById("main") : document.all.main ).innerHTML = xmlHttp.responseText;
  72.       }
  73.    }
  74. };
  75.  
  76. var sendRequest = function( method, qstr ) { 
  77.    url = (( method === "GET" ) ? "ledger.php?getledger=" + qstr : "ledger.php?" );
  78.    try {
  79.       if ( "XMLHttpRequest" in window ) {
  80.       xmlHttp = new XMLHttpRequest(); 
  81.       } else if ( "ActiveXObject" in window ) {
  82.       var client = [ "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];
  83.          try {
  84.             for ( var i = 0; i < client.length; i++ ) {
  85.             xmlHttp = new ActiveXObject( client[ i ] ); 
  86.             }
  87.          } catch( er ) { }
  88.       }  
  89.    } catch( e ) {
  90.       if ( "createRequest" in window ) {
  91.       xmlHttp = window.createRequest();
  92.       } xmlHttp = null;
  93.    } if ( xmlHttp !== null ) {
  94.    (( "overrideMimeType" in xmlHttp ) ? xmlHttp.overrideMimeType("text/xml") : xmlHttp );
  95.    xmlHttp.onreadystatechange = update;
  96.    xmlHttp.open( method, encodeURIComponent( url ), true );
  97.    (( method === "POST" && "setRequestHeader" in xmlHttp ) ? xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded; charset=utf-8;") : xmlHttp );
  98.    xmlHttp.send((( method === "POST" ) ? "getledger=" + qstr : "" ));
  99.    return false;
  100.    } alert( "Your browser does not handle AJAX Request!" );
  101. };
  102. window.onload = function() {
  103. sendRequest( "GET", "someValidQueryString" );
  104. }
  105. // ]]>
  106. </script>
  107. </head>
  108. <body>
  109. <div id="main">Updates will be displayed inside this container.</div>
  110. </body>
  111. </html>

code for the ledger.php:

php Syntax (Toggle Plain Text) 
  1. <form id="testform" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get" onsubmit="return false;">
  2. <table id="table" frame="void" rules="none" summary="AJAX Powered!">
  3. <?php
  4. /*><!--?*/
  5. $queryString = $_GET["getledger"];
  6. $dbs = mysql_connect( 'localhost', 'testvalue', 'myvalue' );
  7.    if ( !dbs ) {
  8.       die( 'Unable to connect: '.mysql_error() );
  9.    } mysql_select_db( "ajax_powered", $dbs );
  10. $qs = "SELECT * FROM user WHERE rowid = '".$queryString."'";
  11. $result = mysql_query( $qs );
  12. while( $row = mysql_fetch_array( $request )) { 
  13. /*--><?*/ ?>
  14. <tr>
  15. <td><?php echo $row[ 'ledgerName' ]; ?></td>
  16. <td><input type="text" value="" onchange="sendRequest( 'GET', this.value );" /></td></tr>
  17. <?php } 
  18. mysql_close( $dbs );
  19. ?>
  20. <tr>
  21. <td><input type="button" value="add new ledger" onclick="myPopWindow('form.html');" /></td><td><input type="submit" value="update field" /></td></tr>
  22. </table>
  23. </form>

form test sample inside the popUpWindow

html Syntax (Toggle Plain Text) 
  1. <?xml version="1.0" encoding="utf-8" standalone="no"?>
  2. <?xml-stylesheet type="text/css" href="#css21" media="screen"?>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  4.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  5. <html id="xhtml10S" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head profile="http://www.w3.org/2005/10/profile">
  7. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
  8. <meta http-equiv="Window-target" content="_top" />
  9. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  10. <meta http-equiv="Content-Style-Type" content="text/css" />
  11. <meta http-equiv="Content-Script-Type" content="text/javascript" />
  12. <title>Free Live Help!</title>
  13. <style id="css21" type="text/css" media="screen">
  14. /* <![CDATA[ */
  15.  
  16. /* ]]> */
  17. </style> 
  18. <script id="javascript1.5" type="text/javascript">
  19. // <![CDATA[
  20.  
  21. var postData = function( form ) {
  22.    qString = (( document.getElementById ) ? document.getElementById( form ) : document.all[ form ] ).txt.value;
  23.    if ( opener !== null ) {
  24.    opener.sendRequest( "GET", qString );
  25.    opener.win.close();
  26.    } return false;
  27. };
  28.  
  29. // ]]>
  30. </script>
  31. </head>
  32. <body>
  33. <div id="main">
  34. <form id="formwin" action="#" onsubmit="return postData( 'formwin' );">
  35. <div>
  36. <label for="txt">Test Data: <input type="text" id="txt" name="txt" value="" size="30" /></label> <input type="submit" value="post data" /></div>
  37. </form>
  38. </div>
  39. </body>
  40. </html>

NOTE: One invalid information that you will provide, will prevent everything not to work.
Reply With Quote Quick reply to this message  
•
•
Join Date: Apr 2009
Posts: 83
Reputation: nish123 is an unknown quantity at this point 
Solved Threads: 0
nish123's Avatar
nish123 nish123 is offline Offline
Junior Poster in Training

Re: how to refresh paritcular div of a table

 
0
  #6
Jul 6th, 2009
this is my full page code..!!! its a dirty work..lolzz..!! Kindly Explain your code little bit.. i m unable to understand..!!!! Thanks for reply..!!

php Syntax (Toggle Plain Text) 
  1. <?  include_once('session.php');?>       
  2.  
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  4. <html dir="ltr"><head>
  5. <title>Budget</title><meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1">
  6. <link href="default.css" rel="stylesheet" type="text/css"> 
  7. <script type="text/javascript">
  8.  
  9. function formValidate(obj){
  10.    // alert('hi');
  11. 	var obj = document.frm;
  12. 	var chkCount = obj.counter.value;	
  13. 	for(var i=0;i<chkCount;i++){
  14. 		var chkBox = eval('document.frm.chk'+i+'.checked');
  15. 		var bTxt = eval('document.frm.bamt'+i+'.value');
  16. 		 if(chkBox == true && bTxt == ''){
  17. 			alert('Please enter budget amount');
  18. 			return false;
  19. 		}
  20. 		else
  21. 			{
  22. 			if(chkBox == true && isNaN(bTxt))
  23. 				{
  24. 			        alert('Amount must be integer');
  25. 			        return false;
  26. 				}
  27. 			}
  28. 		}
  29. 	}
  30.  
  31.  
  32. function countCheckboxes() 
  33. {
  34.    // alert('count'); 
  35.     var obj;
  36.     var count = 0;
  37.     var form = document.frm;
  38.   for (var i=0; i<form.elements.length; i++) 
  39.   {
  40.     obj = form.elements[i];
  41.     if (obj.type == "checkbox" && obj.checked) {
  42.  
  43.         count++;
  44.         }
  45.   }
  46.   if(count == 0)
  47.   {
  48.       alert('select ek atleast One ledger');
  49.       return false;
  50.   }
  51.   else{
  52.   document.getElementById('check').value = count;
  53.   }     
  54. } 
  55.  
  56. var cnt =0;
  57. function disable(obj)
  58. {  
  59.     if(document.getElementById(obj.id).checked)
  60.     {
  61.         document.getElementById('bamt'+obj.value).disabled=false;
  62.         showb('ledger'+obj.value);
  63.        cnt = obj.value;
  64.     }
  65.  
  66.     else
  67.     {
  68.         if(document.getElementById(obj.id).checked==false)
  69.         {
  70.             document.getElementById('bamt'+obj.value).disabled=true;
  71.             document.getElementById('bamt'+obj.value).value =" ";
  72.             document.getElementById('txtHint'+obj.value).value =" ";
  73.             document.getElementById('txtHnt'+obj.value).value =" ";
  74.         }
  75.     }
  76.  
  77. } 
  78. function able(obj)
  79. {  
  80.     if(document.getElementById(obj.id).checked)
  81.     {
  82.         document.getElementById('bamt'+obj.value).disabled=false;
  83.         showe('ledger'+obj.value);
  84.         cnt = obj.value;
  85.     }
  86.     else
  87.     {
  88.         if(document.getElementById(obj.id).checked==false)
  89.         {
  90.             document.getElementById('bamt'+obj.value).disabled=true;
  91.             document.getElementById('bamt'+obj.value).value =" ";
  92.             document.getElementById('txtHint'+obj.value).value =" ";
  93.             document.getElementById('txtHnt'+obj.value).value =" ";
  94.         }
  95.     }
  96. }
  97.  
  98. var xmlHttp;    
  99. function showb(str)
  100. {
  101. 	//alert('hi');         
  102. 	xmlHttp=GetXmlHttpObject();
  103. 	if (xmlHttp==null)
  104. 	{
  105. 		alert ("Browser does not support HTTP Request");
  106. 		return;
  107. 	} 
  108. 	 var userid = document.getElementById('userid').value;    
  109. 	var ledgerValue = document.getElementById(str).value;    
  110. 	var url="showbudget.php";
  111. 	url=url+"?q="+ledgerValue;
  112. 	url=url+"&uid="+userid;
  113. 	url=url+"&sid="+Math.random();                       
  114. 	xmlHttp.onreadystatechange=stateChanged;
  115. 	xmlHttp.open("GET",url,true);
  116. 	xmlHttp.send(null);
  117. }
  118.  
  119.     function stateChanged() 
  120.     { 
  121.  
  122.         if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  123.         {             
  124.             document.getElementById("txtHint"+cnt).value=xmlHttp.responseText;
  125.  
  126.         } 
  127.     }
  128.  
  129.     function GetXmlHttpObject()
  130.     {
  131.     var xmlHttp=null;
  132.     try
  133.      {
  134.      // Firefox, Opera 8.0+, Safari
  135.      xmlHttp=new XMLHttpRequest();
  136.      }
  137.     catch (e)
  138.      {
  139.      //Internet Explorer
  140.      try
  141.       {
  142.       xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  143.       }
  144.      catch (e)
  145.       {
  146.       xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  147.       }
  148.      }
  149.     return xmlHttp;
  150.     }
  151.  
  152. var xmlHttp1;    
  153. function showe(str)
  154. {
  155. 	//alert('hi');         
  156. 	xmlHttp1=GetXmlHttpObject();
  157. 	if (xmlHttp1==null)
  158. 	{
  159. 		alert ("Browser does not support HTTP Request");
  160. 		return;
  161. 	}
  162. 	var userid = document.getElementById('userid').value;    
  163. 	var ledgerValue = document.getElementById(str).value;    
  164. 	var url="showbudget1.php";
  165. 	url=url+"?q="+ledgerValue;
  166. 	url=url+"&uid="+userid;
  167. 	url=url+"&sid="+Math.random();                    
  168. 	xmlHttp1.onreadystatechange=stateChanged1;
  169. 	xmlHttp1.open("GET",url,true);
  170. 	xmlHttp1.send(null);
  171. }
  172.  
  173. function stateChanged1() 
  174. { 
  175.  
  176. 	if (xmlHttp1.readyState==4 || xmlHttp1.readyState=="complete")
  177. 	{             
  178. 		document.getElementById("txtHnt"+cnt).value=xmlHttp1.responseText;
  179.  
  180. 	} 
  181. }
  182.  
  183. function GetXmlHttpObject()
  184. {
  185. var xmlHttp1=null;
  186. try
  187.  {
  188.  // Firefox, Opera 8.0+, Safari
  189.  xmlHttp1=new XMLHttpRequest();
  190.  }
  191. catch (e)
  192.  {
  193.  //Internet Explorer
  194.  try
  195.   {
  196.   xmlHttp1=new ActiveXObject("Msxml2.XMLHTTP");
  197.   }
  198.  catch (e)
  199.   {
  200.   xmlHttp1=new ActiveXObject("Microsoft.XMLHTTP");
  201.   }
  202.  }
  203. return xmlHttp1;
  204. }
  205. function myPopup2() {
  206. window.open( "popupledger.php", "myWindow", 
  207. "status = 1, height = 400, width = 600, resizable = 0" )
  208. }
  209.  
  210. </script>    
  211.  
  212. <style>
  213. .textbox2{
  214. BORDER-RIGHT: #000000 1px solid; 
  215. BORDER-TOP: #000000 1px solid; 
  216. FONT-SIZE: 9pt; 
  217. PADDING-BOTTOM: 1px; 
  218. BORDER-LEFT: #000000 1px solid; 
  219. COLOR: #000000; 
  220. PADDING-TOP: 1px; 
  221. BORDER-BOTTOM: #000000 1px solid; 
  222. FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; 
  223. }
  224. </style>
  225. <script type="text/javascript" src="time.js"></script>
  226. <script src="currentdate.js"></script>
  227. <script type="text/javascript" src="tigra_hints.js"></script>   
  228. <style>
  229.         .hintsClass {
  230.             font-family: tahoma, verdana, arial;
  231.             font-size: 12px;
  232.             background-color: #f0f0f0;
  233.             color: #000000;
  234.             border: 1px solid #808080;
  235.             padding: 5px;
  236.         }
  237.         .hintSource {
  238.             color: green;
  239.             text-decoration: underline;
  240.             cursor: pointer;
  241.         }
  242.     </style>
  243.  <SCRIPT TYPE="text/javascript">
  244. <!--
  245. // copyright 1999 Idocs, Inc. http://www.idocs.com
  246. // Distribute this script freely but keep this notice in place
  247. function numbersonly(myfield, e, dec)
  248. {
  249. var key;
  250. var keychar;
  251.  
  252. if (window.event)
  253.    key = window.event.keyCode;
  254. else if (e)
  255.    key = e.which;
  256. else
  257.    return true;
  258. keychar = String.fromCharCode(key);
  259.  
  260. // control keys
  261. if ((key==null) || (key==0) || (key==8) || 
  262.     (key==9) || (key==13) || (key==27) )
  263.    return true;
  264.  
  265. // numbers
  266. else if ((("0123456789").indexOf(keychar) > -1))
  267.    return true;
  268.  
  269. // decimal point jump
  270. else if (dec && (keychar == "."))
  271.    {
  272.    myfield.form.elements[dec].focus();
  273.    return false;
  274.    }
  275. else
  276.    return false;
  277. }
  278.  
  279. //-->
  280. </SCRIPT>
  281.  
  282. <?php
  283.     include_once('config2.php');
  284.     $userid = $_SESSION['userid'];
  285.     $sql="SELECT * FROM 0_ledger where user_id = $userid or user_id = 0";
  286.     $result=mysql_query($sql)or die('Query error:'.''.mysql_errno());   
  287. ?>
  288. </head>
  289. <body onload="startTime(); currentdate();">
  290. <?php include_once('header.php');  
  291.     include_once('menu4.php');?>
  292.     <script language="JavaScript">
  293.  
  294. // configuration variable for the hint object, these setting will be shared among all hints created by this object
  295. var HINTS_CFG = {
  296.     'wise'       : true, // don't go off screen, don't overlap the object in the document
  297.     'margin'     : 10, // minimum allowed distance between the hint and the window edge (negative values accepted)
  298.     'gap'        : 0, // minimum allowed distance between the hint and the origin (negative values accepted)
  299.     'align'      : 'tcbc', // align of the hint and the origin (by first letters origin's top|middle|bottom left|center|right to hint's top|middle|bottom left|center|right)
  300.     'css'        : 'hintsClass', // a style class name for all hints, applied to DIV element (see style section in the header of the document)
  301.     'show_delay' : 50, // a delay between initiating event (mouseover for example) and hint appearing
  302.     'hide_delay' : 50, // a delay between closing event (mouseout for example) and hint disappearing
  303.     'follow'     : false, // hint follows the mouse as it moves
  304.     'z-index'    : 100, // a z-index for all hint layers
  305.     'IEfix'      : false, // fix IE problem with windowed controls visible through hints (activate if select boxes are visible through the hints)
  306.     'IEtrans'    : ['blendTrans(DURATION=.3)', 'blendTrans(DURATION=.3)'], // [show transition, hide transition] - nice transition effects, only work in IE5+
  307.     'opacity'    : 100 // opacity of the hint in %%
  308. };
  309. // text/HTML of the hints
  310. var HINTS_ITEMS = [
  311.     'If Last Budget is Null then <br> it means<br>  no Budget of this<br>  account is created in last month',
  312.     'If Last Actual Budget is Null then <br> it means no entry is passed in last month',
  313.     'tooltip for item3<br>This one is multi line',
  314.     'tooltip for item4',
  315.     'another sample tooltip with the <a href="http://www.softcomplex.com">link</a>'
  316. ];
  317.  
  318. var myHint = new THints (HINTS_ITEMS, HINTS_CFG);
  319. </script>
  320.  
  321. <div class="clear">
  322. </div>
  323. <div id="menu2">
  324. <ul>
  325.     <li><a href="cbudget.php" style="font-family:Verdana, Arial,Helvetica, sans-serif; font-size:14px">Create Budget</a></li>
  326.     <li><a href="budget.php" style="font-family:Verdana, Arial,Helvetica, sans-serif; font-size:14px">View Reports</a></li>
  327. </ul>
  328. </div>
  329. <div class="clear"></div>
  330. <center>
  331.  <table border="0" width="100%">
  332.     <tr>
  333.         <td width="20%"><font face="Courier New, Courier, mono" size="+1"><b>Create Entry</b></font></td>
  334.         <td align="center" width="50%"><b> Welcome&nbsp;&nbsp;<?= $_SESSION['username'];?></b></td>
  335.         <td align="right"><div id="txt1"></div></td>    
  336.     </tr>
  337.     <tr>
  338.         <td class="titletext" style="">&nbsp;</td>
  339.         <td align="right" class="titletext" colspan="2">Time:<span id="txt"></span></td>
  340.     </tr>
  341. </table>
  342. <div class="clear"></div>
  343. <center><table width="100%"><tbody><tr>
  344. <div id="_page_body">
  345. <div class="clear"></div>
  346. <br> <? include_once('msgbox.php'); ?>       <br>
  347. <form method="post" name="frm" action="addbudget.php" onSubmit="return formValidate(this);">
  348.  
  349.         <input type="hidden" id='userid' name="userid" value="<?= $userid; ?>"
  350.         <div><center> 
  351.         <table style="border-collapse: collapse;" cellpadding="3" cellspacing="3" align="center" border="1"  bgcolor="#f9f9f9" border="2" bordercolor="#e1e1e1">
  352.     <tr>
  353.         <td class="tableheader">Select Month</td>
  354.         <td class="tableheader">Select Year</td>
  355.  
  356.     </tr>
  357.     <tr>
  358.         <td align="center">
  359.            <select name="month" id="month" style="width:100px">
  360.             <option value="1" <? if( $_SESSION['month'] == "1") echo 'selected';?>>January</option>
  361.             <option value="2" <? if( $_SESSION['month'] == "2") echo 'selected';?>>Febuary</option>
  362.             <option value="3" <? if( $_SESSION['month'] == "3") echo 'selected';?>>March</option>
  363.             <option value="4" <? if( $_SESSION['month'] == "4") echo 'selected';?>>April</option>
  364.             <option value="5" <? if( $_SESSION['month'] == "5") echo 'selected';?>>May</option>
  365.             <option value="6" <? if( $_SESSION['month'] == "6") echo 'selected';?>>June</option>
  366.             <option value="7" <? if( $_SESSION['month'] == "7") echo 'selected';?>>July</option>
  367.             <option value="8" <? if( $_SESSION['month'] == "8") echo 'selected';?>>Augest</option>
  368.             <option value="9" <? if( $_SESSION['month'] == "9") echo 'selected';?>>September</option>
  369.             <option value="10" <? if( $_SESSION['month'] == "10") echo 'selected';?>>Octuber</option>
  370.             <option value="11" <? if( $_SESSION['month'] == "11") echo 'selected';?>>November</option>
  371.             <option value="12" <? if( $_SESSION['month'] == "12") echo 'selected';?>>December</option>
  372.         </select>
  373.          <td>  
  374.             <select name="year" style="width:100px">
  375.             <?
  376.             $year = date(Y);
  377.             for($i=1;$i<=5;$i++)
  378.             {?>
  379.  
  380.               <option value="<?= $year;?>"><?= $year ?></option>  
  381.               <?$year = $year + 1;?>
  382.            <? }?>
  383.             ?>
  384.  
  385.  
  386.  
  387.             </select>
  388.  
  389.          </td>   
  390.    </tr>
  391. </table>
  392. <br>
  393. <table style="border-collapse: collapse;" bgcolor="#f9f9f9" border="2" bordercolor="#e1e1e1" cellpadding="3" cellspacing="3" width="80%">
  394.     <tr>
  395.         <td class="tableheader">Select</td>
  396.         <td class="tableheader">Ledger Name</td>
  397.         <td class="tableheader">Budget Amount</td>
  398.         <td class="tableheader">Last month Budget</td>
  399.         <td class="tableheader">Last Actual</td>
  400.     </tr>
  401.       <? 
  402.               $className = "evenrow";
  403.               $count=0;
  404.               while($row= mysql_fetch_array($result)) { 
  405.       ?>
  406.  
  407.     <tr class="<?= $className ;?>"> 
  408.         <td align="center"><input type="checkbox" name="chk<?=$count;?>"  id="chk<?=$count;?>" onClick="disable(this);able(this);" value="<?=$count;?>" <?if(isset($_SESSION['bamt'.$count])) echo 'checked'; ?>></td>
  409.         <td align="center"><?= $row['ledgerName'];?><input type="hidden" id='ledger<?=$count?>' name='ledger<?=$count?>' value="<?=$row['ledger_id'];?>"></td>
  410.         <td align="center"><input maxlength="8" type="text" value="<?= $_SESSION['bamt'.$count]?>" name="bamt<?=$count;?>" id="bamt<?=$count; ?>" onkeypress="return numbersonly(this,event)" class="textbox2" <?if(isset($_SESSION['bamt'.$count])) echo'enabled'; else echo 'disabled'; ?>></td>
  411.         <td align="center"><input type="text" value="<?if(isset($_SESSION['bamt'.$count])) echo $_SESSION['lastmonth'.$count]?>" name='lastmonth<?=$count;?>'  id="txtHint<?=$count?>" class="textbox2" readonly="readonly" onmouseover="myHint.show(0, this)"  onmouseout="myHint.hide()"/></td>
  412.         <td align="center"><input type="text" name='lastac<?=$count;?>' value="<?if(isset($_SESSION['bamt'.$count])) echo $_SESSION['lastac'.$count]?>"  id="txtHnt<?=$count?>" class="textbox2" readonly="readonly" onmouseover="myHint.show(1, this)"  onmouseout="myHint.hide()"/></td>
  413.  
  414.         <? $count++; 
  415.             if($className == 'evenrow')
  416.             {
  417.                 $className = oddrow;
  418.             }
  419.             else
  420.             {
  421.                 $className = evenrow;
  422.             }
  423.  
  424.     }
  425.  
  426.  
  427.  
  428.  
  429.  
  430.             ?>
  431.  
  432.         <tr>
  433.         <td colspan="5" align="center"><button  type="button" onclick="return myPopup2();"><span>Add New Ledger</span></button></td>
  434.         </tr>    
  435.   <!--  </tr>
  436.  
  437.         <td align="center" colspan="2">Total</td>
  438.         <td align="center"><input type="text" readonly="readonly"></td>
  439.         <td align="center"><input type="text" readonly="readonly"></td>
  440.         <td align="center"><input type="text" readonly="readonly"></td>
  441.     </tr> -->
  442. </tbody>
  443. </table>
  444. <br>
  445. <button class="ajaxsubmit" type="submit" name="Process" id="Process" onclick="return countCheckboxes();"><span>Submit</span></button>
  446. </center>
  447. </center>
  448. <input type="hidden" name="counter" value="<?=$count?>">
  449. <input type="hidden" name="check" id='check'>
  450.  
  451. </form>
  452. <br><div id="footer"> 
  453. <?php include_once('footer.html');  
  454. for($i=0;$i<=$count;$i++)
  455. {
  456.     if(isset($_SESSION['bamt'.$i]))
  457.         {          
  458.             unset($_SESSION['bamt'.$i]);
  459.         }  
  460.  
  461. }
  462.  
  463.  
  464.  
  465. ?>
  466.  
  467. </body>
  468. </html>
Last edited by nish123; Jul 6th, 2009 at 9:36 am.
Reply With Quote Quick reply to this message  
•
•
Join Date: Aug 2008
Posts: 954
Reputation: essential will become famous soon enough essential will become famous soon enough 
Solved Threads: 131
Featured Poster
essential's Avatar
essential essential is offline Offline
Posting Shark

Re: how to refresh paritcular div of a table

 
0
  #7
Jul 6th, 2009
Ok i'll post back when i am done checking your codes.

essential
Reply With Quote Quick reply to this message  
•
•
Join Date: Aug 2008
Posts: 954
Reputation: essential will become famous soon enough essential will become famous soon enough 
Solved Threads: 131
Featured Poster
essential's Avatar
essential essential is offline Offline
Posting Shark

Re: how to refresh paritcular div of a table

 
0
  #8
Jul 7th, 2009
if you just need to preserved those values, then you could try implementing this code sample inside your page.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <?php 
  2. /*><!--?*/ include_once "session.php"; /*--><?*/ 
  3. ?>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  5.    "http://www.w3.org/TR/html4/loose.dtd">
  6. <html dir="ltr" lang="en">
  7. <head>
  8. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
  9. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  10. <meta http-equiv="Content-Style-Type" content="text/css">
  11. <meta http-equiv="Content-Script-Type" content="text/javascript">
  12. <meta http-equiv="Window-target" content="_top">
  13. <title>Budget</title>
  14. <link rel="stylesheet" type="text/css" href="./default.css" media="all">
  15. <style type="text/css">
  16. <!--
  17. input[type="text"] { display : block; height : 23px; color : #E00; text-align : center; font : bold 85% Verdana, Arial, Sans-Serif; }
  18.  
  19. form div { margin-bottom : 1em; } 
  20. -->
  21. </style>
  22. <script type="text/javascript">
  23. <!--
  24. var $form;
  25. var $element;
  26. var data;
  27. var now = new Date(), expDate;
  28.  
  29. var eDate = now;
  30. eDate.setTime( eDate.getTime() + (( 24 * 60 * 60 * 1000 ) * 31 ));
  31.  
  32. var cookies;
  33.  
  34. var cookieActive = Boolean( navigator.cookieEnabled );
  35.  
  36. var modern = Boolean( document.getElementById );
  37.  
  38. var ie = Boolean( document.all && !modern );
  39.  
  40. var node = Boolean( document.getElementsByTagName );
  41.  
  42. cookies = function() { 
  43.    return { 
  44.       set : function( name, value, exp, path ) {
  45.          if ( cookieActive ) { 
  46.             try {
  47.             data = name  + "=" + (( value !== null ) ? escape( value ) : "" );
  48.             data += (( exp !== null ) ? "; expires=" + exp.toGMTString() : "" );
  49.             data += (( path !== null ) ? "; path=" + escape( path ) : "" );
  50.             document.cookie = data;
  51.             } catch( e ) {
  52.       (( e.description ) ? alert( e.description ) : alert( e.message ));
  53.             }
  54.          } else { alert("Unable to create cookie!\nPlease make sure that your cookie is enabled in your browser...");
  55.          }
  56.       }, 
  57.       del : function( name ) {
  58.       expDate = now;
  59.       expDate.setTime( expDate.getTime() - (( 24 * 60 * 60 * 1000 ) * 31 ));
  60.          try {
  61.          document.cookie = name + "=; expires=" + expDate.toGMTString() + "; path=/";
  62.          } catch( e1 ) {
  63.          (( e1.description ) ? alert( e1.description ) : alert( e1.message ));
  64.          }
  65.       }, 
  66.       get : function( name ) {
  67.          if ( name !== null ) {
  68.             try {
  69.             lists = document.cookie.match("(^|;) ?" + name + "=([^;]*)(;|$)");
  70.       return (unescape( RegExp.$2 )); 
  71.             } 
  72.             catch( e ) {   
  73.             lists = document.cookie.indexOf( name + "="); 
  74.                if ( lists !== -1 ) {
  75.                lists = lists + name.length + 1;
  76.                sem = document.cookie.indexOf(";", lists);
  77.                sem = ( sem == -1 ) ? document.cookie.length : ""; 
  78.                return ( unescape( document.cookie.substr( lists, sem )));
  79.                }
  80.             }
  81.          }
  82.       } 
  83.    }; 
  84. }();
  85.  
  86. // This will easily penetrate all form elememts, including objects on different types of browser. ( REUSABLE FUNCTION ).
  87.  
  88. var $ = function( FORMID, FORMELEMENT ) {
  89.  
  90.    if ( typeof FORMID !== "undefined" ) { 
  91.    var classes = typeof( FORMID ); 
  92.       try {
  93.          switch( classes ) {
  94.  
  95.          case "object" : 
  96.             try {
  97.             $form = FORMID;
  98.             $element = eval( "$form." + FORMELEMENT );
  99.             } catch( e0 ) {
  100.             $form = document.forms[ FORMID.id ];
  101.             $element = $form.elements[ FORMELEMENT ];
  102.             } break;
  103.  
  104.             case "string" :
  105.             if ( document.forms ) { 
  106.             $form =  document.forms[ FORMID ];
  107.             $element = $form.elements[ FORMELEMENT ];
  108.             } else {
  109.             $form = (( modern ) ? document.getElementById( FORMID ) : (( ie ) ? document.all[ FORMID ] : (( document.layers ) ? document.layers[ FORMID ] : undefined )));
  110.             $element = $form.children[ FORMELEMENT ];
  111.             } break;
  112.  
  113.          case "number" : 
  114.          $form = (( node ) ? document.getElementsByTagName("form")[ FORMID ] : (( ie ) ? document.all.tags("form").item( FORMID ) : undefined ));
  115.             $element = (( node ) ? $form.getElementsByTagName("input")[ FORMELEMENT ] : (( ie ) ? $form.all.tags("input").item( FORMELEMENT ) : undefined ));
  116.          break;
  117.  
  118.          default : $form = undefined;
  119.          break; 
  120.          }
  121.       } catch( error ) {
  122.       $form = undefined;
  123.       } if ( typeof FORMID !== "undefined" && typeof FORMELEMENT === "undefined" ) {
  124.         return $form;
  125.       } return $element;
  126.    }
  127. };
  128.  
  129. var formValidate = function( obj ) {
  130.    var chkCount = $( obj, "counter" ).value * 1;
  131.    var eChecked = 0;
  132.       for ( var i = 0; i < chkCount; i++ ) {
  133.       if (( $( obj, "chk" + i ).checked ) && !( $( obj, "bamt" + i ).value ) || ( isNaN( $( obj, "bamt" + i ).value ))) {
  134.       $( obj, "bamt" + i ).style.border = "1px solid #F00";
  135.       $( obj, "bamt" + i ).style.textAlign = "center";
  136.       $( obj, "bamt" + i ).value = (( isNaN( $( obj, "bamt" + i ).value )) ? "[ - MUST BE A NUMBER - ]" : "[ - ENTER BUDGET AMOUNT - ]" );   
  137.       eChecked += 1; 
  138.       continue;
  139.       } cookies.set( String( "e" + i ), $( obj, "bamt" + i ).value, eDate, "/" );
  140.    } if ( eChecked > 0 ) {
  141.    return false; 
  142.    } else {
  143.       if ( !( $( obj, "chk0").checked || $( obj, "chk1").checked || $( obj, "chk0").checked )) {
  144.       alert( "Please check atleast one item in the field." );
  145.       return false;
  146.       } 
  147.    }
  148. };
  149. window.onload = function() { 
  150.    for ( var x = 0; x < ( $("frm", "counter").value * 1 ); x++ ) {
  151.    $( "frm", "bamt" + x ).value = cookies.get( "e" + x );
  152.    }
  153. };
  154.  
  155. // -->
  156. </script>
  157. </head>
  158. <body>
  159. <div id="main">
  160. <form id="frm" name="frm" action="#" onsubmit="return formValidate( this );">
  161. <div>
  162. <input type="hidden" id="counter" name="counter" value="3">
  163. <label for="chk0">checkbox #1: <input type="checkbox" id="chk0" name="chk0" value=""></label><br>
  164. <label for="chk1">checkbox #2: <input type="checkbox" id="chk1" name="chk1" value=""></label><br>
  165. <label for="chk2">checkbox #3: <input type="checkbox" id="chk2" name="chk2" value=""></label>
  166. </div>
  167. <div>
  168. <label for="bamt0">field #1: <input type="text" id="bamt0" name="bamt0" size="25" value=""></label><br>
  169. <label for="bamt1">field #2: <input type="text" id="bamt1" name="bamt1" size="25" value=""></label><br>
  170. <label for="bamt2">field #3: <input type="text" id="bamt2" name="bamt2" size="25" value=""></label><br>
  171. <input type="submit" value="Preseve Value">
  172. </div>
  173. </form>
  174. </div>
  175. </body>
  176. </html>
Reply With Quote Quick reply to this message  
•
•
Join Date: Apr 2009
Posts: 83
Reputation: nish123 is an unknown quantity at this point 
Solved Threads: 0
nish123's Avatar
nish123 nish123 is offline Offline
Junior Poster in Training

Re: how to refresh paritcular div of a table

 
0
  #9
Jul 8th, 2009
•
•
•
•
Originally Posted by essential View Post
if you just need to preserved those values, then you could try implementing this code sample inside your page.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <?php 
  2. /*><!--?*/ include_once "session.php"; /*--><?*/ 
  3. ?>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  5.    "http://www.w3.org/TR/html4/loose.dtd">
  6. <html dir="ltr" lang="en">
  7. <head>
  8. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
  9. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  10. <meta http-equiv="Content-Style-Type" content="text/css">
  11. <meta http-equiv="Content-Script-Type" content="text/javascript">
  12. <meta http-equiv="Window-target" content="_top">
  13. <title>Budget</title>
  14. <link rel="stylesheet" type="text/css" href="./default.css" media="all">
  15. <style type="text/css">
  16. <!--
  17. input[type="text"] { display : block; height : 23px; color : #E00; text-align : center; font : bold 85% Verdana, Arial, Sans-Serif; }
  18.  
  19. form div { margin-bottom : 1em; } 
  20. -->
  21. </style>
  22. <script type="text/javascript">
  23. <!--
  24. var $form;
  25. var $element;
  26. var data;
  27. var now = new Date(), expDate;
  28.  
  29. var eDate = now;
  30. eDate.setTime( eDate.getTime() + (( 24 * 60 * 60 * 1000 ) * 31 ));
  31.  
  32. var cookies;
  33.  
  34. var cookieActive = Boolean( navigator.cookieEnabled );
  35.  
  36. var modern = Boolean( document.getElementById );
  37.  
  38. var ie = Boolean( document.all && !modern );
  39.  
  40. var node = Boolean( document.getElementsByTagName );
  41.  
  42. cookies = function() { 
  43.    return { 
  44.       set : function( name, value, exp, path ) {
  45.          if ( cookieActive ) { 
  46.             try {
  47.             data = name  + "=" + (( value !== null ) ? escape( value ) : "" );
  48.             data += (( exp !== null ) ? "; expires=" + exp.toGMTString() : "" );
  49.             data += (( path !== null ) ? "; path=" + escape( path ) : "" );
  50.             document.cookie = data;
  51.             } catch( e ) {
  52.       (( e.description ) ? alert( e.description ) : alert( e.message ));
  53.             }
  54.          } else { alert("Unable to create cookie!\nPlease make sure that your cookie is enabled in your browser...");
  55.          }
  56.       }, 
  57.       del : function( name ) {
  58.       expDate = now;
  59.       expDate.setTime( expDate.getTime() - (( 24 * 60 * 60 * 1000 ) * 31 ));
  60.          try {
  61.          document.cookie = name + "=; expires=" + expDate.toGMTString() + "; path=/";
  62.          } catch( e1 ) {
  63.          (( e1.description ) ? alert( e1.description ) : alert( e1.message ));
  64.          }
  65.       }, 
  66.       get : function( name ) {
  67.          if ( name !== null ) {
  68.             try {
  69.             lists = document.cookie.match("(^|;) ?" + name + "=([^;]*)(;|$)");
  70.       return (unescape( RegExp.$2 )); 
  71.             } 
  72.             catch( e ) {   
  73.             lists = document.cookie.indexOf( name + "="); 
  74.                if ( lists !== -1 ) {
  75.                lists = lists + name.length + 1;
  76.                sem = document.cookie.indexOf(";", lists);
  77.                sem = ( sem == -1 ) ? document.cookie.length : ""; 
  78.                return ( unescape( document.cookie.substr( lists, sem )));
  79.                }
  80.             }
  81.          }
  82.       } 
  83.    }; 
  84. }();
  85.  
  86. // This will easily penetrate all form elememts, including objects on different types of browser. ( REUSABLE FUNCTION ).
  87.  
  88. var $ = function( FORMID, FORMELEMENT ) {
  89.  
  90.    if ( typeof FORMID !== "undefined" ) { 
  91.    var classes = typeof( FORMID ); 
  92.       try {
  93.          switch( classes ) {
  94.  
  95.          case "object" : 
  96.             try {
  97.             $form = FORMID;
  98.             $element = eval( "$form." + FORMELEMENT );
  99.             } catch( e0 ) {
  100.             $form = document.forms[ FORMID.id ];
  101.             $element = $form.elements[ FORMELEMENT ];
  102.             } break;
  103.  
  104.             case "string" :
  105.             if ( document.forms ) { 
  106.             $form =  document.forms[ FORMID ];
  107.             $element = $form.elements[ FORMELEMENT ];
  108.             } else {
  109.             $form = (( modern ) ? document.getElementById( FORMID ) : (( ie ) ? document.all[ FORMID ] : (( document.layers ) ? document.layers[ FORMID ] : undefined )));
  110.             $element = $form.children[ FORMELEMENT ];
  111.             } break;
  112.  
  113.          case "number" : 
  114.          $form = (( node ) ? document.getElementsByTagName("form")[ FORMID ] : (( ie ) ? document.all.tags("form").item( FORMID ) : undefined ));
  115.             $element = (( node ) ? $form.getElementsByTagName("input")[ FORMELEMENT ] : (( ie ) ? $form.all.tags("input").item( FORMELEMENT ) : undefined ));
  116.          break;
  117.  
  118.          default : $form = undefined;
  119.          break; 
  120.          }
  121.       } catch( error ) {
  122.       $form = undefined;
  123.       } if ( typeof FORMID !== "undefined" && typeof FORMELEMENT === "undefined" ) {
  124.         return $form;
  125.       } return $element;
  126.    }
  127. };
  128.  
  129. var formValidate = function( obj ) {
  130.    var chkCount = $( obj, "counter" ).value * 1;
  131.    var eChecked = 0;
  132.       for ( var i = 0; i < chkCount; i++ ) {
  133.       if (( $( obj, "chk" + i ).checked ) && !( $( obj, "bamt" + i ).value ) || ( isNaN( $( obj, "bamt" + i ).value ))) {
  134.       $( obj, "bamt" + i ).style.border = "1px solid #F00";
  135.       $( obj, "bamt" + i ).style.textAlign = "center";
  136.       $( obj, "bamt" + i ).value = (( isNaN( $( obj, "bamt" + i ).value )) ? "[ - MUST BE A NUMBER - ]" : "[ - ENTER BUDGET AMOUNT - ]" );   
  137.       eChecked += 1; 
  138.       continue;
  139.       } cookies.set( String( "e" + i ), $( obj, "bamt" + i ).value, eDate, "/" );
  140.    } if ( eChecked > 0 ) {
  141.    return false; 
  142.    } else {
  143.       if ( !( $( obj, "chk0").checked || $( obj, "chk1").checked || $( obj, "chk0").checked )) {
  144.       alert( "Please check atleast one item in the field." );
  145.       return false;
  146.       } 
  147.    }
  148. };
  149. window.onload = function() { 
  150.    for ( var x = 0; x < ( $("frm", "counter").value * 1 ); x++ ) {
  151.    $( "frm", "bamt" + x ).value = cookies.get( "e" + x );
  152.    }
  153. };
  154.  
  155. // -->
  156. </script>
  157. </head>
  158. <body>
  159. <div id="main">
  160. <form id="frm" name="frm" action="#" onsubmit="return formValidate( this );">
  161. <div>
  162. <input type="hidden" id="counter" name="counter" value="3">
  163. <label for="chk0">checkbox #1: <input type="checkbox" id="chk0" name="chk0" value=""></label><br>
  164. <label for="chk1">checkbox #2: <input type="checkbox" id="chk1" name="chk1" value=""></label><br>
  165. <label for="chk2">checkbox #3: <input type="checkbox" id="chk2" name="chk2" value=""></label>
  166. </div>
  167. <div>
  168. <label for="bamt0">field #1: <input type="text" id="bamt0" name="bamt0" size="25" value=""></label><br>
  169. <label for="bamt1">field #2: <input type="text" id="bamt1" name="bamt1" size="25" value=""></label><br>
  170. <label for="bamt2">field #3: <input type="text" id="bamt2" name="bamt2" size="25" value=""></label><br>
  171. <input type="submit" value="Preseve Value">
  172. </div>
  173. </form>
  174. </div>
  175. </body>
  176. </html>
Nice worK....!!
but i still want to know is there any to way refresh a particular div through ajax...!!!
Reply With Quote Quick reply to this message  
•
•
Join Date: Aug 2008
Posts: 954
Reputation: essential will become famous soon enough essential will become famous soon enough 
Solved Threads: 131
Featured Poster
essential's Avatar
essential essential is offline Offline
Posting Shark

Re: how to refresh paritcular div of a table

 
0
  #10
Jul 8th, 2009
•
•
•
•
Originally Posted by nish123 View Post
Nice worK....!!
but i still want to know is there any to way refresh a particular div through ajax...!!!
With or w/o AJAX, you can update any portion of your page w/o reloading.

But since you're requesting it with AJAX, so here's a simple workaround to get you started.

I've used some text file, in which i put all the ids of the div i need ( each id must be separated by a space or any delimeter that you prefer to use ).

Here's the content of of the ids.txt : div1 div2 div3
the testpage:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2.    "http://www.w3.org/TR/html4/loose.dtd">
  3. <html id="html40L" lang="en">
  4. <head>
  5. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
  6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  7. <meta http-equiv="Content-Style-Type" content="text/css">
  8. <meta http-equiv="Content-Script-Type" content="text/javascript">
  9. <meta http-equiv="Window-target" content="_top">
  10. <title>Free Live Help!</title>
  11. <style type="text/css">
  12. <!--
  13. label + div {
  14. margin-bottom : 1em; font : 700 16pt "Trebuchet MS", "Bernard MT Condensed", Verdana, Arial, sans-serif; }
  15. -->
  16. </style>
  17. <script type="text/javascript">
  18. <!--
  19. var method = "GET";
  20. var AjaxObject = function() {
  21. var req;
  22.     try {
  23.       if ( "XMLHttpRequest" in window ) {
  24.       this.req = new XMLHttpRequest(); 
  25.       } else if ( "ActiveXObject" in window ) {
  26.       var client = [ "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];
  27.          try {
  28.             for ( var i = 0; i < client.length; i++ ) {
  29.             this.req = new ActiveXObject( client[ i ] ); 
  30.             }
  31.          } catch( er ) { this.req = null; }
  32.       }  
  33.    } catch( e ) {
  34.       if ( "createRequest" in window ) {
  35.       this.req = window.createRequest();
  36.       } else { this.req = null; }
  37.    } return this.req; 
  38. }; 
  39. var handleRequest = function( ) {
  40. var chb = (( document.getElementsByTagName ) ? document.getElementsByTagName("input") : document.all.tags("input")); 
  41.    if (( this.readyState === 4 ) || ( this.readyState === "complete" )) {
  42.    var q = this.responseText.split(/[\s\n]+/);
  43.       for ( var i = 0; i < chb.length; i++ ) {
  44.          if ( chb[ i ].type === "checkbox" && chb[ i ].checked ) {
  45.          (( document.getElementById ) ? document.getElementById( q[ i ] ) : document.all[ q[ i ] ] ).innerHTML = "[ " + String( q[ i ] ).toUpperCase() + " has been updated ]";
  46.          continue;   
  47.          } (( document.getElementById ) ? document.getElementById( q[ i ] ) : document.all[ q[ i ] ] ).innerHTML = "DIV#" + (( i ) + 1 ) + " Default Content";
  48.       } 
  49.    } 
  50. }; 
  51. var sendRequest = function( url, xmlHttp ) {
  52. if ( xmlHttp !== null ) {
  53.    (( "overrideMimeType" in xmlHttp ) ? xmlHttp.overrideMimeType("text/xml") : xmlHttp );
  54.    xmlHttp.onreadystatechange = handleRequest;
  55.    xmlHttp.open( method, encodeURIComponent( url ), true );
  56.    (( method === "POST" && "setRequestHeader" in xmlHttp ) ? xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8") : xmlHttp );
  57.    xmlHttp.send( null );
  58.    return true;
  59.    } alert( "Your browser does not handle AJAX Request!" );
  60. };
  61.  
  62. // -->
  63. </script>
  64. </head>
  65. <body>
  66. <div>
  67. <h2>Update DIV Content</h2>
  68. <label for="d1"><input type="checkbox" id="d1" name="d1" value="0" onclick="sendRequest('ids.txt', new AjaxObject())"> Update Div#1</label><div id="div1">DIV#1 Default Content</div>
  69.  
  70. <label for="d2"><input type="checkbox" id="d2" name="d2" value="1" onclick="sendRequest('ids.txt', new AjaxObject())"> Update Div#2</label><div id="div2">DIV#2 Default Content</div>
  71.  
  72. <label for="d3"><input type="checkbox" id="d3" name="d3" value="2" onclick="sendRequest('ids.txt', new AjaxObject())"> Update Div#3</label><div id="div3">DIV#3 Default Content</div>
  73. </div>
  74. </body>
  75. </html>
Dev.Opera — FOLLOW THE STANDARDS, BREAK THE RULES...
Reply With Quote Quick reply to this message  
Reply

Quick Reply to Thread
This thread is more than three months old.
Perhaps start a new thread instead?
•
•
•
•
•
•
•
•
Message:
•
•
•
•



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



ajax ajaxcode ajaxexample ajaxhelp ajaxjspservlets animate automatically beta box browser bug calendar captchaformproblem checkbox child close column createrange() css cursor date debugger dependent disablefirebug dom download dropdown editor element embed engine error events explorer ext file form forms getselection google gwt gxt hiddenvalue highlightedword hint html htmlform ie7 ie8 iframe images internet java javascript javascripthelp2020 jawascriptruntimeerror jquery jsf jsfile jump libcurl maps math media microsoft mimic object onmouseoutdivproblem onreadystatechange parent paypal pdf php player position post problem programming progressbar regex runtime scroll search security select shopping size software sql text textarea unicode w3c web website window windowofwords windowsxp wysiwyg \n
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC