Scoping Issue

[Kevin]

Hi there,

My HTML calls two javascript functions:

1. paint a webpage with textboxes and drop down menus;
2. populate the webpage with the XML DOM values.

The paint function, #1, just consists of two functions: drawTextBox
and drawDropDown menu.

Inside of these functions I just call document.write(input type=select
OR type= text ...).

I need to add onclick functionality to the drop-down menus so that
when they're clicked, they access a particular URL that the XML DOM
specifies.

My problem is that I don't know how to add this onclick functionality.
If I try to add it in the paint function, I can't because it doesn't
yet have access to the XML DOM, which is called in function #2. If I
try to add the onclick functionality using dropdown.onclick = function
( window.location=...), I can't get that to work either.

Please give me advice.

thank you,
Kevin

 

[Garrett Smith]

Hi there,

My HTML calls two javascript functions:

1. paint a webpage with textboxes and drop down menus;
2. populate the webpage with the XML DOM values.

The paint function, #1, just consists of two functions: drawTextBox
and drawDropDown menu.

Paint? I don't much care for the name of that function, much less what
it does.

Putting the HTML in the ousrce code is usually a lot easier to debug and
run through the validator.

Inside of these functions I just call document.write(input type=select
OR type= text ...).

I need to add onclick functionality to the drop-down menus so that
when they're clicked, they access a particular URL that the XML DOM
specifies.

My problem is that I don't know how to add this onclick functionality.
If I try to add it in the paint function, I can't because it doesn't
yet have access to the XML DOM, which is called in function #2. If I
try to add the onclick functionality using dropdown.onclick = function
( window.location=...), I can't get that to work either.

Please give me advice.

Consider using links for the menu items that need to act like links.

<a id="CHeader" href="/csection/">
<ul class="menu" id="CMenu">
<li><a href="http://example.net/">eggs</a></li>
</ul>

Garrett

 

[Thomas 'PointedEars' Lahn]

Paint? I don't much care for the name of that function, much less what
it does.

Indeed, that document would not be accessible. Better to use XSLT
server-side to transform the XML document into an HTML fragment.

Consider using links for the menu items that need to act like links.

<a id="CHeader" href="/csection/">

That element is unfinished, and therefore the resulting markup not Valid.

<ul class="menu" id="CMenu">
<li><a href="http://example.net/">eggs</a></li>
</ul>

Perhaps you wanted to suggest

<ul class="menu">
<li><a href="/csection/">spam</a>
<ul>
<li><a href="http://example.net/">eggs</a></li>
</ul></li>
</ul>

Prune unnecessary IDs.


PointedEars

 

[Kevin]

Consider using links for the menu items that need to act like links.

<a id="CHeader" href="/csection/">
<ul class="menu" id="CMenu">
   <li><a href="http://example.net/">eggs</a></li>
</ul>

Garrett

Hi Garrett,

I don't see how I can set the "<a href="http://example.net/">"
statically. The "http://example.net" is stored in the XML DOM that I
haven't yet imported.

Please correct me if I'm wrong, or explain to me how I can use your
code above?

I experimented with "this," namely I set my button to,

"<input name="myButton" type="button" onclick='window.location=' +
this.value ..." // please ignore bad syntax here

What I tried to do was dynamically set the "window.location=" based on
the button's value. So, this HTML was created during the paint
function. In the "populate the screen" function, I changed the value
of the HTML's "myButton" based on the XML DOM. However, this approach
hasn't worked.

Thomas, I'm reading up on XSLT server-side now to transform the XML
document into an HTML fragment. I don't know what that is, I'll read
about it now. Thanks.

 

[Thomas 'PointedEars' Lahn]

Kevin wrote:

[attribution restored]

[Garrett Smith wrote:]

Consider using links for the menu items that need to act like links.

<a id="CHeader" href="/csection/">
<ul class="menu" id="CMenu">
<li><a href="http://example.net/">eggs</a></li>
</ul>

[...]
I don't see how I can set the "<a href="http://example.net/">"
statically. The "http://example.net" is stored in the XML DOM that I
haven't yet imported.

First, get your terminology right. You are _not_ importing a/the XML
Document Object Model (DOM); you are importing, at most, an XML _document_.

Second, you can either use server-side XSLT so that you don't need to import
anything client-side, or you can use client-side XSLT to transform the XML
document resource from the server (depends on your target environments), so
that in both cases you might not need client-side scripting at all.

Please correct me if I'm wrong, or explain to me how I can use your
code above?

You can use my correction of that code verbatim (of course, you will still
have to do the CSS part). It is structurally what must be the result of the
XML transformation process.

I experimented with "this," namely I set my button to,

"<input name="myButton" type="button" onclick='window.location=' +
this.value ..." // please ignore bad syntax here

The value of this button is this button's caption. That is most likely not
where you want to navigate to. In fact, it does not make sense to use a
button for navigation where a hyperlink would have sufficed.

Thomas, I'm reading up on XSLT server-side now to transform the XML
document into an HTML fragment. I don't know what that is, I'll read
about it now. Thanks.

You're welcome.

But keep in mind that this is a threaded one-to-many communications medium.
So please keep at least the names of all relevant attribution lines, avoid
summary followups (unless it's only a thank you to all), and trim your
quotes to the relevant minimum, especially usually do not quote any
signatures.

<http://jibbering.com/faq/#posting>


PointedEars