Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.09.2013, 12:29
Новичок на форуме
Отправить личное сообщение для osoboopasen Посмотреть профиль Найти все сообщения от osoboopasen
 
Регистрация: 30.09.2013
Сообщений: 2

Как подружить несколько скриптов на странице
Разрабатываю интернет магазин.

Корзина - 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

Последний раз редактировалось osoboopasen, 30.09.2013 в 12:32.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Несколько одинаковых форм обратной связи на одной странице stalex jQuery 14 24.04.2018 17:25
Управление скроллом "а-ля тач" HonesT Элементы интерфейса 2 27.08.2013 14:25
Как сделать несколько полей подсказок для слайдера DaniBeiss Events/DOM/Window 1 23.06.2012 16:49
Несколько iframe на странице oblomov86 Events/DOM/Window 3 19.12.2011 12:00
Как передать фокус флешке на странице? dArky Общие вопросы Javascript 3 10.08.2008 01:03