Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

elements don't exist when going to second page using ajax

Status
Not open for further replies.
snowboardr

snowboardr

Programmer
Joined
Feb 22, 2002
Messages
1,401
Location
PH
I recently posted about this problem under "ajax paging causing forms elements to not exist" and I realise its hard to decode something without code... The problem I am having is I have ajax paging implimented and I have 6+ javascript functions I want to preform on checkboxes etc... These javascript functions all work correctly when I am on the first page of the ajax'd paging, but when i goto the second one... the objects are considered undefined (i used an alert message to test it) I can't figure out why its doing this... I have done testing ... searched the web... but I can't figure out why the elements don't respond!!


Here is the outputed ajax'd page... on page 2, the page I am having trouble with... below this code is the javascript I am running on it...

Code: 
<form id="fmail" name="fmail" method="post" action="">
      <table class="box" border="0" cellpadding="2" cellspacing="0" width="100%">
        <tbody><tr>
          <td rowspan="2" valign="top" width="12%"><table class="box" border="0" cellpadding="6" cellspacing="0" height="100%" width="100%">
              <tbody><tr>
                <td class="bge blineee" height="24"><div align="left"><a href="#null" onclick="LoadMAILHtml('0');" class="mailmenu">Inbox</a></div></td>
              </tr>
              <tr>
                <td class="blineee"><div align="left"><a href="#" class="mailmenu">Sent</a></div></td>
              </tr>
              <tr>
                <td class="blineee"><div align="left"><a href="#" class="mailmenu">Trash</a></div></td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
          </tbody></table></td>
          <td class="bline" height="42" width="29%"><input name="Submit2" value="Delete" onclick="deletemail();" type="submit">
            &nbsp;&nbsp;
            <select name="select">
              <option value="1">More Actions....</option>
              <option onclick="statuschange('1');" style="color: rgb(102, 102, 102);">Mark as unread</option>
              <option onclick="statuschange('0');" style="color: rgb(102, 102, 102);">Mark as read</option>
              <option onclick="makestar('1');" style="color: rgb(102, 102, 102);">Star checked</option>
              <option onclick="makestar('0');" style="color: rgb(102, 102, 102);">Un-Star checked</option>
              <option>-------------</option>
              <option>Trash</option>
              <option>-------------</option>
              <option>Jason's folder</option>
              <option>Good Messages</option>
            </select></td>
          <td class="checktxt bline" width="59%">Check:&nbsp;<a href="#null" class="mailopt" onclick="checkall();return false;">All</a>,&nbsp;&nbsp;<a href="#null" onclick="uncheckall();" class="mailopt">None</a>,&nbsp;&nbsp;<a href="#null" onclick="checkread();" class="mailopt">Read</a>,&nbsp;&nbsp;<a href="#null" onclick="checkunread()" class="mailopt">Unread</a>,&nbsp;&nbsp;<a href="#null" onclick="checkstarred();" class="mailopt">Starred</a>,&nbsp;&nbsp;<a href="#null" onclick="uncheckstarred();" class="mailopt">Unstarred</a></td>
        </tr>
        <tr>
          <td colspan="2" class="lline" id="mail" valign="top">

<table border="0" cellpadding="3" cellspacing="0" width="100%">
  
  <tbody><tr>
    <td colspan="5" background="mail_files/grad_small2.gif" height="24"><div align="center">
        <a class="pa" onclick="LoadMAILHtml('1');" href="#null">Previous</a> <a onclick="LoadMAILHtml('1');" href="#null" class="pa">1</a> <strong class="brack">[</strong><a onclick="LoadMAILHtml('2');" href="#null" class="pa">2</a><strong class="brack">]</strong>  <a onclick="LoadMAILHtml('2');" href="#null" class="pa">Last</a>
    </div></td>
  </tr>
  
  <tr>
    <td class="bgw blineee" height="24" width="3%"><input id="mailchecks2" name="mailchecks" value="12" type="checkbox"></td>
    <td class="bgw blineee" width="2%"><img src="mail_files/star0.gif" id="star12" onclick="star('12');" height="18" width="17"></td>
    <td class="bgw blineee" width="24%"><a href="#" class="old" title="" onmouseover="window.status=''; return true">username x </a></td>
    <td class="bgw posttime blineee" height="24" width="48%"><div align="left"><a href="#" class="old" title="" onmouseover="window.status=''; return true">test</a>
            <input name="starx" id="starx12" value="0" type="hidden">
            <input name="readx" id="readx12" value="0" type="hidden">
    </div></td>
    <td class="bgw posttime blineee" width="23%"><div align="right"><a href="#" class="old" title="" onmouseover="window.status=''; return true">8/4/2006 3:45:09 AM</a></div></td>
  </tr>
  
  <tr>
    <td colspan="5" background="mail_files/grad_small2rev.gif" height="24"><div align="center">
        <a class="pa" onclick="LoadMAILHtml('1');" href="#null">Previous</a> <a onclick="LoadMAILHtml('1');" href="#null" class="pa">1</a> <strong class="brack">[</strong><a onclick="LoadMAILHtml('2');" href="#null" class="pa">2</a><strong class="brack">]</strong>  <a onclick="LoadMAILHtml('2');" href="#null" class="pa">Last</a>
    </div></td>
  </tr>
  <tr>
    <td colspan="5" background="mail_files/grad_small2rev.gif" height="24"><span class="checktxt bline"><a href="#null" class="mailopt" onclick="checkall();">All</a>,&nbsp;&nbsp;<a href="#null" onclick="uncheckall();" class="mailopt">None</a>,&nbsp;&nbsp;<a href="#null" onclick="checkread();" class="mailopt">Read</a>,&nbsp;&nbsp;<a href="#null" onclick="checkunread()" class="mailopt">Unread</a>,&nbsp;&nbsp;<a href="#null" onclick="checkstarred();" class="mailopt">Starred</a>,&nbsp;&nbsp;<a href="#null" onclick="uncheckstarred();" class="mailopt">Unstarred</a></span></td>
  </tr>
