Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    England =)
    Posts
    518
    Thanks
    25
    Thanked 0 Times in 0 Posts

    returned ajax data stopping JS functionality.... :(

    Hi all,

    ok, below is a really cut down code example of a problem im having. this is from a mysql/php project management system im writing.

    when the data first loads the line:

    <script>document.getElementById('DGL000262').innerHTML = '(7/7 hours)'</script>

    basically just inserts some total values into the header rows. this works fine. the problem is when i use ajax to perform some of the functions on the page. for example the copytimesheet() function. this basically goes off, does some php/mysql stuff and should return back the newly added timesheet into the list. this works but then the above innerHTML statement seems to get ignored.

    i tried this using firebug and the response is coming back fine (no errors etc) and i can save this as a standard html file and it works fine. any ideas? its almost like if i use document.getElementBy(... and ajax, there is some unknown issue. both IE7 and FF have the issues. (for an IE company system so no testing on ie6, opera etc). BUT i have used doc.getElementBy successfully in other areas of the system.

    Code:
    	<div><a href="timesheetlist_byproject.php"><img src="images/tablehead_timesheet-employee.jpg" width="618" height="21" border="0" /></a></div>
    	<div id='timesheetdetails'>
    		<div class='layouttable'>
    			<table class='listtable' cellspacing='0'>
    				<thead>
    					<tr>
    						<th style='width:67px'>Approval</th>
    						<th style='width:60px'>Date</th>
    						<th style='width:40px; text-align:right'>Hours</th>
    						<th style='width:2px;'>&nbsp;</th>
    						<th style='width:120px;'>Employee</th>
    						<th>Approved by</th>
    						<th style='width:46px'>&nbsp;</th>
    						<th style='width:46px'>&nbsp;</th>
    					</tr>
    				</thead>
    				<tr class="th2">
    					<th colspan='8'><span class='hoursWorked' id='DGL000262'></span><a href="javascript:collapseTableRows('DGL000262')">DGL000262-TB test 123</a></th>
    				</tr>
    				<tr class='' onmouseout='this.className=""' onmouseover='this.className="rowRollover"' id='DGL000262-1'>
    					<td><img src='images/icon_greenStar.gif' alt='Approved' align='absmiddle' /> <img src='images/icon_hardhat.gif' alt='Work' align='absmiddle' /> </td>
    					<td onClick='document.location.href="timesheet.php?id=77"' style='cursor:hand'>03.12.2008</td>
    					<td onClick='document.location.href="timesheet.php?id=77"' style='cursor:hand; text-align:right'>7</td>
    					<td onClick='document.location.href="timesheet.php?id=77"' style='cursor:hand'>&nbsp;</td>
    					<td onClick='document.location.href="timesheet.php?id=77"' style='cursor:hand'>Chelsea Moore</td>
    					<td onClick='document.location.href="timesheet.php?id=77"' style='cursor:hand'>Liam Tipler - 05.12.2008</td>
    					<td style='text-align:right'><a href='javascript:;' onclick="copytimesheet('77','Work' ,'0')"><img src='images/microbutton_copy_0.gif' alt='Copy' name='copy' id='copy' onmouseover="MM_swapImage('copy','','images/microbutton_copy_1.gif',0)" onmouseout="MM_swapImgRestore()" class='noprint' /></a></td>
    					<td style='text-align:right'><a href='javascript:;' onclick="deletetimesheet('77', 'timesheets', 'Work', '1')"><img src='images/microbutton_delete_0.gif' alt='Delete' name='delete' id='delete' onmouseover="MM_swapImage('delete','','images/microbutton_delete_1.gif',0)" onmouseout="MM_swapImgRestore()" class='noprint' /></a>
    						<script>document.getElementById('DGL000262').innerHTML = '(7/7 hours)'</script>
    					</td>
    				</tr>
    			</table>
    		</div layouttable>
    	</div collapse>
    thanks all... this is really confusing me
    "They hired me for my motivational skills. Everyone at work says they have to work much harder when I`m around" Homer J Simpson

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Location
    England =)
    Posts
    518
    Thanks
    25
    Thanked 0 Times in 0 Posts
    bump ?
    "They hired me for my motivational skills. Everyone at work says they have to work much harder when I`m around" Homer J Simpson

  • #3
    Regular Coder ohgod's Avatar
    Join Date
    Jun 2008
    Location
    Ohio
    Posts
    579
    Thanks
    6
    Thanked 69 Times in 69 Posts
    don't forget that js in a manual dom update won't run unless you eval it. when your ajax call is complete have it call a function that deals with your lil innerHTML stuff.

    personally i try to just keep all js out of the updated area when possible.


    ie in particular HATES working with manual dom edits from what i've seen.

  • Users who have thanked ohgod for this post:

    babelfish (12-08-2008)

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Location
    England =)
    Posts
    518
    Thanks
    25
    Thanked 0 Times in 0 Posts
    thanks man! i thought there was something odd going on!

    fixed it by writing to a function and then loading the function when a blank image loads at the bottom of the page not ideal but works fine
    "They hired me for my motivational skills. Everyone at work says they have to work much harder when I`m around" Homer J Simpson


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •