How to get Id of Div

Question

scorpionz 1 Junior Poster

16 Years Ago

Hi this is ScorpionZ
can anyone have an idea like
I have a div box with its 'id' and an Text area
When i click on my Div box I get this the ID through Javascript and Print it on Text area
Here is a little piece of code

<html>
<head>

<script type="text/javascript">
</script>

</head>
<body>
<div id="mydiv" onclick="" style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;>
</div>

<textarea> </textarea>
<body>
</html>

Here above is the little Code
Any Response will be highly appreciated with great Interest

Thanks and Regards
ScorpionZ

javascript

4 Contributors
15 Replies
735 Views
3 Years Discussion Span
Latest Post 13 Years Ago Latest Post by maniac23

Luckychap 68 Posting Pro in Training

16 Years Ago

var divEls = document.getElementsByTagName("div");
var i = 0;
for(i=0;i<divEls.length;i++)
alert(divEls[i].id);

scorpionz commented: This Luckychap is a good person to talk with. Understand the Points, Nicely +2

Luckychap 68 Posting Pro in Training

16 Years Ago

write this code inside your script-tag OR create a function which contains this code inside the script-tag. And call it when ever u want it.

sanjayNawab 0 Newbie Poster

16 Years Ago

first tell, when u want the id to be shown and where.

Luckychap 68 Posting Pro in Training

16 Years Ago

Hi

I have changed ur code a little bit, I gave an id to textarea and in the function get_id() i have put the value of id:

<html>
<head>

<script type="text/javascript">
function get_id()
{
var divEls = document.getElementsByTagName("div");
var textEl = document.getElementById("mytextarea");
var i = 0;
for(i=0;i<divEls.length;i++) {
//alert(divEls[i].id);
textEl.value = divEls[i].id;
}
}
</script>

</head>
<body>
<div id="mydiv" onclick="get_id()" style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;width:130px;height:10px;'>
</div>

<textarea id="mytextarea"> </textarea>
</body>
</html>

Hope I have undestant what u wnat me to

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

This Luckychap is a good person to talk with. Understand the Points, Nicely

scorpionz 1 Junior Poster · Answer 1 · 2008-05-26T12:00:33+00:00

Unfortunately i dont understand your reply in any sense...
How can i apply this to my code to get it don right so
Please do embed it with How to implement....

Thanks and Regards
Scorpionz

scorpionz 1 Junior Poster · Answer 2 · 2008-05-26T13:12:58+00:00

Thanks Buddy It works really Its helpful
But i exactly I want this Id to be catch inside text area that i have showed it below
Kindly help me with this.....

<html>
<head>

<script type="text/javascript">
function get_id()
{
	var divEls = document.getElementsByTagName("div");
	var i = 0;
	for(i=0;i<divEls.length;i++)
	alert(divEls[i].id);
}
</script>

</head>
<body>
<div id="mydiv" onclick="get_id()" style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;width:130px;height:10px;'>
</div>

<textarea> </textarea>
<body>
</html>

Thanks and regards
scorpionz

scorpionz 1 Junior Poster · Answer 3 · 2008-05-27T01:46:34+00:00

Well Thanks first of all for replying and asking me...
Well
Mr. sanjayNawab, I have already mentioned in mt posts that whever i click on div its give the div id name on Textfield that i have mentioned below before end of </body>
Hope it will be understandable

Regards
Scorpionz

<html>
<head>

<script type="text/javascript">
function get_id()
{
var divEls = document.getElementsByTagName("div");
var i = 0;
for(i=0;i<divEls.length;i++)
alert(divEls[i].id);
}
</script>

</head>
<body>
<div id="mydiv" onclick="get_id()" style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;width:130px;height:10px;'>
</div>

<textarea> </textarea>
</body>
</html>

scorpionz 1 Junior Poster · Answer 4 · 2008-05-27T13:23:43+00:00

Yes Men Definitely I Must Say THANKS A LOT FOR GET ME out of this,
Now I have little update in code, In wich i edit a js function of get_val(), and href and another Textarea.
The Working mechanism is that, I got the Id of div on my text area, Now if i click href that holds another JS function, It just send the values inside first text area to second text area, or if i just edit some more values inside text1 and again clicks href then it also send them to second text area, by removing the old value with the new value
Can it be possible

Let me share a code that i update,
Change it please if i am missing something....

<html>
<head>

<script type="text/javascript">
function get_id()
{
var divEls = document.getElementsByTagName("div");
var textEl = document.getElementById("mytextarea");
var i = 0;
for(i=0;i<divEls.length;i++) {
//alert(divEls[i].id);
textEl.value = divEls[i].id;
}
}

