Подсчет значений в полях вебформы

04.12.2012

Добрый день. Есть задачка такая, В вебформе которая в свою очередь получает несколько значений из ноды посчитать поля. Просто умножить одно на другое, ну и по возможности применить условия сравнения для применения и вычисления процента дисконта. Понимаю что на пхп можно сделать, но как и где прописать? пробовал в шаблоне вебформы но не могу достучаться до значений полей и главное в поля вывести результат. Буду рад конструктивным ответам. С пхп только начинаю знакомиться но очень хочется. Уберкарт и коммерц не предлагать, не тот случай.

-->
Узнавай о новых статьях сайта - первым. Просто подпишись на рассылку.

Комментарии (67)

Profile picture for user pantey
pantey
04.12.2012

А по подробней? каким образом реализована вебформа - модулем или самописная? Какие значения принимает вебформа из ноды, из полей? Каким образом подгружаете ноду к вебформе?

Profile picture for user 1541
1541
05.12.2012

Вот ссылка на сайт Если нажать перейти к заказу в ноде то выводится вебформа. Вебформа не самописная, ибо еще не умею такого делать, но научиться хочу очень. Реализована она с помощью модуля Webforms. Значения из ноды форма принимает: title и price посредством $_GET. И соответственно рассовывает эти значения в поля формы: наименование и цена. В форме есть поле: количество. Вот мне необходимо чтобы после ввода количества оно перемножалось с ценой и выходил результат который можно вывести либо просто в теле формы, либо, что лучше конечно, в поле: Итоговая сумма. В идеале я еще хотел бы реализовать скидки тут. И написать логику то могу, в смысле сам цикл if.. then.. else... and... но вот как мне в этот код подцепить значения моих полей именно с опросника а не с типа материалла, и как их повыводить.. Да еще и в каком шаблоне лучше прописать.. Вот это и есть вопрос.

Profile picture for user pantey
pantey
05.12.2012

так а что вам мешает Price внести в переменную, для поля количества так же создать переменную откуда будут забираться значения.Далее передаете все значения из полей в функцию, которая должна выполнять все ваши действия и после перезагрузки результат отдать браузеру. Т.е. создаете еще один файл PHP, в котором напишите вашу функцию, хотя можно и без функции обойтись. Вешаете submit на файл, что то вроде пересчитать цену и радуетесь результатом. Как работать с формами в php вот ссылка, только там в примере написан вывод информации из формы на экран, а вам необходимо занести их в переменные, произвести все вам необходимые действия и отдать обратно браузеру. Так же что бы вывести результат формы в поле, необходимо темизировать страницу с формой. Принцип действия такой.

Profile picture for user 1541
1541
05.12.2012

А как создать для поля количество переменную? Хотябы с этого начнем.

Profile picture for user pantey
pantey
05.12.2012

ну у данного поля вашей формы должно быть название. Поля формы строятся как

<form>
Цена:
<input type="text" name="cena"></input>
Количество:
<input type="text" name="kolichestvo"></input>
</form>

далее по submit вы должны присвоить переменную для данного поля, т.е. файл php должен выглядеть так

$a =  $_GET['kolichestvo'];
$b = $_GET['cena'];

далее пишите необходимые вам действия

$c = $a*$b;

и далее выводите результат уже в необходимом вам поле

Profile picture for user pantey
pantey
05.12.2012

Хотя думаю на JS проще реализовать, передавать данные хотя бы ни куда не нужно!

Profile picture for user 1541
1541
06.12.2012

Я вот поломал голову и с помощью одного человека реализовал следующим образом:
в теплейт.пхп написал:

function zen_form_webform_client_form_16_alter(&$form, &$form_state){
	drupal_add_js(drupal_get_path('theme', 'zen') . '/js/computedform.js');/*('sites/all/themes/zen/js/computedform.js');*/
}

и соответственно в computedform.js :

