I'm using ember input helper to get some value in the application. The text field should not allow any text to be pasted. (Something like re-enter some value)
I've just tried
{{input value=inputText onpaste="return false"}}
This didn't work. But in normal html, The following works.
<input value=inputText onpaste="return false">
But the problem here is no two-way binding (which supports in ember input helper).
You don't need two way binding:
<input value={{inputText}} oninput={{action (mut inputText) value="target.value"}} onpaste="return false">
Sidenote: Never do this! This can be horrible to accessibility and user experience. It also never really works. You can always have browser plugins disabling this, or in this simple case people pasting by right click.
Related
I have an angular 2 application which contains a basic form with inputs and basic html validation. Something like:
<form (onSubmit)="submit()">
<input type="email" />
<input type="submit" value="save" />
</form>
This worked about a week or two ago. Today, I was testing my application and noticed that it's completely ignoring any basic validation like type, pattern, max, min, etc.
In this case, it should complain when you type in a value without the # symbol. However, it isn't complaining anymore. You can type whatever you want in the input field.
Any idea how this could happen?
I was having this issue too. So I searched and found this.
Basically by default angular is adding something called novalidate.
If you guys want to use browser's native form validation just add ngNativeValidate attribute:
<form ngNativeValidate></form>
I encounter this
choice that looks like type-ahead thing
I know it from what I have type on the same element name before but how do I shut it?
I have my ui-bootstrap to make more dynamic type-ahead but this is always get in the way.
Thanks in advance
It's actually the autocomplete attribute. Set the it to off:
<input [...] autocomplete="off">
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
I am wanting to create a page that can load a property file into a text box, edit the properties, and then save the new properties to the file.
Would this be possible by simply using HTML markup? How do I get the push buttons to correlate with my Grails application?
The HTML seems simple enough:
<p>
Select property file:
<input type="file" name"propertyList" size="50"/>
</p>
<p>
<input type="submit" value="Open File"/>
<input type="submit" value="Save File"/>
</p>
<p>
<input type="text" name="properties" size="300"/>
</p>
I'm not quite sure about the submit button as I don't know a whole lot of HTML.
My goal is to simply locate the property file, use groovy to open it and read it line by line and display it in the text box, then be able to edit the properties and save it.
My biggest question deals with the buttons. How do I have the Open File use the button event (onclick) to activate a function I have written in groovy? Or instead of a submit button, what type of input should I use?
Any information leading me in the right direction would be appreciated
EDIT
Is it correct to do something like the following:
<input type="button" onclick="<g:link action="readFile" controller="propertyRead">Open File</g:link>"/>
If not, what would be the proper way to go about it?
EDIT 2
I looked into actionSubmit and also looked a bit more into g:link and was wondering which way (if either) is the better way to go:
actionSubmit (unsure if it allows one to specify the controller as it wasn't stated in the attributes):
<g:actionSubmit value="Open File" action="readFile" controller="propertyRead"</g:actionSubmit>
Or using a menuButton and g:link
g:link:
<span class="menuButton"><g:link action="readFile" controller="propertyRead">Open File</g:link>
Also forgot to ask, is there a way to get the file path from the input type="file" ?
In order to make full use of Grails functionality, you'll probably want to use the associated HTML tags - form (or uploadForm for a form that's uploading the file) and actionSubmit. Grails doesn't offer a custom file input for reasons which I don't remember, so you'll need to use the <input type="file" ...> as shown in your example.
I'm working on a Rails site, and I've got my database indexed with IndexTank. I have things set up so that to search, all I have to do is browse to [root]/search?q=[query]. To simplify things, I'm planning on just dropping a HTML form with a textbox and a submit button in amongst the erb, but I'm not quite sure how to pass the information from the text box to the end of the /search?q= line.
I'm sure that this is terribly basic, but I've been Googling all morning and I've come up empty-handed.
<form action="/search">
<label>Search term <input name="q"></label>
<input type="submit">
</form>
First off, you'll probably need to post some more code. That said, the solution is likely as simple as setting your form element's method attribute to GET.
Is it possible to prevent a user from typing in a file input text box in IE? The reason I ask is that if a user enters text that does not look like a file system path (eg. doesn't start with something like c:...) then when the user clicks the submit button nothing will happen.
I would either like to not allow the user to type in the box or have the form submit as normal.
I have found that the same question was asked here with no answer:
http://www.webmasterworld.com/html/3290988.htm
And this person came up with a hack which I can use if there is no other suitable answer:
http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom
EDIT: To clarify - if the user types "not a file path" in the text box next to the "Browse" button and clicks submit, in IE nothing will happen. The form will not submit - IE does not allow a form to be submitted when a <input type="file"> box does not have a real file path.
How about this one? You can't type, or right click and paste.
<input type="file" name="file" onKeyDown="this.blur()" onContextMenu="return false;">
This may be a bad idea to begin with. What if the user is not using a Windows OS and wants to upload the file /home/user/example.txt?
This type of check might be better implemented server side.
I solved this with another way using a button rather than a submit and using JavaScript to check the value before submitting.
<input type="file" name="inputFile">
<input type="button" onclick="if(fileHasValidPath()) { submitForm(); }" value="Submit">
function fileHasValidPath() {
if (isIE()) {
var inputFile = document.forms[0].inputFile;
if (inputFile.value != "" && /^(\w:)|(\\)/.test(inputFile.value)) {
alert("File is not a valid file. Please use the Browse button to select a file.");
inputFile.select();
inputFile.focus();
return false;
}
}
return true;
}
function submitForm() {
document.forms[0].submit();
}
I realise there still needs to be server-side validation for the file but this is only to prevent a user clicking on the Submit button and not seeing anything happening. Also, it assumes IE using a Windows OS.
one way is to put a little javascript code in the buttons onsubmit. The idea being to validate the box and either stop submission or allow it.
However, you are probably better off just validating the file contents server side and rendering the appropriate error back to the client.
the input type=file element's value property is readonly as for security issue. You can read this property and do a check. If it is not correspond with your rules, you will give a warn and let person to modify it.
The other way use outerHTML property override it.
for example:
HTML input file element called objInputFileElement.
objInputFileElement.outerHTML="";
Couldn't you use
<input ... disabled>
EDIT:no, actually that prevents submission as well... but in HTML 4 apparently
<input ... readonly>
should work. http://htmlhelp.com/reference/html40/forms/input.html
I found the option that solves your issue. Is the contentEditable option as follows:
<input type="file" name="name" contentEditable="false"/>
Here is a demonstration of the contentEditable option:
<input type="file" name="name" contentEditable="false" />
I based my solution on this thread.
So, considering this file field:
<input type="file" id="file_field">
I got it to work with something like this in jquery:
$(document).ready( function() {
$('#file_field').bind("keydown", function(e) {
e.preventDefault();
});
});
NOTE: You must use keydown instead of keypress as it covers DEL and BACKSPACE as well as any print key.