function get_val()
{
var hre = document.getElementsByTagName("src");

var text1 = document.getElementsById("mytextarea");

var text2 = document.getElementsById("mytextarea2");

hre.text1.value=hre.text2.value;

}

</script>

</head>
<body>
<div id="mydiv" onclick="get_id()" style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;width:130px;height:10px;'>
<a href="#" id="src" onclick="get_val()">ScorpionZ</a></div>

<textarea id="mytextarea"> </textarea>

<textarea id="mytextarea2"> </textarea>
</body>
</html>

Hope it will Clear in more Detail.
Waiting for Reply back

Thanks and Regards
Scorpionz

Luckychap 68 Posting Pro in Training · Answer 5 · 2008-05-27T14:47:59+00:00

Changing ur code for get_val() a little bit.

function get_val()
{

var text1 = document.getElementsById("mytextarea");

var text2 = document.getElementsById("mytextarea2");

text1.value = text2.value;

}

Hope again!! I have understood ur problem. While explainning, be slow and carefull, it will save lots of time. TIME MATTERS MAN!!

scorpionz 1 Junior Poster · Answer 6 · 2008-05-28T10:57:12+00:00

Hi Thanks Luck For Understanding a problem and shares a time ....

But well the Code is really not working at all
Even I separate them in Different Div Tags....
and as Far as Previous Issue is Concerned.... that also not working like i said IF i click href then it calls get_val() function and copy send that Text 1 value to text 2 and show it there
and even if i edit some thing in text 1 and thus after clicking on href it sends to Text 2

I hope it will more clear scenario, and I have make a little change in design as Well, Hop it looks cool to understand

<html>
<head>

<script type="text/javascript">
function get_id()
{
var divEls = document.getElementsByTagName("div");
var textEl = document.getElementById("mytextarea");
var i = 0;
for(i=0;i<divEls.length;i++) {
//alert(divEls[i].id);
textEl.value = divEls[i].id;
}
}

function get_val()
{
//var hre = document.getElementsByTagName("src");

var text1 = document.getElementsById("mytextarea");

var text2 = document.getElementsById("mytextarea2");

text1.value=text2.value;

}


</script>

</head>
<body>

<div style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;width:380px;'>
<textarea id="mytextarea"> </textarea>

<textarea id="mytextarea2"> </textarea>
</div>
&nbsp;
<div id="mydiv" onclick="get_id()" style='border-width:1px;border-color:#C0C0C0;border-style: solid;background-color:#C0C0C0;width:130px;'>
<a href="#" id="src" onclick="get_val()">ScorpionZ</a>
</div>

</body>
</html>

after all Thanks for you time once again, Hoping for more...

Luckychap 68 Posting Pro in Training · Answer 7 · 2008-05-28T11:41:38+00:00

I m sorry I did little mistake changing the get_val() function:

function get_val()
{

var text1 = document.getElementsById("mytextarea");

var text2 = document.getElementsById("mytextarea2");

//text1.value=text2.value;  That was wrong
text2.value=text1.value;


}

scorpionz 1 Junior Poster · Answer 8 · 2008-05-28T11:55:36+00:00

Thanks a lot Lucky

But aha!!! One more mistake that we are doing here is that

I was using
documents.get....
so s was making problem
that is get invisible for us :D :D

Well But No doubt Its Done
Remarkably

Thanks a Lot once again
and ha do u have any idea regarding
Div Box moving around Browser, I started one of the thread regarding this, but not much feedback for me....
I make an demo but it was a browser problem at the end
the thing that i am doing is i move a div box using mouse and shows its position and where i stop it, it just shows (x,y) coordinates there....
do u have idea about that.... here is the link about that thread:
http://www.daniweb.com/forums/post613636.html#post613636

Once again Thanks

Regards
Scorpionz

Luckychap 68 Posting Pro in Training · Answer 9 · 2008-05-28T12:13:14+00:00

Why are not using YUI thats good, i have used it thats work fine: http://developer.yahoo.com/yui/examples/dragdrop/index.html

scorpionz 1 Junior Poster · Answer 10 · 2008-05-28T12:23:28+00:00

Hi Big Thanks Now i am Posting the message regarding this Topic on new that thread....
Lets have a discussion there
......
http://www.daniweb.com/forums/thread125865.html

Hope Will Not Problem for You

Regards
Scorpionz

maniac23 0 Newbie Poster · Answer 11 · 2011-08-20T18:33:35+00:00

thanx a ton for the post ... I am a newbie to JS and was in real trouble to find a solution to my problem :)... thanx againg for the help