Я пытаюсь создать html-страницу в своем приложении angularjs. У меня есть поле ввода и один выпадающий рядом. У моего поля ввода есть размер, и я хочу сделать раскрывающееся расширение с тем же размером, что и мое поле ввода.
My Html Code,
<body ng-controller="Controller">
<h1>Plunkr Example</h1>
<fieldset style="border:1px solid black;">
<legend>Data</legend>
<span style="float:right">Check4: <input type="input" id="input"
ng-repeat="x in string | filter : 'check'"
ng-model="x._text"/>
<select id="dropdown">
<option value="1">True</option>
<option value="2">False</option>
<option value="3">Edit</option>
</select>
</span>
</fieldset>
</body>
And Controller code,
$scope.string = [
{"_attributes":{"name":"comments"},"_text":"comments"},
{"_attributes":{"name":"check"},"_text":'Some Content Here'},
{"_attributes":{"name":"value"},"_text":123}
]
Я также сделал plunkr , чтобы продемонстрировать, где текущий макет похож на это, с некоторым разрывом между полем ввода и раскрывающимся списком. Я попытался удалить пробел, добавив 0 и margin: 0, но безуспешно.
А что нужно,
И при нажатии на раскрывающемся списке опции должны появиться под полем ввода того же размера, как показано ниже
Также, если пользователь выберет True / false, поле ввода должно стать доступным только для чтения. Это должно быть редактируемым, только если выбрана опция Edit.
Пожалуйста, предложите, как этого можно достичь. Большое спасибо заранее.