28
Фев
2022

Вывести в модальное окно данные, полученные из ajax запроса

Есть ajax запрос:

 function call(id) {
 
    $.ajax({
        method: 'post',
        url: 'request.php', 
        data: {m:id},
 
        success: function(data) {  
           //что тут прописать??
        },
        error:  function(xhr, str){ 
            alert('Возникла ошибка: ' + xhr.responseCode);
        }
    });
};

Получаю ответ от сервера:

 if (isset($_POST['m']) ) {
      $_POST['m']=(int)$_POST['m'];
             $reply=mssql("SELECT name, email, phone  FROM users WHERE ID='{$_POST['m']}'");");
      ob_clean();
  echo json_encode($reply,JSON_UNESCAPED_UNICODE);

Подскажите, как вывести результат в модальное окно? Также нашел стили:

    .modal_div {
    width: 300px;
    height: 300px; 
    border-radius: 5px;
    border: 3px #000 solid;
    background: #fff;
    position: fixed; 
    top: 45%; 
    left: 50%; 
    margin-top: -150px;
    margin-left: -150px; 
    display: none; 
    opacity: 0; 
    z-index: 5; 
    padding: 20px 10px;
}

.modal_close {
    width: 21px;
    height: 21px;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    display: block;
}
/* Пoдлoжкa */
#overlay {
    z-index:3; 
    position:fixed; 
    background-color:#000; 
    opacity:0.8; 
    -moz-opacity:0.8; 
    filter:alpha(opacity=80);
    width:100%;
    height:100%; 
    top:0; 
    left:0;
    cursor:pointer;
    display:none; 
}

Форма пока пусть будет такая:

  <div class="modal_div" >
       <h2></h2>
    <div class="row">
        <div class="col">
            <div class="form-group">
                <label>First Name</label>
                <input type="text">
            </div>
        </div>

        <div class="col">
            <div class="form-group">
                <label>Surname</label>
                <input type="text">
            </div>
        </div>

        <div class="col">
            <div class="form-group">
                <label>Email</label>
                <input type="text">
            </div>
        </div>

        <div class="col">
            <div class="form-group">
                <label>Phone</label>
                <input type="text">
            </div>
        </div>

        <div class="col">
            <div class="form-group">
                <label>Message</label>
                <textarea></textarea>
            </div>
        </div>
    </div>
</div>

Источник: https://ru.stackoverflow.com/questions/1386369/%D0%92%D1%8B%D0%B2%D0%B5%D1%81%D1%82%D0%B8-%D0%B2-%D0%BC%D0%BE%D0%B4%D0%B0%D0%BB%D1%8C%D0%BD%D0%BE%D0%B5-%D0%BE%D0%BA%D0%BD%D0%BE-%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D0%B5-%D0%BF%D0%BE%D0%BB%D1%83%D1%87%D0%B5%D0%BD%D0%BD%D1%8B%D0%B5-%D0%B8%D0%B7-ajax-%D0%B7%D0%B0%D0%BF%D1%80%D0%BE%D1%81%D0%B0

Тебе может это понравится...

Добавить комментарий