Allow Chrome autocompletion but no prompt for certain field - html

I have a form with multiple inputs, one of which is countries. I created my own dropdown box for the list of countries. I am using form_for, and I would like the browser's autocomplete to fill in this field if they select an autocomplete option on a different field in the form, but I do not want it to prompt the user only on this particular input field (as it gets in the way of my dropdown).
<%= form.text_field :country,
id: :sender_address_country,
class: "form-control country-search",
autocomplete: "off" %>
I have tried the :autocomplete and :autofill options I've seen in responses to similar questions in various combinations. :autocomplete works to stop the autocomplete prompt but does not allow the user to autofill if they select an autocomplete option from the first field in the form. Thanks for any assistance!

Something of a work around, but I decided to add a JavaScript effect to the field adding the autocomplete attribute while the field is focused, and it is removed when focus is removed.
$('.country-search').focusout(function () {
$(this).removeAttr('autocomplete');
});
$('.country-search').focusin(function () {
$(this).attr('autocomplete', 'off');
})

Related

WWW::Mechanize: How To Click Button Based On Its Number in Form

There is a button on a website at the end of a form that I cannot seem to click with WWW::Mechanize. Here is the bit of HTML pertaining to this button:
<input type="submit" class="saveButton" value="Login">
When I print $mech->find_all_inputs();, I get return this:
HTML::Form::TextInput=HASH(0x7f8f52cdc450)
HTML::Form::TextInput=HASH(0x7f8f5302b488)
HTML::Form::SubmitInput=HASH(0x7f8f52cdc108)
The third one is the one I want to click. I'm not exactly sure how to click this button even though I've found it. I tried click(field(n => 3)), I tried assigning a variable $submit to find_all_inputs(3), then click($submit);, and no matter what, this button is not clicked.
Can anyone guide me as to how to click this elusive button?
Edit (after question answered)
Interrogating the HTML form found I was actually entering the password for the login into the 'Forgot my Password' field of the form. Why this field was not coming up for $mech->find_all_inputs(), I don't know since "Login" was. Either way, clicking the button takes me to the next page. Thanks!
Since it is the first button in the form, you can write this
$mech->click_button( n => 1 )
or, since it's value attribute is Login, you can do this
$mech->click_button( value => 'Login' )
But since it is the only button in the form, just
$mech->click
should work fine
Did you try to select the appropriate form first, then call click? It says (my emphasis)
Has the effect of clicking a button on the current form.
Find which form on the page you need. Let's say it's form number 2.
# $ua is the User Agent (Mechanize object), at the appropriate page
$ua->form_number(2);
# fill the form ...
my $response = $ua->click();
or
$ua->submit_form(
form_number => 2,
# fields => { name => $value } # can fill it here as well
};
I find click to be perhaps more reliable overall.
To inspect the forms you can use my #forms = $ua->forms. To fill the form you can use select or set_fields, for example. See Form Methods and Field Methods. All this operates with HTML::Form objects so you can use its methods as well. For example, value_names and possible_values are handy.
If this doesn't help please give us more detail -- the web page in question would be ideal.

Disable DropDown in Rails

