943,697 Members | Top Members by Rank

Ad:
Jul 3rd, 2009
0

how to refresh paritcular div of a table

Expand Post »
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
Attached Thumbnails
Click image for larger version

Name:	view2.JPG
Views:	179
Size:	15.0 KB
ID:	10702  
Last edited by nish123; Jul 3rd, 2009 at 9:40 am.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Junior Poster in Training
nish123 is offline Offline
83 posts
since Apr 2009
Jul 4th, 2009
0

Re: how to refresh paritcular div of a table

No replies... is it not possible...?????? :O
Reputation Points: 10
Solved Threads: 0
Junior Poster in Training
nish123 is offline Offline
83 posts
since Apr 2009
Jul 4th, 2009
0

Re: how to refresh paritcular div of a table

Sorry i am unable to open your attached file. Can you post the actual code, or would you prefer a different sample?
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Jul 4th, 2009
0

Re: how to refresh paritcular div of a table

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.
Reputation Points: 10
Solved Threads: 0
Junior Poster in Training
nish123 is offline Offline
83 posts
since Apr 2009
Jul 4th, 2009
0

Re: how to refresh paritcular div of a table

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.
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Jul 6th, 2009
0

Re: how to refresh paritcular div of a table

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.
Reputation Points: 10
Solved Threads: 0
Junior Poster in Training
nish123 is offline Offline
83 posts
since Apr 2009
Jul 6th, 2009
0

Re: how to refresh paritcular div of a table

Ok i'll post back when i am done checking your codes.

essential
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Jul 7th, 2009
0

Re: how to refresh paritcular div of a table

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>
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Jul 8th, 2009
0

Re: how to refresh paritcular div of a table

Click to Expand / Collapse  Quote originally posted by essential ...
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...!!!
Reputation Points: 10
Solved Threads: 0
Junior Poster in Training
nish123 is offline Offline
83 posts
since Apr 2009
Jul 8th, 2009
0

Re: how to refresh paritcular div of a table

Click to Expand / Collapse  Quote originally posted by nish123 ...
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>
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: Sothink anyone? How do you call behaviors -n- Drewamweaver
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: make form box invisible or transparent





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC