Как расположить жидкое/эластичное текстовое поле рядом с кнопкой?
Новый экземпляр FacesContext создается с каждым новым запросом. Основная задача FacesContext - предоставить всю информацию, касающуюся конкретного запроса, с которым он связан. Например: чтобы добавить сообщения после определенного сбоя проверки или преобразования, вы можете просто добавить сообщение в FacesContext, который в конечном итоге отобразит желаемое сообщение на экране. Также вы можете посмотреть и даже остановить жизненный цикл JSF в любой момент, позвонив по телефону
FacesContext.responseComplete();
3 ответа
Мне удалось заставить это работать в таблице (я знаю, но это работает), где он правильно обрабатывал бы изменение размера страницы, а также изменение значения кнопки:
<table class="elastic">
<tr>
<td><input class="textbox" type="text"></td>
<td class="button"><input type="button" value="Test Button"></td>
</tr>
</table>
Там может быть альтернативой
РЕДАКТИРОВАТЬ: Я переделал свой пример, чтобы использовать следующую таблицу стилей:
.elastic { width:100%; }
.elastic .textbox { width: 100%; }
.elastic .button { width: 1%; }
Трудно дать окончательный ответ, не увидев кода, но следующий размер вводит 50% ширины браузера с кнопкой рядом с ним.
input {width:50%}
<input>
<button>save</button>
HTML:
<div class="widebox">
<input type="text" value="" />
<button>Button</button>
</div>
jQuery:
<script type="text/javascript">
$(document).ready(function(){
var w = $(".widebox");
$(".widebox input:text").css({ width: (w.width - (w.children("button:first").width + 20)) });
});
</script>
Примечание. Обязательно включите библиотеку jQuery в вашем документе < голова>. Для скорости я рекомендую использовать, который размещен в Google: http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js