onclick Javascript Problem

Hello,

I have found myself in the position of having to manage & "hack" a web
site built by someone else. I am trying to make a modification to the
javascript code and have been unable to get this working. I admit that
I am a total javascript beginner, but have read google & purchased the
o'reilley javascript book. So far, all I've been able to achieve are
numerous javascript errors!

Currently, we have a drop-down box which triggers an "onchange" event.
I would like to reproduce some of this functionality with a simple
button or text link & therefore need to use the "onclick" event.

Current javascript for "onchange" looks like this:

function setExtent(obj){

var sExt=obj.value;

if(sExt==""){
return;
}

var x1,y1,x2,y2;
var s;

//get coordinates from string
var i = sExt.indexOf(",");

if(i>0) {
x1 = parseFloat(sExt.slice(0,i));
sExt = sExt.slice(i+1);
}

i = sExt.indexOf(",");

if(i>0) {
y1 = parseFloat(sExt.slice(0,i));
sExt = sExt.slice(i+1);
}

i = sExt.indexOf(",");

if(i>0) {
x2 = parseFloat(sExt.slice(0,i));
sExt = sExt.slice(i+1);
}

y2 = parseFloat(sExt);

// alert(x1+","+y1+","+x2+","+y2);

//get map
var map = top.mapwindow.document.mapApplet.getMap();

//get FloatRectangle object
var ext = map.getExtent();


//set Extent boound
ext.setBounds(x1,y1,x2,y2);


//change map extent
map.setExtent(ext, null);

//force repaint
map.updateMap();

}

The HTML for the drop down box looks like this:

<select name="theme" size=1 onChange="setExtent(this)">
<option value="10350350,3380230,10582000,3531280">Location </option>
</select>

So basically what happens is when someone selects that option from the
drop down list, they are taken to the coordinates on the map (per the
"value").

How can this be duplicated using a text link or button with
"onclick"??

Thanks a bunch for your help!

re: onclick Javascript Problem

"Jim Bond" <mailing_list_9999@yahoo.com> wrote in message
news:1b79db20.0309031229.53782b74@posting.google.c om...[color=blue]
> Hello,
>
> I have found myself in the position of having to manage & "hack" a web
> site built by someone else. I am trying to make a modification to the
> javascript code and have been unable to get this working. I admit that
> I am a total javascript beginner, but have read google & purchased the
> o'reilley javascript book. So far, all I've been able to achieve are
> numerous javascript errors!
>
> Currently, we have a drop-down box which triggers an "onchange" event.
> I would like to reproduce some of this functionality with a simple
> button or text link & therefore need to use the "onclick" event.
>
> Current javascript for "onchange" looks like this:
>
> function setExtent(obj){
>
> var sExt=obj.value;
>
> if(sExt==""){
> return;
> }
>
> var x1,y1,x2,y2;
> var s;
>
> //get coordinates from string
> var i = sExt.indexOf(",");
>
> if(i>0) {
> x1 = parseFloat(sExt.slice(0,i));
> sExt = sExt.slice(i+1);
> }
>
> i = sExt.indexOf(",");
>
> if(i>0) {
> y1 = parseFloat(sExt.slice(0,i));
> sExt = sExt.slice(i+1);
> }
>
> i = sExt.indexOf(",");
>
> if(i>0) {
> x2 = parseFloat(sExt.slice(0,i));
> sExt = sExt.slice(i+1);
> }
>
> y2 = parseFloat(sExt);
>
> // alert(x1+","+y1+","+x2+","+y2);
>
> //get map
> var map = top.mapwindow.document.mapApplet.getMap();
>
> //get FloatRectangle object
> var ext = map.getExtent();
>
>
> //set Extent boound
> ext.setBounds(x1,y1,x2,y2);
>
>
> //change map extent
> map.setExtent(ext, null);
>
> //force repaint
> map.updateMap();
>
> }
>
> The HTML for the drop down box looks like this:
>
> <select name="theme" size=1 onChange="setExtent(this)">
> <option value="10350350,3380230,10582000,3531280">Location </option>
> </select>[/color]

So you pass reference to c
[color=blue]
>
> So basically what happens is when someone selects that option from the
> drop down list, they are taken to the coordinates on the map (per the
> "value").
>
> How can this be duplicated using a text link or button with
> "onclick"??
>
> Thanks a bunch for your help![/color]

<button onclick="setExtent(document.getElementById('theme' ))">Go!</button>

re: onclick Javascript Problem

Won't work if scripting is disabled. You should always document.write
elements that are completely script-dependant (think about it.)
You need a submit button nested in a noscript tag to complete this solution
(as well as a little server-side code of course.)

| <button onclick="setExtent(document.getElementById('theme' ))">Go!</button>
|
|

re: onclick Javascript Problem