jQuery(document).ready(function() { 
  jQuery("#edit-submitted-qount").change(function(){ 
    jQuery("#edit-submitted-itogovaya-summa-zakaza").value = jQuery("#edit-submitted-qount").value * jQuery("#edit-submitted-cena").value;
	  { alert("Hello!")};
	});
});

Алерт вывел для наглядности срабатывания. Все нормуль, только не считает. Ну а если и считает то значение не выводит. Почему?

Profile picture for user pantey
pantey
06.12.2012

вообщем вот - пользуйтесь. Написал свой скрипт. Не обязательно использовать template.php, можно просто подключить через info файл вашего шаблона, хотя в вашем случае имеет смысл подгружать скрипт только для этой формы, как впринципе и сделано

var $dr = jQuery.noConflict();
$dr(document).ready(function(){
	$dr('#edit-submitted-qount').change(function(){
		var $summa = $dr('#webform-component-cena input').val() * $dr('#webform-component-qount input').val();
		$dr('#webform-component-itogovaya-summa-zakaza input').attr('value', $summa);
	});
	
});
Profile picture for user 1541
1541
06.12.2012

Спасибо. А для D7 он пойдет? ничено менять не надо?

Profile picture for user 1541
1541
06.12.2012

Попробовал. Огромнейшее спасибо Вам:) Очень рад такому конструктиву. Скажите а как задать точность вычислений? ну чтобы 2 знака после запятой было? И в идеале хотелось прикрутить сравнение по условию. что то типа:

jQuery(document).ready(function() {
  info_field = jQuery("#edit-submitted-itogovaya-summa-zakaza");
  info_field.hide();
  jQuery("#edit-submitted-qount").change(function(){
    count = jQuery("#edit-submitted-qount").value;
    price = jQuery("#edit-submitted-cena").value;
    if(count > 7 && count  0){
      info_field.value = count * price;
      print info_field;
	  info_field.show();
    } else {
      info_field.hide();
    }
	{ alert("Hello!")};
  });
});

подскажите как?:)

Profile picture for user pantey
pantey
06.12.2012

Это для точности вычислений!

var $dr = jQuery.noConflict();
$dr(document).ready(function(){
	$dr('#edit-submitted-qount').change(function(){
		var $summa = $dr('#webform-component-cena input').val() * $dr('#webform-component-qount input').val();
		$summa = $summa.toFixed(2);
		$dr('#webform-component-itogovaya-summa-zakaza input').attr('value', $summa);
	});
	
});

Было бы проще если вы словами объяснили, что нужно в условие вписать! А то смесь JS и PHP - это перебор конечно!:)

Profile picture for user 1541
1541
06.12.2012

Огромное спасибо за скрипт. Очень, очень выручили. Не знаю даже как благодарить. По поводу сравнения. На сайте есть система скидок. Т.е. если результат получается более 300 но меньше 700 тогда скидка 5%, если более 700 но менее 1000 то скидка 10%, и если более 1000 то скидка 15%. Я вот Вам кинул пример того чего пытался сам наковырять, но видимо я еще не достиг того уровня, и у меня не получилось:(

Profile picture for user pantey
pantey
06.12.2012

т.е. в поле "Итоговая сумма заказа" вам необходимо вносить результат уже со скидкой? Тогда завтра допишу скрипт, сегодня уже ни как не успеваю!

Profile picture for user 1541
1541
06.12.2012

Так точно, хотелось бы чтобы в итоговой сумме выходил результат со скидкой и может вывести надпись, выше результата, которая бы извещала о том что человеку предоставлена скидка и ее размер. Буду очень благодарен. Спасибо Вам большое за участие и науку.

Profile picture for user pantey
pantey
07.12.2012

забирайте!

var $dr = jQuery.noConflict();
$dr(document).ready(function(){
	$dr('#webform-component-itogovaya-summa-zakaza .description').after('<div id="skidka"><p style="color:#ff0000;"></p></div>');
	$dr('#edit-submitted-qount').change(function(){
		var $summa = $dr('#webform-component-cena input').val() * $dr('#webform-component-qount input').val();
		if($summa > 300 && $summa  700 && $summa  1000){
			var $procent = ($summa * 15)/100;
			$summa = $summa - $procent;
			$dr('#skidka p').text('Скидка 15%');
		}
		else{
			$summa = $summa;
		}
		$summa = $summa.toFixed(2);
		$dr('#webform-component-itogovaya-summa-zakaza input').attr('value', $summa);
	});
	
});
Profile picture for user 1541
1541
07.12.2012

Добрый день. Огромное спасибо за скрипт:) НО почему то сумма скидки не выводитcя. Или мне необходимо поле такое добавить "skidka p" ?

