Как сделать popup с вводом номера?

Question

[Влад]

У меня в интернет магазине имеется кнопка "В корзину":

<form>... <input><input><submit onclick="Addtocart()"></form>

Подскажите, пожалуйста, как сделать, чтобы при нажатии на Submit вначале здесь же рядом открывался небольшой popup, в которое поместить 1 input с вводом телефона и кнопка "Далее".
И чтобы только после ввода телефона срабатывал Addtocart() со всеми значениями инпутов, которые были заполнены.

Как так сделать?

*Буду еще мега благодарен, если посоветуете подходящий javascript красивого popup для этого.

Comments

[Сергей Мелодин]

Ну, интернет-магазин на чём-то написан. Это что-то наверняка имеет готовые модули, а они уже работают с серверной стороной и дальше. Собственно, вопрос: что там с готовыми формами под эту задачу?

[Влад]

Сергей Мелодин, у меня самописный движок под заказ, готового подобного функционала нет.
Надеюсь самостоятельно доработать.
Меня интересует минимум как на яваскрипте приостановить действие onclick, после чего вызвать попап и только после отправки submit в этой форме закрыть popup и продолжить выполнение первого onclick?

[Сергей Мелодин]

Влад, поочерёдный вызов функций ) Отправить (функция открытия попапа) Далее (Проверить данные, вернуть ошибку, если не заполнено или отправить данные на сервер и закрыть попап). Ну и т.д.

Готового попапа под рукой нет, но вообще, задача сверстать этот самый попап, добавить ему css-свойство display: none. Когда пользователь кликает на Отправить, просто меняешь ему свойство на display: block и там уже инпут с кнопкой далее, которая либо обратно скрывает попап свойством, либо удаляет его со страницы вообще, это уж как удобнее.
На jquery изменение css-свойств очень простое: $('#popup').css('display', 'block');

[Влад]

Сергей Мелодин, да, оказывается просто поочереди - внедрил) спасибо!

Answer 1

[pestunov]

Может быть так:

function PopUp() {
    //Тут реализовать PopUp
    Addtocart()
}

<submit onclick="PopUp()">