"Vjekoslav Begovic" <vjbegovic@inet.hr> wrote in message news:<bj5m7a$sd4$1@sunce.iskon.hr>...[color=blue]
> "Jim Bond" <mailing_list_9999@yahoo.com> wrote in message
> news:1b79db20.0309031229.53782b74@posting.google.c om...[color=green]
> > Hello,
> >
> > I have found myself in the position of having to manage & "hack" a web
> > site built by someone else. I am trying to make a modification to the
> > javascript code and have been unable to get this working. I admit that
> > I am a total javascript beginner, but have read google & purchased the
> > o'reilley javascript book. So far, all I've been able to achieve are
> > numerous javascript errors!
> >
> > Currently, we have a drop-down box which triggers an "onchange" event.
> > I would like to reproduce some of this functionality with a simple
> > button or text link & therefore need to use the "onclick" event.
> >
> > Current javascript for "onchange" looks like this:
> >
> > function setExtent(obj){
> >
> > var sExt=obj.value;
> >
> > if(sExt==""){
> > return;
> > }
> >
> > var x1,y1,x2,y2;
> > var s;
> >
> > //get coordinates from string
> > var i = sExt.indexOf(",");
> >
> > if(i>0) {
> > x1 = parseFloat(sExt.slice(0,i));
> > sExt = sExt.slice(i+1);
> > }
> >
> > i = sExt.indexOf(",");
> >
> > if(i>0) {
> > y1 = parseFloat(sExt.slice(0,i));
> > sExt = sExt.slice(i+1);
> > }
> >
> > i = sExt.indexOf(",");
> >
> > if(i>0) {
> > x2 = parseFloat(sExt.slice(0,i));
> > sExt = sExt.slice(i+1);
> > }
> >
> > y2 = parseFloat(sExt);
> >
> > // alert(x1+","+y1+","+x2+","+y2);
> >
> > //get map
> > var map = top.mapwindow.document.mapApplet.getMap();
> >
> > //get FloatRectangle object
> > var ext = map.getExtent();
> >
> >
> > //set Extent boound
> > ext.setBounds(x1,y1,x2,y2);
> >
> >
> > //change map extent
> > map.setExtent(ext, null);
> >
> > //force repaint
> > map.updateMap();
> >
> > }
> >
> > The HTML for the drop down box looks like this:
> >
> > <select name="theme" size=1 onChange="setExtent(this)">
> > <option value="10350350,3380230,10582000,3531280">Location </option>
> > </select>[/color]
>
> So you pass reference to c
>[color=green]
> >
> > So basically what happens is when someone selects that option from the
> > drop down list, they are taken to the coordinates on the map (per the
> > "value").
> >
> > How can this be duplicated using a text link or button with
> > "onclick"??
> >
> > Thanks a bunch for your help![/color]
>
> <button onclick="setExtent(document.getElementById('theme' ))">Go!</button>[/color]

Thank you for your reply!

I think what you're telling me how to do basically just creates a
submit button that works with the drop down box, right?

If so, that isn't what I want to do.

I currently have the drop down box & that works perfectly fine with
the javascript function shown above. What I'm trying to do is
duplicate that functionality with a simple text link or button. What
I want to do has nothing to do with a drop down box. I simply posted
that as an example of what I currently have.

So, to paraphrase:

Currently, I have a drop down box on the page. Someone can select an
option from this box & be taken to coordinates on a map (see above
javascript & html).

What I want to be able to do is create a text link on the page which
can be clicked & calls the coordinates on the map. That's it! When I
try to modify the javascript code to work with a text link & the
onclick event, I always end up with javascript errors (too numerous to
post here), so I'm obviously doing something wrong.

Thanks.

re: onclick Javascript Problem

"Jim Bond" <mailing_list_9999@yahoo.com> wrote:
[color=blue]
> I think what you're telling me how to do basically just creates a
> submit button that works with the drop down box, right?[/color]

Right.
[color=blue]
> If so, that isn't what I want to do.
>
> I currently have the drop down box & that works perfectly fine with
> the javascript function shown above. What I'm trying to do is
> duplicate that functionality with a simple text link or button. What
> I want to do has nothing to do with a drop down box. I simply posted
> that as an example of what I currently have.[/color]

Then you will have to modify your function setExtent(). There are many ways
to achieve functionality you want. One way is this:

function setExtent(obj){
[color=blue][color=green]
>>var sExt=obj.value;[/color][/color]

Instead of this line put:
var sExt
if (setExtent.arguments.length > 1){
sExt=setExtent.arguments[1]
}
else{
sExt=obj.value;
}



That is not elegant solution, but if you want to *duplicate* functionality
with list-boxes, I think this is quite a good because you will not have to
modify yours list-boxes.

Then, you could add your button:

<button onclick="setExtent(null,
'10350350,3380230,10582000,3531280')">Test</button>


IE6 tested.


Regards

Vjekoslav

re: onclick Javascript Problem

mailing_list_9999@yahoo.com (Jim Bond) wrote in message news:<1b79db20.0309031229.53782b74@posting.google. com>...[color=blue]
> Hello,
>[/color]
<snip>

Just to follow up, I figured out the problem. I just needed to add
"value" to the onclick event. I thought I had tried that before, but
perhaps I mis-typed something. Anyways, I can now link directly from
text or an image button. Thanks for the replies & help!