I want to disable an HTML DropDown in Rails, and I found this solution:
how to disable the entire dropdown control in html
So, I have this:
f.select( ...., :disabled => true)
But, the problem is, when the DropDown is disabled, it does not show in the params collection.
EDIT:
This is my situation:
I have a form with a text_field and a select field. There are two cases:
The user creates a new item directly. If so, she will choose a category from the select field.
The user creates a new item, after redirecting from a category page. In this case, the select field is set to the value of the category, and should be disabled.
Does anyone have any idea how to fix this?
As mentioned in my comment in the original question, disabled form element values won't be present in the params on a form submission. To get around this, try using a hidden field to hold and submit the value you want.
Assuming some variables and whatnot are setup to help decide whether the select field should be disabled:
# ...
f.select(..., :disabled => #category_already_chosen)
f.hidden_field(...) if #category_already_chosen
# ...
Obviously this can be changed to suit your needs, but the basic idea is there. If you've already chosen a category and want the select field to be disabled, make a hidden field. If you haven't chosen a category, omit the hidden field and allow users to make use of the select field.
As shown in the link I posted, this is probably the simplest way to get around this limitation, without resorting to using Javascript to play with parameters after form submission.
I would add query string parameters to your redirect_to call
redirect_to :action => form_path, :category => :whatever_category_they_came_from, :disabled => true
Then in your form
:selected => params[:category], :disabled => params[:disabled]

Html.TextBoxFor ID in two places on the same form

Friends,
I'm working on changes to an existing code base someone else created. They used Razor Html.TextBoxFor in many places. I need to add another textbox using the same model property in a second place on the same form:
#Html.TextBoxFor(model => model.EnrollmentToBatchDataContract.NameKey)
The problem I have is that Razor is rendering the same ID for both instances of this textbox. I need to enable and disable the textbox's independent of each other.
Any insight would be greatly appreciated.
#Html.TextBoxFor(model => model.EnrollmentToBatchDataContract.NameKey, new { #id = "new id" })
The second parameter changes the Html object values. Any property from the Html tag could be put between the braces and changed.
This does not work on EditorForModel if you need to do that aswell, last time I tried.

HTML form doesn't contain a form submit button name when using the Enter key

My ASP.NET MVC 3 website has code on the server side that checks for the name of the submit button clicked to submit the form. The code works when I use the mouse to click the button, but when I use the Enter key, the form gets posted, but the request doesn't contain the name of the submit button.
Is there some attribute I can set on the submit button to get this to work for both clicking and using the Enter key?
Here is my HTML:
<div>Search:</div>
<form action="/Item/Search" method="post">
<input class="fulltextsearch" id="FTSearchText" name="FTSearchText" type="text" value="" />
<input type="submit" value="Go" name="FTSearchButton" />
</form>
</div>
On the server side, I have a custom model binder that uses the following code to determine if the user clicked the submit button.
// See if the value provider has the required prefix
var hasPrefix = bindingContext.ValueProvider.ContainsPrefix(bindingContext.ModelName);
var searchPrefix = (hasPrefix) ? bindingContext.ModelName + "." : string.Empty;
var searchButton = GetValue(bindingContext, searchPrefix, "FTSearchButton");
// If this value doesn't have value, the user didn't click the button so exit
if (string.IsNullOrEmpty(searchButton)) {
return null;
}
private static string GetValue(ModelBindingContext context, string prefix, string key) {
var result = context.ValueProvider.GetValue(prefix + key);
return result == null ? null : result.AttemptedValue;
}
Here is the problem I'm having with this. I have a page that displays a list of items. I have a 'search' textbox and a submit button in an HTML form. When the user enters text in the textbox and clicks the search button or uses the enter key, the page posts the form data via HTML GET, and returns the first eight records found. The page then displays page links for additional pages. The problems is that when the user clicks a page link, the form data is all blank, and my filter information is lost (the form isn't posted with the form value when using these links). So, I end up displaying a blank list of items (blank searches returns zero results) instead of paging the data.
By adding the check for the button name in my form data, I could determine whether or not to simply page the data, or do a new look up.
I wouldn't rely on this. There are plenty of documented bugs with this scenario. Just add a hidden field with name='submit'. That way it wouldn't be too hard to recode the backend.
<input type='hidden' name='submit' value='FTSearchButton'/>
So, I researched this last night and almost got somewhere. Then this morning, I really did get somewhere and here's where I ended up.
Apparently the W3C standards for form submission are pretty lax when describing the functionality as it relates to the Enter button and submitting forms. It seems they determined that
When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to submit the form.
So that leaves a lot of wiggle room for the browser makers. Today, virtually all browsers support using the Enter key to submit a form, whether the form contains one or more single line text input boxes.
The problem I'm having is more or less unique to Internet Explorer, and only when the form contains one, single-line text input control. For whatever reason, Microsoft decided that when Internet Explorer submits a form like this, it doesn't include the submit button's name/value pair in the post body. However, it does include the button's name/value pair if the user clicks the submit button --or-- uses the Enter key, and the form contains more than one single-line text input control.
So, the only solution I can think of or find suggested is to add a second single-line text input to my form, and then set the the style to
visibility: hidden; display: none;
My form now has two single-line text input controls, so the form will post with the name/value pair in the form body, regardless of whether or not the user used the Enter key or clicked the submit button.
So, we have a workaround that was discovered by ASP.NET developers. It seems the key/value pair is required by ASP.NET web-forms to fire the click event, so this work around isn't something new, albeit not my favorite way to do things.

ASP.Net MVC passing a database string to a CheckBox value

This is closely related to a question I posted yesterday regarding CheckBoxes.
Here is my setup:
I have a database directory, with a list of names, among other fields, as my model.
I have a search page where users can search this directory and select a name.
I have a form page that displays the name with a checkbox next to it which allows the user to decide if they want to include the name as a value in the submitted form.
A controller that handles the submitted form.
Goal:
What I would like to know is, how can I get the string value of the name that was selected in the directory to both display in the form page View, and also include this string in the value field of the CheckBox?
You cannot change what the value of a checked check box; check boxes always get posted with "on" as their values if checked, and MVC can use this to automatically map the posted values to booleans. However, if this list of names is dynamic, and each name is unique, you can generate the form with dynamically-named check boxes. Then, in the controller, you can inspect the raw form to see which names were checked. For example, in the view, your code could look something like this:
<form>
<% /* Some loop here */ { %>
<input type="checkbox" name="name_<%= Html.Encode(theName) %>" />
<label><%= Html.Encode(theName) %></label>
<% } %>
</form>
Then, in the controller:
foreach (string name in listOfAvailableNames)
{
if (Request.Form["name_" + name] == "on")
{
// Handle the name being selected
}
else
{
// Handle the name not being selected
}
}