Re: Send data with XMLHttpRequest - JavaScript Discussion Boards

Thanks, I have found the solution

Hi all,
I am trying to pass the value inside of "this.id" from one function to another function but it's not working. Basically I am trying to grab the id of a thumbnail image which is inside anchor tags, by using "this.id" when they are clicked. Then I would like to display data related to the clicked thumbnail which are stored in an array, using innerHTML. I am using the AddEventListener property inside the script tags to listen for the onclick event thus I do not have the onclick property on my webpage. The following are my functions inside the script tags:

JavaScript

var songTitle =new Array("Title1", "Title2");
  function AddListeners()
    {
     if(window.addEventListener)
      {
       document.getElementById('A1').AddEventListener("click",Display_Info,false);
       document.getElementById('A2').AddEventListener("click",Display_Info,false);
       document.getElementById('A3').AddEventListener("click",Display_Info,false);
      }
     else if(window.attachEvent)
      {
       document.getElementById('A1').attachEvent("onclick",Display_Info);
       document.getElementById('A2').attachEvent("onclick",Display_Info);
       document.getElementById('A3').attachEvent("onclick",Display_Info);
      }
     }      

      function imgClicked(x)
      {
          var idClicked = x; //get thumbnail id      
          var newID = idClicked.substring(0,1); //subtract first character of thumbnail id        
          var convertedID = ParseInt(newID,10); //convert id to integer         
          return convertedID;          
      }
   
      function Display_Info()//passing in Parameter            
      {                 
          var A= this.id;
          var picID = imgClicked(A);
          document.getElementById('Title').innerHTML= songName[picID];                  
      }

The following are anchor tags inside the body of my webpage:

HTML

<a href="#self"><img src=image1" id="A0"></a>
<a href="#self"><img src=image2" id="A1"></a>
<a href="#self"><img src=image3" id="A2"></a>

Please take a look to see why my script is not working. Any help is greatly appreciated, thanks in advance.

.id is a property of html element (html DOM), not of a function
this is the pointer of an instance like html element inside of html DOM.

document.getElementById('A1').AddEventListener("click",Display_Info,false);
--> this is the pointer of document.getElementById('A1')
param of Display_Info is not exists like pointer or id-string-value

Hi, thanks for replying. I understand that id is a property of DOM element but I've seen tutorials where "this.id" is used to get the id of an element that is clicked. Because I am using the AddEventListener property, I did not use the

onclick="Dispay_Info();"

in my webpage.

FYI all your anchor tags src= have no opening double-quotes

Hello
Considering to this teaching

http://translate.google.com/translate?hl=fa&sl=fa&tl=en&u=http%3A%2F%2Fwww.srco.ir%2FArticles%2FDocView.asp%3FId%3D558

Good on my test asp answered.

We exchanged html page when I code 2
<pre lang="Javascript">onclick="sendRequest('2.html?id=1')"</pre>
<pre lang="Javascript"><div id="d1">
</div>
<script type="text/javascript">
var q = location.search.substring(1).split('=');

if (q[1] > 0) {
document.getElementById('d1').innerHTML = "اطلاعات شما ثبت شد";
}
else {
document.getElementById('d1').innerHTML = "خطا در ثبت اطلاعات";
}
</script></pre>

If the output is

<pre lang="Javascript"><div id="d1">
</div>
<script type="text/javascript">
var q = location.search.substring(1).split('=');

if (q[1] > 0) {
document.getElementById('d1').innerHTML = "اطلاعات شما ثبت شد";
}
else {
document.getElementById('d1').innerHTML = "خطا در ثبت اطلاعات";
}
</script></pre>

How much to take

هـر جا چراغی روشنه از ترس تنها بودنه ای ترس تنهایی من ، اینجا چراغی روشنه

Your question is not clear. English please.

Sandeep Mewara
Microsoft ASP.NET MVP 2012 & 2013

[My Blog]: Sandeep Mewara's Tech Journal!
[My Latest Article]: HTML5 Quick Start Web Application

2 page html
page 1 > 1.html
<pre lang="HTML"><html dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
<meta http-equiv="Content-Language" content="fa">
<title>New Page 1</title>
<script type="text/javascript">
var xmlHttp = null;

if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert('استفاده ممکن نیست'); } }

function sendRequest(url) {
if (xmlHttp) {
xmlHttp.open("POST", url, true); // "GET", "POST", "HEAD"
xmlHttp.onreadystatechange = onCallback;
xmlHttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlHttp.send(null);
}
}

