Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > onclick on <a> causing strange behavior, please help?

Reply
Thread Tools

onclick on <a> causing strange behavior, please help?

 
 
Erland
Guest
Posts: n/a
 
      09-04-2007
Hello All,

I've registered a handler on 's onclick and in this handler I try to
change the style of a textbox. More specifically, I try to change the
border of textbox to "solid black 1px" which is originally set to
"0px". Now part of the problem is that code in handler only occurs for
a 1/10th of a second, that is I see the textbox's border turning into
"solid black 1px" but that just happens for 1/10th of a second and
textbox's border again becomes "0px". I can't figure out why onclick
handler on happens for a flicker and why don't changes that I'm
making in this handler persist. Please pardon my ignorance, I'm just
learning DOM/DHTML and Javascript.

Here is my html
<div class="frame">
FirstName: <input type="text" value="Waqas" class="fname"></input><br>

Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
class with name 'editt-->


<br>
</div>
here is my handler
function editHandler(event)
{
var e=event || window.event;
var node=this.parentNode;
if (node != null)
{
for (var i=node; node.nodeName != "INPUT" ; i
=node.previousSibling)
node=i;

node.focus();
node.value ="Hello there, after edit";
node.style.border="solid black 1px";
this.value='Save';
alert("everything is fine");



return true;
}
else
{
alert("Some error occured");
return false;
}
and here is the css included in my HTML head
function editHandler(event)
{
var e=event || window.event;
var node=this.parentNode;
if (node != null)
{
for (var i=node; node.nodeName != "INPUT" ; i
=node.previousSibling)
node=i;

node.focus();
node.value ="Hello there, after edit";
node.style.border="solid black 1px";
this.value='Save';
alert("everything is fine");



return true;
}
else
{
alert("Some error occured");
return false;
}


I will really appreciate any help

 
Reply With Quote
 
 
 
 
Lee
Guest
Posts: n/a
 
      09-04-2007
Erland said:
>
>Hello All,
>
>I've registered a handler on 's onclick and in this handler I try to
>change the style of a textbox. More specifically, I try to change the
>border of textbox to "solid black 1px" which is originally set to
>"0px". Now part of the problem is that code in handler only occurs for
>a 1/10th of a second, that is I see the textbox's border turning into
>"solid black 1px" but that just happens for 1/10th of a second and
>textbox's border again becomes "0px". I can't figure out why onclick
>handler on happens for a flicker and why don't changes that I'm
>making in this handler persist. Please pardon my ignorance, I'm just
>learning DOM/DHTML and Javascript.
>
> Here is my html
><div class="frame">
>FirstName: <input type="text" value="Waqas" class="fname"></input><br>
>
>Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
>class with name 'editt-->
>
>
><br>
></div>


I don't see any anchor. My first guess is that the anchor is
behaving as designed, and causing a page load of one form or
another. If what you're seeing is a flicker, then it's most
likely reloading the same page.


--

 
Reply With Quote
 
 
 
 
Erland
Guest
Posts: n/a
 
      09-05-2007
On Sep 4, 11:43 pm, Lee <(E-Mail Removed)> wrote:
> Erland said:
>
>
>
>
>
> >Hello All,

>
> >I've registered a handler on 's onclick and in this handler I try to
> >change the style of a textbox. More specifically, I try to change the
> >border of textbox to "solid black 1px" which is originally set to
> >"0px". Now part of the problem is that code in handler only occurs for
> >a 1/10th of a second, that is I see the textbox's border turning into
> >"solid black 1px" but that just happens for 1/10th of a second and
> >textbox's border again becomes "0px". I can't figure out why onclick
> >handler on happens for a flicker and why don't changes that I'm
> >making in this handler persist. Please pardon my ignorance, I'm just
> >learning DOM/DHTML and Javascript.

>
> > Here is my html
> ><div class="frame">
> >FirstName: <input type="text" value="Waqas" class="fname"></input><br>

>
> >Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
> >class with name 'editt-->

>
> ><br>
> ></div>

>
> I don't see any anchor. My first guess is that the anchor is
> behaving as designed, and causing a page load of one form or
> another. If what you're seeing is a flicker, then it's most
> likely reloading the same page.
>


Lee,

Thank you for the reply. I guess you are rigght, it is causing some
sort of page re-load. How can I prevent that? Please enlighten me.

Thanks,
Erland


 
Reply With Quote
 
Aaron Saray
Guest
Posts: n/a
 
      09-05-2007
On Sep 4, 8:37 pm, Erland <(E-Mail Removed)> wrote:
> On Sep 4, 11:43 pm, Lee <(E-Mail Removed)> wrote:
>
>
>
> > Erland said:

>
> > >Hello All,

>
> > >I've registered a handler on 's onclick and in this handler I try to
> > >change the style of a textbox. More specifically, I try to change the
> > >border of textbox to "solid black 1px" which is originally set to
> > >"0px". Now part of the problem is that code in handler only occurs for
> > >a 1/10th of a second, that is I see the textbox's border turning into
> > >"solid black 1px" but that just happens for 1/10th of a second and
> > >textbox's border again becomes "0px". I can't figure out why onclick
> > >handler on happens for a flicker and why don't changes that I'm
> > >making in this handler persist. Please pardon my ignorance, I'm just
> > >learning DOM/DHTML and Javascript.

>
> > > Here is my html
> > ><div class="frame">
> > >FirstName: <input type="text" value="Waqas" class="fname"></input><br>

>
> > >Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
> > >class with name 'editt-->

>
> > ><br>
> > ></div>

>
> > I don't see any anchor. My first guess is that the anchor is
> > behaving as designed, and causing a page load of one form or
> > another. If what you're seeing is a flicker, then it's most
> > likely reloading the same page.

>
> Lee,
>
> Thank you for the reply. I guess you are rigght, it is causing some
> sort of page re-load. How can I prevent that? Please enlighten me.
>
> Thanks,
> Erland


You should be able to return false - this will stop the tag from
executing.

 
Reply With Quote
 
Matthew White
Guest
Posts: n/a
 
      09-05-2007
"Aaron Saray" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed) ups.com...
> On Sep 4, 8:37 pm, Erland <(E-Mail Removed)> wrote:
>> On Sep 4, 11:43 pm, Lee <(E-Mail Removed)> wrote:
>>
>>
>>
>> > Erland said:

>>
>> > >Hello All,

>>
>> > >I've registered a handler on 's onclick and in this handler I try to
>> > >change the style of a textbox. More specifically, I try to change the
>> > >border of textbox to "solid black 1px" which is originally set to
>> > >"0px". Now part of the problem is that code in handler only occurs for
>> > >a 1/10th of a second, that is I see the textbox's border turning into
>> > >"solid black 1px" but that just happens for 1/10th of a second and
>> > >textbox's border again becomes "0px". I can't figure out why onclick
>> > >handler on happens for a flicker and why don't changes that I'm
>> > >making in this handler persist. Please pardon my ignorance, I'm just
>> > >learning DOM/DHTML and Javascript.

>>
>> > > Here is my html
>> > ><div class="frame">
>> > >FirstName: <input type="text" value="Waqas" class="fname"></input><br>

>>
>> > >Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
>> > >class with name 'editt-->

>>
>> > ><br>
>> > ></div>

>>
>> > I don't see any anchor. My first guess is that the anchor is
>> > behaving as designed, and causing a page load of one form or
>> > another. If what you're seeing is a flicker, then it's most
>> > likely reloading the same page.

>>
>> Lee,
>>
>> Thank you for the reply. I guess you are rigght, it is causing some
>> sort of page re-load. How can I prevent that? Please enlighten me.
>>
>> Thanks,
>> Erland

>
> You should be able to return false - this will stop the tag from
> executing.
>


Try using < a href="#" onclick="functionname;" class="edit" > . The # is a
legal link address that does absolutely nothing. This should fix your
problem.

Matt

 
Reply With Quote
 
Lee
Guest
Posts: n/a
 
      09-06-2007
Matthew White said:
>
>"Aaron Saray" <(E-Mail Removed)> wrote in message
>news:(E-Mail Removed) oups.com...
>> On Sep 4, 8:37 pm, Erland <(E-Mail Removed)> wrote:
>>> On Sep 4, 11:43 pm, Lee <(E-Mail Removed)> wrote:
>>>
>>>
>>>
>>> > Erland said:
>>>
>>> > >Hello All,
>>>
>>> > >I've registered a handler on 's onclick and in this handler I try to
>>> > >change the style of a textbox. More specifically, I try to change the
>>> > >border of textbox to "solid black 1px" which is originally set to
>>> > >"0px". Now part of the problem is that code in handler only occurs for
>>> > >a 1/10th of a second, that is I see the textbox's border turning into
>>> > >"solid black 1px" but that just happens for 1/10th of a second and
>>> > >textbox's border again becomes "0px". I can't figure out why onclick
>>> > >handler on happens for a flicker and why don't changes that I'm
>>> > >making in this handler persist. Please pardon my ignorance, I'm just
>>> > >learning DOM/DHTML and Javascript.
>>>
>>> > > Here is my html
>>> > ><div class="frame">
>>> > >FirstName: <input type="text" value="Waqas" class="fname"></input><br>
>>>
>>> > >Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
>>> > >class with name 'editt-->
>>>
>>> > ><br>
>>> > ></div>
>>>
>>> > I don't see any anchor. My first guess is that the anchor is
>>> > behaving as designed, and causing a page load of one form or
>>> > another. If what you're seeing is a flicker, then it's most
>>> > likely reloading the same page.
>>>
>>> Lee,
>>>
>>> Thank you for the reply. I guess you are rigght, it is causing some
>>> sort of page re-load. How can I prevent that? Please enlighten me.
>>>
>>> Thanks,
>>> Erland

>>
>> You should be able to return false - this will stop the tag from
>> executing.
>>

>
>Try using < a href="#" onclick="functionname;" class="edit" > . The # is a
>legal link address that does absolutely nothing. This should fix your
>problem.


It really does not do "absolutely nothing". It's an anchor link to
the top of the current page. That means that it may reposition the
page within the browser or may even reload it. Browser's choice.

The best solution is to not use an anchor tag if you don't want
to go anyplace. Just add an onclick handler to some other tag.
If you insist on using an anchor, the onclick handler should
return false to prevent the link from continuing.


--

 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      09-06-2007
Matthew White wrote:
> "Aaron Saray" [...] wrote [...]:
>> On Sep 4, 8:37 pm, Erland <(E-Mail Removed)> wrote:
>>> On Sep 4, 11:43 pm, Lee <(E-Mail Removed)> wrote:
>>>> Erland said:
>>>>> [Using onclick in an anchor causes styled textbox to flicker]
>>>>> Here is my html
>>>>> <div class="frame">
>>>>> FirstName: <input type="text" value="Waqas" class="fname"></input><br>
>>>>> Edit <!--This is my anchor tag, HTML viewing might skim it, it has a
>>>>> class with name 'editt-->
>>>>> <br>
>>>>> </div>
>>>> I don't see any anchor. My first guess is that the anchor is
>>>> behaving as designed, and causing a page load of one form or
>>>> another. If what you're seeing is a flicker, then it's most
>>>> likely reloading the same page.
>>> [...]
>>> Thank you for the reply. I guess you are rigght, it is causing some
>>> sort of page re-load. How can I prevent that? Please enlighten me.
>>> [...]

>> You should be able to return false - this will stop the tag from
>> executing.

>
> Try using < a href="#" onclick="functionname;" class="edit" > . The # is a
> legal link address that does absolutely nothing. This should fix your
> problem.


And introduce at least one other. Please read the FAQ before you post.


PointedEars
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Pages creating onclick="return TABLE1_onclick()" causing javascript errors Dennis ASP .Net 2 12-06-2006 06:46 AM
Overriding an onclick with another onclick tomlong@gmail.com Javascript 4 01-26-2006 09:26 PM
button.onclick = new Function("func2()") + button.onclick foldface@yahoo.co.uk Javascript 2 09-26-2005 08:13 AM
document.onclick=doIt() same as document.onclick=doIt ? bob Javascript 3 08-21-2003 12:14 PM
RS causing strange error Bill ASP General 1 07-29-2003 02:07 AM



Advertisments