onclick Javascript Problem

[Jim Bond]

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.d ocument.mapAppl et.getMap();

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


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


//change map extent
map.setExtent(e xt, null);

//force repaint
map.updateMap() ;

}

The HTML for the drop down box looks like this:

<select name="theme" size=1 onChange="setEx tent(this)">
<option value="10350350 ,3380230,105820 00,3531280">Loc ation</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!

[Vjekoslav Begovic]

Re: onclick Javascript Problem

"Jim Bond" <mailing_list_9 999@yahoo.com> wrote in message
news:1b79db20.0 309031229.53782 b74@posting.goo gle.com...[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.d ocument.mapAppl et.getMap();
>
> //get FloatRectangle object
> var ext = map.getExtent() ;
>
>
> //set Extent boound
> ext.setBounds(x 1,y1,x2,y2);
>
>
> //change map extent
> map.setExtent(e xt, null);
>
> //force repaint
> map.updateMap() ;
>
> }
>
> The HTML for the drop down box looks like this:
>
> <select name="theme" size=1 onChange="setEx tent(this)">
> <option value="10350350 ,3380230,105820 00,3531280">Loc ation</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="setExt ent(document.ge tElementById('t heme'))">Go!</button>

[Nobody]

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="setExt ent(document.ge tElementById('t heme'))">Go!</button>
|
|

[Jim Bond]

Re: onclick Javascript Problem

"Vjekoslav Begovic" <vjbegovic@inet .hr> wrote in message news:<bj5m7a$sd 4$1@sunce.iskon .hr>...[color=blue]
> "Jim Bond" <mailing_list_9 999@yahoo.com> wrote in message
> news:1b79db20.0 309031229.53782 b74@posting.goo gle.com...[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.d ocument.mapAppl et.getMap();
> >
> > //get FloatRectangle object
> > var ext = map.getExtent() ;
> >
> >
> > //set Extent boound
> > ext.setBounds(x 1,y1,x2,y2);
> >
> >
> > //change map extent
> > map.setExtent(e xt, null);
> >
> > //force repaint
> > map.updateMap() ;
> >
> > }
> >
> > The HTML for the drop down box looks like this:
> >
> > <select name="theme" size=1 onChange="setEx tent(this)">
> > <option value="10350350 ,3380230,105820 00,3531280">Loc ation</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="setExt ent(document.ge tElementById('t heme'))">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.

[Vjekoslav Begovic]

Re: onclick Javascript Problem

"Jim Bond" <mailing_list_9 999@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.argu ments.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="setExt ent(null,
'10350350,33802 30,10582000,353 1280')">Test</button>


IE6 tested.


Regards

Vjekoslav

[Jim Bond]

Re: onclick Javascript Problem

mailing_list_99 99@yahoo.com (Jim Bond) wrote in message news:<1b79db20. 0309031229.5378 2b74@posting.go ogle.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!