My IE8 is integrated in the VC++ application, the web application must run in this "integrated IE Browser". The autocomplete function works in a standalone IE8 and FF15 but not in that "integrated IE8". If I input something in the text field, not only the autocomplete don't work, the input text will also be cleared automatically when focus out.
if I set the value forcely like following, gmap autocomplete will work (only) for that input.
<input id="searchTextField" type="text" size="50" value="london" />
So I thought at the beginning that the value just can not be input, however the other autocomplete fields using jQuery autocomplete work just fine. I wonder what could cause this kind of problem?
I solve the problem, the IE can be configured in the VC++ Application
Related
For our web-components library we are using Lit framework, but recently we have discovered the bug that whenever our custom web components are included into the form, they are getting ignored by form reset(). Do you know how to force custom web components to be included into form.reset()?
<form>
<custom-input-field
id="title"
name="title"
value="Check out our library"
></custom-input-field>
<input type="reset">
</form>
You might want to take a look at form-associated custom elements.
This'll allow custom elements to participate in forms and let you implement a formResetCallback() to reset your custom element to its default state on form reset.
As of writing (Aug 2022), form-associated custom elements via ElementInternals are available for Chrome and Firefox, and just got implemented for Safari.
This is happening on an asp.net webforms application, using Chrome Version 72.0.3626.109 (Official Build) (64-bit).
The site is password-protected. The user logs in with a username and password. After a successful login the user is redirected to the "Loan Search" page. The Loan Search page contains a handful of text inputs.
The problem is Chrome will autofill my username into one of the text inputs (see image). "tregan" is the username I entered into the login page.
Chrome always selects this particular text input to autofill the username ("Contact Mailing Address"). This is happening to myself and several dozen other users of our web site.
Any idea why Chrome is doing this autofill, and is there anything I can do to prevent it? I cleared my Chrome autofill cache, but that did not fix the problem.
The answer is to add an invisible text input to the asp.net form called "username".
Several years ago we were having the same problem with a different input. The answer was to add an invisible input of type "password", as explained in this SO answer, scroll down to the phrase "It is so simple and tricky...":
Disabling Chrome Autofill
Below is the complete fix, I added these two elements inside the form element in our site's master page. Per #Jeff_Mergler's comment below, put these inputs at the top of your form tag:
<input type="text" id="username" style="width:0;height:0;visibility:hidden;position:absolute;left:0;top:0" />
<input type="password" style="width:0;height:0;visibility:hidden;position:absolute;left:0;top:0" />
Some more ways to try to workaround this:
Add autocomplete="off" to the <form> and/or to the <input>
Change the field's name/id
to something that does not have "name" or "user" in it
If it is not already inside <form> wrap the element with empty <form> tag
Randomize the name attribute of the input, or use data-name instead of name. You'll have to change the code that process the data accordingly.
Also I think it'll help to report this issue to Google via ⋮→Help→Report an issue (or Alt+Shift+I) to encourage them to fix these issues.
I was facing the same issue, i found a fix by wrapping my div inside a form tag and added a property autocomplete="off" in the form tag.
......
.....
Same here. This needs to be resolved by chrome. This is just dumb to have to add tags around textboxes. Also, quick tip to anyone needing to add form tag without having to re-do your CSS. Add "display:contents;" to the form. It will act as if its not even there.
I notice this as a frequent problem on many wbesites, even those of large corporations, so as a web developer applying for jobs, I think, I should know how to fix this.
Basically, for example, a username field will say "Username" until you click it to type in your username, at which time it should clear itself of the text "Username." But in most cases, it doesn't, and you end up typing in the middle of that pre-existing text.
I've looked this up, and the best solution I found was a 30+ line set of Javascript functions which did exactly what you'd expect: set up a system that clears the default value away when a user clicks on the field, and also puts it back when they click away so long as they hadn't entered anything.
But that's not really what I was looking for, because I already knew how to do that.
I feel like by now, with HTML5 and all, there should be a simpler fix to this. And not just a reduction of the JavaScript to a shorter jQuery script. I mean more of an embedded, inherent fix.
Does anyone know of any ways to stop this phenomenon from happening?
Simply use HTML5 placeholder attribute
<input type="text" placeholder="Whatever" />
Fiddle
Cross Browser Info :
Some Firefox versions clear the placeholder text on click of text box and Chrome clears it after the user starts typing, but later version of Firefox acts like chrome, it clears the placeholder text as the user starts typing in the input box.
You can use the HTML5 placeholder attribute http://www.w3schools.com/html5/att_input_placeholder.asp
Modern browsers now support the placeholder attribute for forms, which let you do just what your asking
Check out
http://webdesignerwall.com/tutorials/cross-browser-html5-placeholder-text
For a article using modenizr for cross browser compatibility
just use the HTML5 placeholder attribute.
<input type="text" placeholder="Username" />
This will obviosuly not be completely cross browser compatible so for that you will still need the old Javascript / jQuery fixes.
Is this possible to achieve without javascript/jQuery?
I currently have a login template with the input fields as:
<input id="username" type="text" name"username" placeholder="username" autofocus>
I was wondering if there was a way when the user clicked their mouse on the field to type the placeholder text would disappear without using javascript if possible? Before this i was just using value and echoing the variables out into the fields but currently experimenting with HTML 5 and CSS3.
Thanks.
New browsers have a native way to do this. And if supported, you don't have to do anything.
With older browsers you do need to use javascript.
Edit: When using new features on old browsers its called Pollyfills. Here is a nice list with a lot of pollyfills that can be used together with Modernizer, that in turn can detect this features.
In an ASP.NET MVC application which is not to have client side objects like ActiveXes, Flash or Java Applets (JavaScript is OK), is it feasible to imagine it being possible that when an upload file dialog box pops up, it will only show the files I specify?
For example, only files of extension .docx or docx and jpg would be visible and selectable on the open-file-like dialog box for selecting a file to upload..
I have read that there is an issue with browser support for this functionality, although it is something that should work with the right settings?
If I could get some examples and some heads up on this, it would be great.
Would the AjaxControlKit be something that would support this functionality?
Thanks,
Ric
You can't filter what files appear in the file upload dialog. This is browser-dependent and no browsers provide this functionality.
However, once the file has been selected, it's value can be checked using JavaScript. You can handle the submit event of a form element and match the file input's value with a regular expression. Here's some untested sample code:
<script type="text/javascript">
function check(event)
{
if (!document.getElementById('file').value.match(/.*\.jpg/))
{
alert('File must have .jpg extension. Please try again.');
return false;
}
return true;
}
</script>
<form action="page.html" onsubmit="check">
<input type="file" name="file" id="file"/>
</form>
The input element supports an accept attribute which is supported by modern browsers like Chrome:
<input id="file" type="file" name="file" size="30"
accept="image/jpg,image/png,image/jpeg,image/gif">
Sadly this is not supported by IE, not even IE9.
Regards,
Martin Cordova
www.martincordova.com
Dinamica - Java EE/Ajax/SQL framework with Eclipse based webapp generators.