У меня проблема, которая появляется во всех браузерах.
Я работаю с ASP.NET MVC.
Мой контроллер отображает html-форму с различными кнопками отправки (причина этого объясняется в Приложении ниже).
В то время как табуляция направляет фокус на правильную кнопку отправки при правильных обстоятельствах, нажатие Enter, похоже, отправляет форму с использованием неправильной кнопки. Я могу определить, какая кнопка отправила форму, используя коллекцию HttpContext.Request.Params следующим образом:
foreach (var step in WizardSteps)
{
// A naming convention links the step action to the button name.
// If returns null, then it was a Next or Previous button
string s = step.Value.ActionName;
if (ControllerContext.HttpContext.Request.Params[s + "Button"] != null)
{
return s;
}
}
return null;
[Я разрабатываю платформу мастера в ASP.NET MVC, отсюда и коллекция WizardSteps. См. Приложение]
РЕЗЮМЕ:
Проблема в том, что, если пользователь просто нажимает клавишу ввода из последнего элемента управления вводом, форма отправляется с использованием НЕПРАВИЛЬНОЙ кнопки вместо использования кнопки отправки, которая следует в визуализированном html (то есть, кнопка «ДАЛЕЕ >>»). Нажатие клавиши Tab отправляет фокус на нужный элемент управления.
Наверняка при нажатии клавиши TAB и клавиши Enter фокус перемещается в одно и то же место?
Вы думаете, что происходит? Табуляция происходит в правильном порядке, так что проблема не в этом.
ПОЖАЛУЙСТА, ОБРАТИТЕ ВНИМАНИЕ: так как это проблема HTML, бесполезно пытаться решить ее с помощью jQuery.
ДОБАВЛЕНИЕ:
Я разрабатываю платформу мастера для ASP.NET MVC. Мне нужно много мастеров, так что стоит приложить дополнительные усилия. У меня есть базовый контроллер, который достаточно умен, чтобы выяснить, какие шаги есть и в каком порядке (он создает WizardSteps, используя атрибуты и отражение). Все работает, но ...
Была решена предыдущая проблема (только один элемент управления вводом текста вызывает ошибку в IE). Но теперь это меня озадачило: любой фреймворк должен обеспечивать стандартное поведение.
Это проблемы с HTML, поэтому, пожалуйста, без jQuery.
ИСХОДНЫЙ КОД ФОРМЫ:
<div id="wizardStep">
<form action="/Membership/Form" id="wizardForm" method="post" name="wizardForm" onclick="Sys.Mvc.AsyncForm.handleClick(this, new Sys.UI.DomEvent(event));"
onsubmit="Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.InsertionMode.replace, updateTargetId: 'wizardStep' });">
<input name="wizardData" type="hidden" value="EncryptedFormValuesGobbleDeGooke" />
<div class="WizardNavigator">
<input type="submit" class="Before" name="StartButton" id="StartButton" value="Start" />
<input type="submit" class="Before" name="CategoryButton" id="CategoryButton" value="Category" />
<input type="button" class="Current" name="ContactDetailsButton" id="ContactDetailsButton" value="Contact Details" />
<input type="button" class="After" name="IllnessDetailsButton" id="IllnessDetailsButton" value="Illness Details" />
<input type="button" class="After" name="LinkUpButton" id="LinkUpButton" value="Link Up" />
<input type="button" class="After" name="ConfirmButton" id="ConfirmButton" value="Confirm" />
<input type="button" class="After" name="CompleteButton" id="CompleteButton" value="Done!" />
</div>
<div class="WizardButtons">
<input class="Start" type="submit" value="Start >>" title="Start >>" name="topNextButton"
id="topNextButton" />
</div>
<p>
Please enter the details of the person to whom newsletter and other information
should be sent;</p>
<fieldset>
<legend>Name</legend>
<div class="editor-label">
<label for="Title">
Title</label>
</div>
<div class="editor-field">
<input id="Title" name="Title" type="text" value="" />
</div>
<div class="editor-label">
<label for="FirstName">
First Name</label>
</div>
<div class="editor-field">
<input id="FirstName" name="FirstName" type="text" value="" />
</div>
<div class="editor-label">
<label for="LastName">
Last Name</label>
</div>
<div class="editor-field">
<input id="LastName" name="LastName" type="text" value="" />
</div>
</fieldset>
<fieldset>
<legend>Postal Address</legend>
<div class="editor-label">
<label for="Address">
Address</label>
</div>
<div class="editor-field">
<textarea cols="40" id="Address" name="Address" rows="10"></textarea>
</div>
<div class="editor-label">
<label for="Postcode">
Postcode</label>
</div>
<div class="editor-field">
<input id="Postcode" name="Postcode" type="text" value="" />
</div>
</fieldset>
<fieldset>
<legend>Comm Details</legend>
<div class="editor-label">
<label for="Email">
Email</label>
</div>
<div class="editor-field">
<input id="Email" name="Email" type="text" value="" />
</div>
<div class="editor-label">
<label for="Telephone">
Telephone</label>
</div>
<div class="editor-field">
<input id="Telephone" name="Telephone" type="text" value="" />
</div>
</fieldset>
<div class="WizardButtons">
<input class="Start" type="submit" value="Start >>" title="Start >>" name="NextButton"
id="NextButton" />
</div>
</form>
</div>
Проблема в том, что при нажатии клавиши Enter, когда пользователь находится в режиме ввода текста по телефону, форма отправляется так, как если бы была нажата кнопка отправки StartButton.
Это неправильно, и я не вижу никаких проблем с html, которые могли бы вызвать это. Правильное нажатие клавиши табуляции отправляет фокус на кнопку отправки NextButton.