Welcome to WebmasterWorld Guest from 54.144.80.75

Forum Moderators: open

Message Too Old, No Replies

getElementById Problems

Should I even be using it just to get the id value from a link?

     
5:35 am on May 9, 2008 (gmt 0)

Junior Member

10+ Year Member

joined:Oct 25, 2004
posts:86
votes: 0


I am trying to get the value of "id" from an href to be used as an ajax function to query a mysql database. The php/mysql part worked for me fine and so did using javascript getElementById using a form and input boxes.

But I have allot of links so I thought a form with buttons as shown in all the basic tutorials for getElementById is not the best way to go and I should use straight links instead.

The one problem I have is in modifying some code I took from a tiztag tutorial and switching everything to links instead of input boxes, I get "object not found".

The problem seems to be with this line:

"var id=document.getElementById('id').value;" If I remove value the error goes away but "id" then returns a null value. So I thought "value" should remain to get the "id" value from the link. Is this not how I should be getting the value from an href id?


function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
var id=document.getElementById('id').value;
var queryString = "?id=" + id;
ajaxRequest.open("GET", "/test.php" + queryString, true);
ajaxRequest.send(null);
}

//-->

<body>
<a href='#' id='3' onclick='ajaxFunction()'>Test</a>
</body>

thx

7:19 am on May 9, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 15, 2004
posts:681
votes: 0


Does linkobject.href not work?
3:52 pm on May 9, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Nov 28, 2004
posts:7999
votes: 0


First, I don't know if you can get a value from an anchor. It's not a form field, hence, no value attribute. As adni suggested,

var id=document.getElementById('id').href;

Second, where is the element you've applied the id "id" to?

You may be confusing the id attribute with an actual id value. For this to work,

var id=document.getElementById('id').href;

you have to do this

<a href='#' id='id' onclick='ajaxFunction()'>Test</a>

It may be less confusing if you don't apply an id value of "id":
var id=document.getElementById('some_link').href;

<a href='#' id='some_link' onclick='ajaxFunction();return false;'>Test</a>

Returning false from the function or adding it inline as shown will prevent the click from causing a navigation to the top of the page.

4:53 pm on May 13, 2008 (gmt 0)

Junior Member

10+ Year Member

joined:Oct 25, 2004
posts:86
votes: 0


The purpose was for an article tree and what seems to work is using a form with styled input buttons to look like folders or documents.

It seems to work but I was not sure if this was the best way of doing something like this.

<input type='button' onclick='ajaxFunction()' value='Query MySQL' />

I would end up having a 100 or so of these buttons per page. Is that considered a bad practice or typical?

5:46 pm on May 17, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 15, 2004
posts:681
votes: 0


I don't really think it matters, as long as it serves the purpose it needs to.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members