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

Question

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.

Answer 1

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'/>

Answer 2

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.