function onCallback() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200 || xmlHttp.status == 304) {
document.getElementById('results').innerHTML = xmlHttp.responseText;
}
else {
alert('Error: ' + xmlHttp.status);
}
}
}
</script>
</head>
<body style="font-family: Tahoma;">
<input type="button" value="Show" onclick="sendRequest('2.html?id=1')" />
<br />
<div id="results">
</div>
</body>
</html></pre>

---------------

page 2 > 2.html

<pre lang="HTML"><div id="d1">
</div>
<script type="text/javascript">
var q = location.search.substring(1).split('=');
var x = document.getElementById('d1');
if (q[1] > 0) {
x.innerHTML = "oki";
}
else {
x.innerHTML = "no";
}
</script>
</pre>
-------------------------------------------------------------------

Output in the
onclick="sendRequest('2.aspx?id=0')"

results >

<pre lang="HTML"><div id="d1">
</div>
<script type="text/javascript">
var q = location.search.substring(1).split('=');
var x = document.getElementById('d1');
if (q[1] > 0) {
x.innerHTML = "oki";
}
else {
x.innerHTML = "no";
}
</script>
</pre>
WTF | :WTF:

x.innerHTML = "oki"; or no??

هـر جا چراغی روشنه از ترس تنها بودنه ای ترس تنهایی من ، اینجا چراغی روشنه

In this post, we will see how to create a multi-colum drag-drop interface for form fields using Twitter Bootstrap for UI and controls.

http://www.anupshinde.com/form-builder-part-2

modified 3-May-13 11:05am.

Why do you consider this a question? Thumbs Down | :thumbsdown:

The link is error 404 anyhow. D'Oh! | :doh:

I must be in a hurry ... not sure how the links messed up and how it ended up here instead of the lounge... I'll remove it from here

can't remove, but corrected the link anyways.

you should really submit this differently else it will get marked as spam.

maybe try http://www.codeproject.com/script/Articles/BlogFeed.aspx[^].

as if the facebook, twitter and message boards weren't enough - blogged

Hi,

i have one link, if I will click on that it will open one video on different page. before loading this video into separate page i want to display loading image/progress bar.

My problem is i am using code because of which i am not able to match the time taken to load the video..
$('#dvLoading').fadeOut(2000);

some time it is taking more that 2000 or sometime taking less time..

Note: i m using javascript to display video on page using:
swfobject.embedSWF(playerUrl, "richMediaPlayer", playerWidth, playerHeight, "9.0.0", "expressInstall.swf", flashvars, params, attributes);

please help me its urgent to me...

Thanks in advance

status bar otr image/progress bar must be includes by flash. So se webpage of developers of flash plugin.

If you want, use HTML-5-audio or -video. For Internet Explorer see http://msdn.microsoft.com/en-us/library/ff975073(v=vs.85).aspx

Hello,

I cant download the source code for jQuery Paging Fast and Easy[^]

can some one help please? I am trying to page the results of an SQL query which returns Binary results(mp3 files)

thank you.

You need to report this to the site admins here[^]

I am trying to learn the library jQuery which is used in JavaScript. Please consider the following line of code which I got from the book "Pro jQuery":

var jq = $( 'img[src*=daffod[i]' );

I do not understand the meaning of:

src*=daddod[i]

Please tell me what *= means.

Thanks

Bob

JavaScript

src *= daffod[i]

is shorthand way of using this..

JavaScript

src = src * daffod[i];

it's a multiply combined with an assignment

"It's true that hard work never killed anyone. But I figure, why take the chance." - Ronald Reagan

That's what machines are for.

Got a problem?
Sleep on it.

dusty_dex wrote:
it's a multiply combined with an assignment

Not in a jQuery selector it isn't! Poke tongue | ;-P

"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer

Yep, I know this now. Mad | :mad:

Why on Earth do they have to pick operators that are in common use already?

Operator abuse it just ain't healthy. Thumbs Down | :thumbsdown:

"It's true that hard work never killed anyone. But I figure, why take the chance." - Ronald Reagan

That's what machines are for.

Got a problem?
Sleep on it.

There's only 30 symbols easy to type on a normal keyboard. We have to share those between different languages. It's confusing at first but over time you'll learn to interpret the various languages without too much thinking about it.

See http://www.w3schools.com/js/js_operators.asp[^].

Use the best guess

That is the attribute contains selector[^]

You can infer from this example:-
$(“a[href*=jquery.com]”)
This selector matches all <a> elements that reference the jQuery site.

That means: it selects all <a> elements that has a value 'jquery.com' in it's attribute 'href'. (* means anywhere in the string, ^ means begins with, $ means ends with)