Profile picture for user pantey
pantey
07.12.2012

там скидка в процентах показывается, тип "Скидка 5,10 или 15%"! а вам нужно еще и сумму скидки выводить?

Profile picture for user pantey
pantey
07.12.2012

Вообщем что бы сумма скидки еще выводилась:

var $dr = jQuery.noConflict();
$dr(document).ready(function(){
	$dr('#webform-component-itogovaya-summa-zakaza .description').after('<div id="skidka"><p style="color:#ff0000;"></p></div>');
	$dr('#edit-submitted-qount').change(function(){
		var $summa = $dr('#webform-component-cena input').val() * $dr('#webform-component-qount input').val();
		if($summa > 300 && $summa  700 && $summa  1000){
			var $procent = ($summa * 15)/100;
			$procent = $procent.toFixed(2);
			$summa = $summa - $procent;
			$dr('#skidka p').text('Скидка 15%. Размер вашей скидки составляет: ' + $procent + ' руб.');
		}
		else{
			$dr('#skidka p').text('Скидки нет.');
			$summa = $summa;
		}
		
		$summa = $summa.toFixed(2);
		$dr('#webform-component-itogovaya-summa-zakaza input').attr('value', $summa);
	});
	
});
Profile picture for user 1541
1541
07.12.2012

Спасибо огромное, а чтобы выводилось необходимо поле новое создать?

Profile picture for user pantey
pantey
07.12.2012

ничего добавлять не нужно, всё и так выводится!skidka

Profile picture for user 1541
1541
07.12.2012

Странно. У меня не выводится..:(

Profile picture for user pantey
pantey
07.12.2012

Нашел косяк, редактор кода для сайта, часть кода съел! Скопируй опять последний вариант! должно работать.

Profile picture for user 1541
1541
07.12.2012

Ура!! Заработало:) Спасибо:) Прямо чудо какое то:) Буду стараться учить чтобы было глупых вопросов поменьше:) Спасибо еще раз!

Profile picture for user 1541
Serg
09.01.2013

Помогите пожалуйста!
Как узнать для js скрипта параметры - #edit-submitted-qount и
#webform-component-cena. Пытаюсь повторить скрипт, созданный pantey, но не
получается.. на drupal 6. Прошу прощения за глупый вопрос, но я новичок

Profile picture for user pantey
pantey
10.01.2013

Данный скрипт писался под конкретную задачу сайта и под определённую форму, версия Drupal ни причём! #edit-submitted-qount и #webform-component-cena это id полей формы, которая была реализована на сайте. Пиши подробней, что нужно и где можно посмотреть сайт. Тогда можно что то придумать.

Profile picture for user 1541
Serg
11.01.2013

Благодарю!
id своих полей формы посмотрел через FireBug, подставил id в скрипт
но не работает...
Форма стандартная, сайт http://slavsvet.ru/node/38?buket=39.
Нужно чтобы в поле итоговая стоимость вычислялось перемноженное содержимое полей цена и количество.
Да, еще нужно вытаскивать из CCK материла значение цены и вставлять в поле вебформ. Это можно сделать через прописывания $_GET[name поля] ??

Profile picture for user 1541
Serg
12.01.2013

Разобрался почему не работало - нужно было в скрипте заменить (в моем случае)
заменить $dr на jQuery. А как сделать чтобы в поле итоговая сумма значение изменялось сразу после изменения в поле Количество?

Profile picture for user pantey
pantey
13.01.2013

использовать

change()

времени пока нет заняться вашим скриптом, завтра обязательно посмотрю.

Profile picture for user 1541
Serg
14.01.2013

спасибо, скрипт заработал, вот только не понятно по какому принципу значение
поля цены в ССК материала передовать в поле цены вебформы.
И функция change в скрипте уже есть, а все же итоговая сумма появляться только после дополнительного клика, как сделать без клика?
Подскажите пожалуйста как это сделать?

Profile picture for user pantey
pantey
14.01.2013

Насколько я помню в созданной форме можно задавать значения по умолчанию для полей, посмотрите список токенов при редактировании поля. Для расчёта без клика можно попробовать

mouseout();

вместо

change();
Profile picture for user 1541
Serg
16.01.2013

Здравствуйте. Прошу помощи... Не получается переделать ваш скрипт под свою задачу.
Добавляю в форму радиокнопку (для включения в заявку услуги доставки). При клике по ней скрипт к итоговой сумме (количество*цену) должен просто добавить 300 рублей.
Сейчас скрипт некоректно обрабатывает итоговую сумму при изменении поля Количество
Вывод итоговой суммы при изменении поля Количество не происходит. А при клике радиокнопки (услуги) Итоговая сумма выводится.
Как сделать, чтобы при любом событии - изменения в поле Кол-во или при клике по чекбоксу скрипт выводил
итоговую сумму. Сейчас скрипт такой..

jQuery(document).ready(function(){
    jQuery('#edit-submitted-count').change(function(){
    var $summa = jQuery('#webform-component-cena input').val() * 
   jQuery('#webform-component-count input').val();
                  
        jQuery("#webform-component-need-dostavka").change(function () {
        var $ap = jQuery('input:radio[name=submitted[need_dostavka]]:checked').val();
        if($ap == "need_yes" ){
            var $summa2 = ($summa + 400);
            }                   
           else {
            $summa2 = $summa;
        }
        jQuery('#webform-component-itogovaya input').attr('value', $summa2 );
          
     });     
  
   });
     
 });
Profile picture for user pantey
pantey
17.01.2013

А точно ли вам нужно использовать именно радиокнопку, она как бы для других целей предназначена. А так как вариант я вам написал скрипт с чекбоксом.
Сам код скрипта

$(document).ready(function(){
	function itog(){
		if($('input[type=checkbox]').is(':checked')){
		var $summa = $('#edit-submitted-cena-wrapper input').val()*$('#edit-submitted-count-wrapper input').val()+300;
		$('#edit-submitted-itogo-wrapper input').attr('value', $summa);
        }
		else{
		var $summa = $('#edit-submitted-cena-wrapper input').val()*$('#edit-submitted-count-wrapper input').val();
		$('#edit-submitted-itogo-wrapper input').attr('value', $summa);
		}
	}
	
	$('#edit-submitted-count').change(function(){
		itog();
	});
	
	$('#edit-submitted-dostavka').change(function(){
		itog();
	});
});

пример работы можно скачать отсюда, написал по форме - ссылку на которую давали выше. Добавил дополнительный инпут(с чекбоксом) в индексном файле разберетесь, там оставил комментарий.

Profile picture for user 1541
Serg
17.01.2013

Спасибо большое!! можно и чекбокс, то что нужно ...

Profile picture for user 1541
drudreamer
15.02.2013

Пожалуйста можете написать суммирование чекбоксов, тоесть множественный выбор чекбоксов и в итоге сумма отмеченных, мне бы хотя бы примерно как будет выглядеть. Писал как вы только не использовал функцию, не получилось:(

Profile picture for user pantey
pantey
15.02.2013

вам просто пример как чекбоксы суммировать?

Profile picture for user 1541
drudreamer
15.02.2013

да, тоесть есть чекбоксы, и при каждом нажатие на определенный чекбокс суммируется определенная сумма, выбор чекбоксов множественный. Будьте добры примером:)

Profile picture for user 1541
drudreamer
18.02.2013

чуть чуть разобрался, только вот когда в чекбоксе убираю флажок обратное значение не становится, тоесть отметил флажок, суммировалось определенная сумма к итоговому полю, а когда убираю флажок ничего не меняется. Буду пробовать, но на всякий случай проверьте мой код пожалуйста.

$(function () {
     $("#edit-submitted-huntprice-priceh-1").change(function  () {
         if  (!$("edit-submitted-huntprice-priceh-1").is(":checked")){
            $('#webform-component-huntprice--hsum input').attr('value', $hsumma+6000);
        };
                });
                });
Profile picture for user pantey
pantey
18.02.2013

а ссылку на сайт можно?

Profile picture for user pantey
pantey
18.02.2013

вроде по первому условию все верно, вам нужно написать скрипт, который будет выполняться если условие дает FALSE, примерно по вашему коду будет выглядеть что-то вроде этого

$('#webform-component-huntprice--hsum input').attr('value', $hsumma);
Profile picture for user 1541
drudreamer
19.02.2013

сайт пока в общем доступе нет, делаю на локалке,
а такой код я вставлял в else условие, не помогает. Спасибо за ответ!

Profile picture for user 1541
drudreamer
22.02.2013

Здравствуйте еще раз, например есть функция вида

$(function () {
     $("#edit-submitted-fishprice-pricef-1").change(function  () {
         if  (!$("#edit-submitted-fishprice-pricef-1").is(":checked")){
            $('#webform-component-fishprice--fsum input').attr('value', 500);
        };
                });
                });

как передать значение функции глобально? достаточно ли просто приравнять переменную к функции

var $a = $(function () {//});
Profile picture for user pantey
pantey
22.02.2013

не совсем понимаю, что вы подразумеваете под "передать значение глобально"! Если вам необходимо использовать переменную внутри функции, то лучше ее определить в самой функции

function (){
var $a = //ваше значение
}

если необходимо передать значение из переменной в функцию, то это выглядит вот так

var $a = 25;
function in(test){
$b=test*25;
}
in($a);
Profile picture for user 1541
drudreamer
22.02.2013

Можно ли переменной присвоить результат значения функции? то есть

$c = $function(){$a+$b}

Посоветуйте пожалуйста книжки по jquery:)

Profile picture for user pantey
pantey
22.02.2013

к сожалению нет, если вам необходимо присвоить переменную к результату работы функции, то можно использовать вот такую конструкцию

function myFun(test){
		$a = 25 + test;
	}
	
	myFun(3);
	alert($a);

на счёт книги, даже не знаю. На просторах интернета, их достаточно, выбирайте любую.

Profile picture for user 1541
drudreamer
22.02.2013

а можно ли использовать переменные заданные в одной функции в другой?

Profile picture for user pantey
pantey
22.02.2013

да конечно, вот пример

function myFun(test){
		$a = 25 + test;
	}
	
	myFun(3);
	
	function myBlock(test){
		$c = $a + test;
	}
	
	myBlock(40);
	alert($c);
Profile picture for user 1541
drudreamer
22.02.2013

Ооо спасибо!

Profile picture for user 1541
drudreamer
22.02.2013

Проверьте пожалуйста:

$('#edit-submitted-huntprice-humanh'||'#edit-submitted-huntprice-sumhod input').click(function(){

Правильно ли я объединяю реагирование событий? как правильно писать?

Profile picture for user pantey
pantey
22.02.2013

вы не можете в выборе селекторов ставить условие, если вам необходимо выполнять одну ф-ю для разных объектов, то можно воспользоваться этой конструкцией

function name(){
		alert('Hello');
	}
	
	$('.test').bind('click', name);
	$('.test1').bind('click', name);
Profile picture for user 1541
drudreamer
22.02.2013

Получилось объединить вот так

$('#edit-submitted-huntprice-humanh'|'#edit-submitted-huntprice-sumhod input').click(function(){

единственное что не получается это после того как поставил чекбокс значение поля увеличивается, а при отключение флажка значение не изменяется..