Разрабатываю интернет магазин.
Корзина -
http://conceptlogic.com/jcart/
Валидация формы -
https://github.com/lubaev/jVForms.js
Маска ввода номера телефона -
http://digitalbush.com/projects/mask...lugin/#license
Отправка формы без перезагрузки страницы -
http://malsup.com/jquery/form/
При оформление заказа (Картинка 1) пользователь может отредактировать корзину, выкинув не нужный ему товар. При этом, когда он жмет "удалить" отрубаются три скрипта: валидация формы, маска ввода телефона, отправка формы без перезагрузки страницы (Картинка 2).
Мне кажется что решение этой проблемы будет очень простое, но т.к. я не силен в JS прошу помощи разобраться с проблемой.
Вот код страницы оформления заказа:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="/style2.css"/>
<link rel="stylesheet" type="text/css" media="screen, projection" href="/jcart/css/jcart.css" />
<title>...</title>
</head>
<body>
<header>
...
</header><div class="center">
<div class="middle">
<aside>
...
</aside>
<article>
<div class="content">
<h3>Оформление заказа</h3>
<div id="jcart">
<form method='post' action='/gateway/' id='basker'>
<fieldset>
<input type='hidden' name='jcartToken' value='e47837cbf611e9477549b1ce7d70239e' />
<table border='1'>
<thead>
<tr>
<th colspan='3'>
<div id='jcart-title'>Корзина</div> (2)
</th>
</tr>
</thead>
<tfoot>
<tr>
<th colspan='3'>
<span id='jcart-subtotal'>Итого: <strong>2.600р.</strong></span>
</th>
</tr>
</tfoot>
<tbody>
<tr>
<td class='jcart-item-qty'>
<input name='jcartItemId[]' type='hidden' value='430' />
<input id='jcartItemQty-430' name='jcartItemQty[]' size='2' type='text' value='1' />
</td>
<td class='jcart-item-name'>
ФАРА CHERY QQ (S11) `03-12 LH
<input name='jcartItemName[]' type='hidden' value='ФАРА CHERY QQ (S11) `03-12 LH' />
</td>
<td class='jcart-item-price'>
<span>1.300р.</span><input name='jcartItemPrice[]' type='hidden' value='1300' />
<a class='jcart-remove' href='?jcartRemove=430'>удалить</a>
</td>
</tr>
<tr>
<td class='jcart-item-qty'>
<input name='jcartItemId[]' type='hidden' value='432' />
<input id='jcartItemQty-432' name='jcartItemQty[]' size='2' type='text' value='1' />
</td>
<td class='jcart-item-name'>
ФАРА CHERY QQ (S11) `03-12 RH
<input name='jcartItemName[]' type='hidden' value='ФАРА CHERY QQ (S11) `03-12 RH' />
</td>
<td class='jcart-item-price'>
<span>1.300р.</span><input name='jcartItemPrice[]' type='hidden' value='1300' />
<a class='jcart-remove' href='?jcartRemove=432'>удалить</a>
</td>
</tr>
</tbody>
</table>
<div id='jcart-buttons'>
<input type='submit' name='jcartUpdateCart' value='обновить' class='jcart-button' />
<input type='submit' name='jcartEmpty' value='очистить' class='jcart-button' />
</div>
<input type='hidden' id='jcart-is-checkout' name='jcartIsCheckout' value='true' />
<div class="order_form">
<div class="header_order">Фамилия, Имя, Отчество</div>
<input id="text" type="text" name="fio" class="vf-stringRu" placeholder="например: Иванов Сергей Петрович">
<div class="header_order">Телефон (обязательное поле)</div>
<input type="text" name="telephone" required="required" class="vf-phoneDash" id="vf-phoneDash" placeholder="в формате (000) 000-0000">
<div class="header_order">Email</div>
<input id="text" type="text" name="email" pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" placeholder="эл. почта">
<div class="header_order">Город</div>
<input id="text" type="text" name="city" class="vf-stringRu" placeholder="Миасс">
<div class="header_order">Комментарий</div>
<textarea id="comment" name="comment" class="vf-all" placeholder="Ваши пожелания"></textarea>
<input id="submit" type="submit" value="Отправить заказ">
</div>
</fieldset>
</form>
<br><div id="result_basket"></div></div>
</div>
</article>
</div>
</div>
<footer>
...
</footer>
<script type="text/javascript" src="/jcart/js/jcart.min.js"></script>
<script src="/jquery.maskedinput.js" type="text/javascript"></script>
<script>
jQuery(function($){
$("#vf-phoneDash").mask("(999) 999-9999");
});
</script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('#basker').ajaxForm( {
target: '#result_basket',
});
});
</script>
</body>
</html>
Картинка 1
Картинка 2