Вышеприведенные решения великолепны, но если пользователь, естественно, просто нажимает рядом с величиной-заполнителем, внутри поля ввода, намереваясь сохранить и продолжить его, он станет полностью стертым.
Так на основе решения выше, я сделал для меня следующее решение:
HTML:
<input id="other" list="values" value="<?php echo $val; ?>">
<datalist id="values">
<option value="orange">
<option value="banana">
</datalist>
JS:
jQuery(document).ready(function ($) {
function putValueBackFromPlaceholder() {
var $this = $('#other');
if ($this.val() === '') {
$this.val($this.attr('placeholder'));
$this.attr('placeholder','');
}
}
$('#other')
.on('click', function(e) {
var $this = $(this);
var inpLeft = $this.offset().left;
var inpWidth = $this.width();
var clickedLeft = e.clientX;
var clickedInInpLeft = clickedLeft - inpLeft;
var arrowBtnWidth = 12;
if ((inpWidth - clickedInInpLeft) < arrowBtnWidth ) {
$this.attr('placeholder',$this.val());
$this.val('');
}
else {
putValueBackFromPlaceholder();
}
})
.on('mouseleave', putValueBackFromPlaceholder);
});
Для меня много ввода коробки на странице, и я хочу, чтобы у этого было такое поведение, поэтому я работаю с id и имею его «личным». Если вы хотите изменить его на более общую функцию, вам придется привязать putValueBackFromPlaceholder
к элементу, по которому произошел щелчок, и самому событию.
Вы хотите DBNull.Value.
В моем общем коде DAL, я использую вспомогательный метод, который просто делает:
foreach (IDataParameter param in cmd.Parameters)
{
if (param.Value == null) param.Value = DBNull.Value;
}