отправьте форму через Ajax с помощью прототипа и обновите отделение результата
Вместо того, чтобы вставлять блок во вход, почему бы не иметь особый стиль ввода для этих сценариев, где вы можете добавить или добавить любой блок. Что-то вроде:
.unit-input {
border: #DFDFDF solid 1px;
display: inline-flex;
border-radius: 4px;
overflow: hidden;
font-family: sans-serif;
width: 10em;
}
.unit-input__input {
border: 0;
padding: .5em;
font-size: 1em;
width: 100%;
}
.unit-input__input:focus {
background: #EDFFFB;
outline: none;
}
.unit-input__prepend,
.unit-input__append {
background: #F4F4F4;
padding: .5em;
border: #DFDFDF solid 0;
flex-grow: 0;
}
.unit-input__prepend {
border-right-width: 1px;
}
.unit-input__append {
border-left-width: 1px;
}<p>
<span class="unit-input">
<input class="unit-input__input" type="number">
<span class="unit-input__append">days</span>
</span>
</p>
<p>
<span class="unit-input">
<span class="unit-input__prepend">[111]lt;/span>
<input class="unit-input__input" type="number">
</span>
</p>
<p>
<span class="unit-input">
<input class="unit-input__input" type="number">
<span class="unit-input__append">kg</span>
</span>
</p>4 ответа
Опытные страницы API выезда на Form.Request и Event обработка.
В основном, если у Вас есть это:
<form id='myForm'>
.... fields ....
<input type='submit' value='Go'>
</form>
<div id='result'></div>
Ваш js был бы, более или менее:
Event.observe('myForm', 'submit', function(event) {
$('myForm').request({
onFailure: function() { .... },
onSuccess: function(t) {
$('result').update(t.responseText);
}
});
Event.stop(event); // stop the form from submitting
});
Сначала необходимо сериализировать форму, затем позвонить Ajax Updater, с помощью опций POST и передать ее сериализированные данные формы. Результат затем появится в элементе Вы sepcified.
Необходимо возвратить false значения от функции ajax, которая блокируется, стандартная форма отправляют.
<form id="myForm" onsubmit="return myfunc()" action="/getResults">
function myfunc(){
... do prototype ajax stuff...
return false;
}
Используя onsubmit на форме также получает пользователей, которые отправляют с клавишей Enter.
Необходимо остановить действие по умолчанию onsubmit событие.
Например:
function submit_handler(e){
Event.stop(e)
}
Больше информации об остановке поведения стандартного события в Прототипе»