Hi I was trying to make a textfield dynamic. This is my code
<input type="text" id="test1" value ="dynamic" onfocus="this.disabled=true" onblur="this.disabled=false">
<input type="text" id="test2">
so fields get disabled perfectly but doesnt get enabled on blur. If any one here can solve my problem that would be great.
Perhaps in this situation it is better to make the field readonly and add some custom class to make it look like it is disabled.
Since disabled element are well... disabled :)
EDIT
I've done some testing and it gets enabled again on blur!
http://jsfiddle.net/dfhHz/
You still need to click outside the input to trigger the blur ofcourse
EDIT2
WHat would you like to achieve. Since this functionality looks a bit strange (disable on focus and enable on blur) to me :)
Why don't you use onmouseover and onmouseout events on your text field instead ?
<input type="text" id="test1" value="dynamic" onmouseover="this.disabled=true" onmouseout="this.disabled=false">
Related
Situation 1
Why is the placeholder selectable in a deactivated input[type="text"]?
<input name="minMax2" disabled="disabled" id="minMax2" type="text"
placeholder="min. 100 / max. 200" min="100" max="200">
Situation 2
I've even have a weird situation where I can type text into the placeholder but this does happens if I click into a text field which is deactivated but because I've left another field and an attached change event did enable the datepicker.
Any idea? Did I miss something or is this a bug of Internet Explorer 10 and 11?
Looks like this is a browser behavior. As an alternative you can keep it enabled (style it appropriately as disabled if needed) and add attribute onfocus="this.blur()"
Here's your demo modified: http://jsfiddle.net/a8ezd/1/
I made a few changes to your jsfiddle from what I understand to be your problem. In your jsfiddle you included jQuery so I thought I would add to your script. I have just changed how you have declared disabled in your input and also made a change to your script so that it now removes the disabled attribute on focus.
$('#test3').prop("disabled", false).focus();
http://jsfiddle.net/a8ezd/3/
If you want to go further and make it so that the user can't even select the placeholder slightly when it's e.g. disabled then you could alter the user select in the css by adding the following with the appropriate browser prefix:
user-select:none;
Example of that here:
http://jsfiddle.net/a8ezd/4/
I have a form which calculates a cost and sets the value of an input accordingly. For obvious reasons, I have used:
$('#totalcost').attr('disabled',true);
to prevent the user from being able to edit the cost.
However, when I do this, the PHP script I'm using to mail the form doesn't pick up the input (not just the value - it doesn't read the input at all). When the input is enabled, it works fine.
How can I prevent the user from editing the input while still having the PHP mailing the value? Or is there a better way to do this anyway?
Make it readonly, not disabled:
$("#totalcost").attr('readonly', true);
You could also do it in the original HTML, since it's not something you really want to change back and forth dynamically.
<input id="totalcost" type="text" readonly>
Use Read Only property, Though i guess it wont work in internet exploer.
Add readonly attribute, like this:
$("#totalcost").attr('readonly', true);
Add property readonly="true".
$('#totalcost').attr('readonly',true);
you can try:
$("#totalcost").prop("readonly",true);
Use read only in html itself or in script
<input type="text" name="totalcost" id="totalcost" value="" readonly>
$('#totalcost').attr("readonly", true);
If I am using a submit button as so..
<input type="image" name="submit" src="image.png" disabled="disabled" />
Is there any way I can trigger a Javascript alert when someone clicks this button? I have tried using onclick() but it doesn't work unless I take away the disabled="disabled".
No, the disabled setting also disables events.
If you need behavior to remain, then instead of disabling it, you should just keep it enabled, and enforce the behavior you want based on some flag added to the element, like a class or some other property on the element.
I have had this problem for a long time and I just can't figure out how to fix it. I want to create a simple WYSYWYG editor and I have some problems.
Currently I have this:
<div id="editor" contenteditable="true"></div>
<input type="button" value="B"
onmousedown="document.execCommand('bold',false,null); return false;"/>
So, if I have some text inside my DIV, select it and click on "B" it is converted to BOLD, and remains selected, but this doesn't work on Opera and IE.
I just don't know how to make the editable DIV not only keep the focus but also the text selection.
Any idea?
Two possible options are:
Use mousedown instead of click and prevent the default browser action: http://jsfiddle.net/dA9NK/
Make the button unselectable: http://jsfiddle.net/8hpvv/
I have a form box that I want to be always selected. I was able to get it to select everything in the box when it is clicked (using onFocus="this.select()") but I want it to be selected 100% of the time. The text in the box will be always changing, so I tried using onChange="this.select()" but that didn't work. Here's what I have:
<form>
<input type="text" id="txt1" size="30" maxlength="1"
onkeyup="showHint(this.value)" onFocus="this.select()" onBlur="this.select()"
onChange="this.select()" value="Click here, then press a key"/>
</form>
Basically I just tried to call everything in hopes that something would work, but it is still acting as if only onFocus="this.select()" is there. By the way, this is for controlling something via keyboard, which is why the maxlength is only 1. I want it to be always selected so that when new key are pressed, the last command will be changed without having to use backspace.
Is there a reason you aren't just using document keystroke detection? If you need the value to appear in the input field for some reason, once you detect the keystroke, you could fill the text box. This would be much simpler than trying to maintain focus on the field itself.