Как написать код, чтобы получилась форма как статус в вк?

Question

[Илья Радзиминский]

Как написать код, чтобы получилась форма как статус в вк?

Comments

[iBird Rose]

а подробнее? что именно как в статусе в вк? там просто при нажатии на текст - открывается модалка с формой

Answer 1

[Mr_Romanov]

<form method="post" id="rename" class="rename"  style="margin: 0px; padding: 0px;">
<input title="Для изменения кликните" type="text"  id="status" value="статус" style="font-size:18px; width:40%;  cursor: text, auto; border:none;">
</form>

Answer 2

[Никита Кит]

сам то понял чё сказал?) в вк на статусе (строка) висит обработчик click с функцией, которая скрывает статус и раскрывает form в которой input text + submit. По сабмиту летит post в базу, в таблицу твоего акка и обновляется инфа. Судя по тому, что для обновления не требуется ребут страницы - работает всё на nodejs + json DB типа монги.
Ну хотя без nodejs можно - просто подменять строку статуса на значение из input, которое постнулось в базу.

Answer 3

[Вадим]

Способ 1. Атрибут contenteditable отправлять данные беря innerHTML
Способ 2. Подменять текст на input и отправлять данные по change или submit на нажание Enter'a