Пытаюсь сделать AJAX форму отправки сообщений с сайта.
Переменной formCost присваиваю содержимое элемента #modal_callback_2 через .html().
При нажатии на кнопку "Отправить" ничего не происходит.
Код прикрепляю:
$(function ($) {
"use strict";
var $formCost = $("#modal_callback_2").html();
$formCost.on("click", 'button.submit', function () {
var strName = $('#name', $formCost).val(),
strCompany = $('#company', $formCost).val(),
strMail = $('#mail', $formCost).val(),
strPhone = $('#phone', $formCost).val();
if (strPhone.length < 4) {
$('#phone', $formCost).trigger('focus');
} else {
$.ajax({
url: '/callback_ajax.php',
data: {
name: strName,
company: strCompany,
mail: strMail,
phone: strPhone
}
});
}
});
});
<div id="modal_callback_2" class="form cost" style="display: none;">
<div class="form_wrap">
<span class="form_title">Узнать стоимость</span>
<form id="order_cost">
<input type="text" id="name" placeholder="Ваше имя">
<input type="text" id="company" placeholder="Название компании">
<input type="email" id="mail" placeholder="Ваше E-MAIL">
<input type="tel" id="phone" placeholder="Ваше телефон">
<textarea name="" id="" cols="30" rows="10"></textarea>
<button type="button" class="submit">Отправить</button>
</form>
</div>
</div>
Помогите пожалуйста разобраться что не так.