Disable drag in ie & FF

S

surf_doggie

Im not sure if this is the group to post in, if anyone knows a more
appropriate one please let me know.

Please consider the following example of a feature most all browsers
have that I would like to either disable or find a work around for.

Background:
I have a form that has 3 input type="text" fields. The fields are
Quantity, Amount and total. OnKeyUp is used when you enter something in
Quantity or Amount to trigger a javaScript function that makes a
calculation and updates the total field.

The total field is "locked" with onFocus=this.blur so that the totals
cannot be entered by the end user. I did not use disable because when
the form is submitted I had problems with asp form collection of
disabled form elements.

Issue:
1. If you highlight the number you entered for Amount in the form field
then left click and drag it will (copy/cut depending on browser and
version) the Amount field into the "locked" total field.

2. If you click drag as described above the Amount into the next Amount
field the total will not be calculated because a key event was not used
to move the data thus the javaScript function to do the calculation was
not fired.

The client "must have" the calculations being done real time so the
people entering the time can see the total entered.

Any ideas on working around this would be greatly appreciated.

Earl
 
P

pcx99

surf_doggie said:
Issue:
1. If you highlight the number you entered for Amount in the form field
then left click and drag it will (copy/cut depending on browser and
version) the Amount field into the "locked" total field.

2. If you click drag as described above the Amount into the next Amount
field the total will not be calculated because a key event was not used
to move the data thus the javaScript function to do the calculation was
not fired.

The client "must have" the calculations being done real time so the
people entering the time can see the total entered.


If you absolutely have to have a total field for your submit form,
consider making it hidden. Next use a <div id=someID> or <span
id=someID> to hold your totals, then when you calculate your totals,
after you update the value in your hidden field just do
document.getElementById("someID").innerHTML = newtotal;

This eliminates the problem by preventing total from being an input
field and making it a part of the web page itself.
 
S

surf_doggie

Client wants the people to be able to see the totals before they submit
so hidden total is not an option, if it were I wouldnt calculate with
JS would do it server side. Its a good idea and I would do it but its
not an option in this situation.
 
P

pcx99

surf_doggie said:
Client wants the people to be able to see the totals before they submit
so hidden total is not an option, if it were I wouldnt calculate with
JS would do it server side. Its a good idea and I would do it but its
not an option in this situation.

As I said. Make the total input field hidden but create a <div> or
<span> on the web page and use DHTML to insert the new total directly
into the web page. This prevents the total from being a visible
textbox and makes the total a part of the web page itself just like any
other text.
 
S

surf_doggie

pcx99 said:
As I said. Make the total input field hidden but create a <div> or
<span> on the web page and use DHTML to insert the new total directly
into the web page. This prevents the total from being a visible
textbox and makes the total a part of the web page itself just like any
other text.

I see said the blind man. I will test that out but what about the
function not firing when you use the copy feature mentioned above to
move one amount to another amount field?
 
S

surf_doggie

surf_doggie said:
I see said the blind man. I will test that out but what about the
function not firing when you use the copy feature mentioned above to
move one amount to another amount field?

Never mind testing all the fields this way. Will repost shortly
 
A

Ari Krupnik

surf_doggie said:
I have a form that has 3 input type="text" fields. The fields are
Quantity, Amount and total. OnKeyUp is used when you enter something in
Quantity or Amount to trigger a javaScript function that makes a
calculation and updates the total field.

The total field is "locked" with onFocus=this.blur so that the totals
cannot be entered by the end user. I did not use disable because when
the form is submitted I had problems with asp form collection of
disabled form elements.

What is the oldest browser you're trying to support? You can simply
disable an input control with disabled="disabled" in the HTML or with
control.disabled=true in JS. Also, as pcx suggested, why not use a div
to display the result of your calculation?
Issue:
1. If you highlight the number you entered for Amount in the form field
then left click and drag it will (copy/cut depending on browser and
version) the Amount field into the "locked" total field.

You can disable drag and drop in IE by handling two non-standard
events, ondragover and ondrop. In FF, to the best of my knowledge, you
can't override default DnD behaviors unless you use XUL to describe at
least part of your document.

In any case, I have a feeling that you don't need to deal with DnD as
such, just as long as the element you use to display your results is
not an input or is disabled.
2. If you click drag as described above the Amount into the next Amount
field the total will not be calculated because a key event was not used
to move the data thus the javaScript function to do the calculation was
not fired.

Are you using onkeyup? Try onchange.

Ari.
 
S

surf_doggie

Ari said:
What is the oldest browser you're trying to support? You can simply
disable an input control with disabled="disabled" in the HTML or with
control.disabled=true in JS. Also, as pcx suggested, why not use a div
to display the result of your calculation?


You can disable drag and drop in IE by handling two non-standard
events, ondragover and ondrop. In FF, to the best of my knowledge, you
can't override default DnD behaviors unless you use XUL to describe at
least part of your document.

In any case, I have a feeling that you don't need to deal with DnD as
such, just as long as the element you use to display your results is
not an input or is disabled.


Are you using onkeyup? Try onchange.

Ari.

I tried the onchange but when dragging from an amount field to an
amount field it does not fire the function
 
S

surf_doggie

Figured it out

<input name="expQuant0" type="text" size="2" value="1"
onKeyUp="calc_Exp(this.name,this.value,event);"
onFocus="clearbox(this.name,this.value);"
onBlur="setbox(this.name,this.value,'exp');" ondragstart="return
false;" >

Key is to add ondragstart="return false;" that you dont want dragable.

Thanks,
Earl
 
A

ASM

surf_doggie a écrit :
what about the
function not firing when you use the copy feature mentioned above to
move one amount to another amount field?


Quantity : <input onchange="calculate()" blah />

or if you think it's better :

<input onkeyup="calculate()" onchange="calculate()" blah />
or
<input onkeyup="calculate()" onmouseup="calculate()" blah />
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top