href and onClick.............

[soyo]

I have a web page which has two frames. top frame has an image(img1)
for decreasing order
on click of this image it should:
--it should put the records in the bottom frame in descending order
--Change the image in the top frame to an img2(ie., for incresaing
order)

Now on clicking this image(img2) it should also do two things:
--it should order the records in the below frame to increasing order.
--Change the image in the top frame to img1(for decreasing order)

the code I wrote for this is as below:

<a id="check" href="javascript:script1();"><img src='/images/img1.gif'
name="dsort" onClick="dsort.src='/images/img2.gif';" border="0"></a>"

the required javascript is:

function script1()
{
mainframes['bodyFrame'].actualframes['mainbody'].location =
"/Customers/Order.html?sort=Y&Column=Amount&sortOrder=descending";
}

the way it works is:
when I click on "img1" immediately the "img1" gets swapped with "img2"
and then when the page completely loads it again loads the previous
image ie., "img1" and puts the records in the descending order ie.,in
the order I wanted.

What I want the functionality to be:
OnClick of "img1" it should change the image to "img2"
and the bottom frame should have the ordered records and as opposed to
how its working now the image should not change to the original image.

can someone show me what's the mistake i'm doing
any help would be greatly appreciated

 

[Matt Kruse]

<a id="check" href="javascript:script1();"><img src='/images/img1.gif'
name="dsort" onClick="dsort.src='/images/img2.gif';" border="0"></a>"

You should be using the onClick handler of the <a> tag, and never use the
javascript: "pesudo-protocol" in the href.
See http://www.JavascriptToolbox.com/bestpractices/ for details about this
very topic.