</tbody></table>
</td>
        </tr>
      </tbody></table>
            </form>




Code: 
// Make star 

	function makestar(intstatus) {
	var datacollecting="";
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	for ( var i = 0; i < cbCollection.length; i++ ) {
		if ( cbCollection[i].checked ) {
			datacollecting = datacollecting + "&id=" + cbCollection[i].value;
		}
	}
		 if ( datacollecting != "") {
			datacollecting = datacollecting + "&status=" + intstatus;
			dec = datacollecting.indexOf('&');
			tmp = datacollecting.substring(0,dec);
			tmp += datacollecting.substring(dec+1,datacollecting.length);
			datacollecting = tmp;
			var url2 = "/ajax/mail/save_stars.asp";
			xmlHttp=createRequestObject();
			xmlHttp.onreadystatechange = reportStatus;
			xmlHttp.open("POST",url2,true);
			xmlHttp.setRequestHeader("Content-Type","application/x-[URL unfurl="true"]www-form-urlencoded;[/URL] charset=UTF-8");
			xmlHttp.send(datacollecting);
		 }
	}
/////--->


//mail status
	function statuschange(intstatus) {
	var datacollecting="";
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	for ( var i = 0; i < cbCollection.length; i++ ) {
		if ( cbCollection[i].checked ) {
			datacollecting = datacollecting + "&id=" + cbCollection[i].value;
		}
	}
		 if ( datacollecting != "") {
			datacollecting = datacollecting + "&status=" + intstatus;
			dec = datacollecting.indexOf('&');
			tmp = datacollecting.substring(0,dec);
			tmp += datacollecting.substring(dec+1,datacollecting.length);
			datacollecting = tmp;
			var url2 = "/ajax/mail/mail_status.asp";
			xmlHttp=createRequestObject();
			xmlHttp.onreadystatechange = reportStatus;
			xmlHttp.open("POST",url2,true);
			xmlHttp.setRequestHeader("Content-Type","application/x-[URL unfurl="true"]www-form-urlencoded;[/URL] charset=UTF-8");
			xmlHttp.send(datacollecting);
		 }
	}
/////



// check all mail
function checkall() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	for ( var i = 0; i < cbCollection.length; i++ ) {
		if (cbCollection[i].checked==false) {
		cbCollection[i].checked=true;
		}
	}
}


// un-check all mail
function uncheckall() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	alert(cbCollection.length);
	for ( var i = 0; i < cbCollection.length; i++ ) {
		if (cbCollection[i].checked==true) {
		cbCollection[i].checked=false;
		}
	}
}


// check all read mail
function checkread() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	var cbReadCollection = document.forms['fmail'].elements['readx'];
	for ( var i = 0; i < cbReadCollection.length; i++ ) {
		if (cbReadCollection[i].value=="1") {
		cbCollection[i].checked=true;
		} else {
		cbCollection[i].checked=false;
		}
	}
}



// check all unread mail
function checkunread() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	var cbReadCollection = document.forms['fmail'].elements['readx'];
	for ( var i = 0; i < cbReadCollection.length; i++ ) {
		if (cbReadCollection[i].value=="0") {
		cbCollection[i].checked=true;
		} else {
		cbCollection[i].checked=false;
		}
	}
}



// check all starred mail
function checkstarred() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	var cbStarredCollection = document.forms['fmail'].elements['starx'];
	for ( var i = 0; i < cbStarredCollection.length; i++ ) {
		if (cbStarredCollection[i].value=="1") {
		cbCollection[i].checked=true;
		} else {
		cbCollection[i].checked=false;
		}
	}
}



// un-check all starred mail
function uncheckstarred() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	var cbStarredCollection = document.forms['fmail'].elements['starx'];
	for ( var i = 0; i < cbStarredCollection.length; i++ ) {
		if (cbStarredCollection[i].value=="0") {
		cbCollection[i].checked=true;
		} else {
		cbCollection[i].checked=false;
		}
	}
}
 
Sort by date Sort by votes
Nevermind, I got it... its because I was looping through elements when there was only one checkbox on the page!

Grr

The fix:

Code: 
// check all mail
function checkall() {
	var cbCollection = document.forms['fmail'].elements['mailchecks'];
	  if(cbCollection.length) {
			for ( var i = 0; i < cbCollection.length; i++ ) {
				if (cbCollection[i].checked==false) {
				cbCollection[i].checked=true;
				}
			}
	  } else {
		  cbCollection.checked=true;
	  }	
}
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Kennelbloke
  • Locked
  • Question Question
Can't Get Markers to show on Map
Replies
0
Views
1K
Kennelbloke
Kennelbloke
lexer
  • Locked
  • Question Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
1K
lexer
lexer
TheLazyPig
  • Locked
  • Question Question
Dropdown (option) using Anguarjs
Replies
0
Views
827
TheLazyPig
TheLazyPig
198709km
  • Locked
  • Question Question
Grouping XML key value using XSLT
Replies
0
Views
910
198709km
198709km
jomat
  • Locked
  • Question Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
1K
xwb
xwb

Part and Inventory Search

Sponsor

Back
Top