Announcement

**sad69** · Mar 8, 2004, 02:03 PM

I don't know much about ASP, but I'll attempt to answer your questions anyway.

First off, you have to understand the split between Client-side and Server-side and make sure you never lose sight of that border.

In PHP, your PHP (anything within <?php ... ?>) code will be executed on the server-side, and EVERYTHING else will be executed on the client-side (HTML, Javascript, VBScript, and whatever else...).

Here is a small example, but hopefully it covers the basics to help you understand:

PHP Code:


<?php

 //PHP functions - server side

 function getMinutes() {

  return getDate()["minutes"];

 }



 function getSeconds() {

  return getDate()["seconds"];

 }

?>



<html>

 <head>

  <title>PHP/Javascript Counter</title>

  

  <script>

   //Javascript functions - client side

   function updateCounter() {

    var secs = span_seconds.firstChild.value;

    var mins = span_minutes.firstChild.value;

    secs= parseInt(secs) + 1;

    if(secs>= 60) {

     secs= 0;

     mins++;

     if(mins >= 60)

      mins = 0;

    }



    span_seconds.firstChild.value = secs;

    span_minutes.firstChild.value = mins;



    setTimeout("updateCounter", 1000);

   }

  </script>

 </head>



 <body>

  <span id="span_minutes"><?php echo getMinutes(); ?></span>

  <span id="span_seconds"><?php echo getSecond(); ?></span>

  <script>setTimeout("updateCounter()", 1000);</script>

 </body>

</html>

Whoa that was more work than I thought... I haven't tested any of that code, so it probably won't work...

But if you read it, you'll get the gist of it I'm sure -- further, it will answer all of the questions you posed.

You can create PHP functions which are to be used on the server-side (getMinutes() and getSeconds()). These functions can be in a separate PHP file to be included, or in the same file if you prefer.

You can create Javascript functions (or VBScript functions but only on IE) to be used/executed on the client-side ONLY.

Umm, I don't know what else. Post back if you're still having trouble. Again, I apologize for not debugging my above code.

Hope that helps,
Sadiq.

**d000hg** · Mar 8, 2004, 02:52 PM

Yes I think I understand. When the page is loaded the document already contains text for the time which the server generates. Then every second this is replaced with the current value by the javascript timer callback.
I've not seen the span tag used like that, is it a common way of getting access to non-special elements like 'normal' text? If you put other elements in a span like

Code:

<span id="span1">
Some text
<p>
Some more text
</p><p>
Even more text
</p></span>

Then could you access span1.firstChild, span1.SecondChild... or span1.child[n] in the same way? If you have

Code:

<span id="span2"><p name="para1">Some text</p></span>

Can you access span2.para1?

Thanks

**duniyadnd** · Mar 8, 2004, 03:01 PM

Yes, you can have functions in PHP if you want, but you still need access to it. You can also implement classes (something I prefer as it keeps things simpler in the long run and saves a lot of time).

As for integrating PHP and Javascript, my experience is that I use PHP to output the data I need to put out in forms and such, but I've never really put anything directly in the js scripts, but I'm sure you can create functions to create output text in javascript functions.

**sad69** · Mar 8, 2004, 03:21 PM

Using the firstChild idea is called DOM.

This is the API I use and it should assist you in using it:

http://krook.org/jsdom/Node.html

So no, you can't use secondChild, thirdChild, etc... You can only refer to the firstChild and lastChild. For the inbetweens, you'd use childNodes.item(i), where i is an inbetween number (indexed at 0, so the first child is actually i = 0).

You don't have to use it in this way, you can use any method you normally use to output text or whatever you normally do with client-side Javascript.

As duniyadnd mentioned, you can also use classes. I didn't mention them because I was merely trying to answer your questions as consisely as I could, but that's something you can read up on if you like.

Your second method span2.para1 wouldn't work. if para1 was the id and not the name, you could refer to it directly (not having to go through span2...).

If you've got more questions, just ask. Try Google-ing your questions first though, you'll probably learn more and come across more accurate information too!

Hope that helps,
Sadiq.

**d000hg** · Mar 8, 2004, 04:34 PM

I've used the DOM a little but either it's a lot bigger than I thought (probably) or there is more than one way of interfacing with it. I know one of the principle DOM objects (possibly document?) has a list of the links, images, etc which lets you do documents.images[i].href.src="someimage.gif" or along those lines; I presume using the span tag just lets you create an entry in one of these lists. It seems also each element can be accessed directly, not through document. etc. I thought when you gave elements names that was used though not the id. That link looks thorough but complex - could you suggest a good reference to the DOM which is pretty complete but also not too hard?

Many thanks for your help, it's appreciated. I like these forums already!
Normally I'd look around myself more but I'm on a very tight schedule right now...!

**sad69** · Mar 8, 2004, 05:57 PM

The link I gave you was an API -- this gives you all the methods and attributes that you would require. It's not a tutorial.

If you're looking for a tutorial, I would suggest you to Google it. I don't know of a link off hand.

Further, there is a DOM forum in the client-side Javascript area. You'd be best to post these types of questions there.

The main thing you want to think of is that a document (be it an HTML document) is a tree. Like all trees it has a root node and then some children nodes (who in turn have children, etc....).

When you refer to the document.[whatever], you're referring to the root node (document)'s children (whatever). If you look at nicely formatted HTML, you'll notice the indentations represent this tree that I'm talking about.

You are correct in saying that there are multiple ways to reference a node. But that doesn't mean that there are more than one copies of that node. There is only the one copy, and all the different methods of referencing them are merely references to the actual node.

But like I say, Google it, you'll come up with some better information, and any further questions should be posted in the DOM forum.

Sadiq.

**d000hg** · Mar 8, 2004, 06:10 PM

Thanks for that, I didn't look in the javascript forum group just yet. I found a nice DOM explanation at http://www.mozilla.org/docs/dom/domref/. I never realised you could add content to the page by creating new DOM elements - I thought it was just to let you access and alter existing elements. Cool!

Announcement

Utilising javascript

Utilising javascript

Comment

Comment

Comment

Comment

Comment

Comment

Comment