Добрый день.
Пожалуйста помогите!
Есть форма введения последовательных данных, index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/style.css" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="formToWizard.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#SignupForm").formToWizard({ submitButton: 'SaveAccount' }) ;
$("#info").fadeIn(400); })
</script>
</head>
<body>
<div id="main">
<form id="SignupForm" action="feedback.php" method="POST" name="SignupForm">
<fieldset><!--выбор пожертвования 15, 10 или своя сумма-->
<legend>Step 1</legend>
<hr>
<input id="Button_Sum15" type="radio" value="1"/>
<label for="Sum15">Ich möchte die Arbeit der Projekthilfe Gambia e.V. dauerhaft unterstützen und für min. 10 € im Monat bis auf Widerruf Förderer in der Hilfsorganisation werden.</label>
<br>
<input id="Button_Sum10" type="radio" value="2"/>
<label for="Sum10">Ich möchte eine Projekt-Patenschaft für die Ausbildung eines Vorschulkindes bis auf Widerruf für einen monatlichen Grundbetrag von 15 € übernehmen.</label>
<br>
<input id="Button_SumMAX" type="radio" value="3"/>
<label for="SumMAX">Ich möchte die Arbeit der Projekthilfe Gambia e.V. durch eine Spende Unterstützen.</label>
<hr>
</fieldset>
<fieldset><!--Данные по человеку, Step 2-->
<legend>Step 2 Data User</legend>
<hr>
<label for="Name">Name</label>
<input id="Name" type="text" />
<label for="PLZ">PLZ/Ort</label>
<input id="PLZ" type="text" />
<label for="Telefon">Telefon</label>
<input id="Telefon" type="text" />
<label for="Strasse">Strasse</label>
<input id="Strasse" type="text" />
<label for="Email">E-mail</label>
<input id="Email" type="text" />
<label for="Kontoinhaber">Kontoinhaber</label>
<input id="Kontoinhaber" type="text" />
<label for="BIC">BIC</label>
<input id="BIC" type="text" />
<label for="IBAN">IBAN</label>
<input id="IBAN" type="text" />
<label for="Name der Bank">Name der Bank</label>
<input id="Name der Bank" type="text" />
<hr>
</fieldset>
<fieldset id="Form_Sum15"><!--форма пожертвования 15 евро-->
<legend>Step 3 - Sum15</legend>
<hr>
<label>Vielen Dank, dass Sie eine Patenschaft übernehmen.
In welchen Abständen soll der Monatsbeitrag in Höhe von 15,- EUR vom genannten Konto abgebucht werden?.</label>
<label>Ziehen Sie den oben genannten Betrag von meinem Konto ab.</label>
<br>
<input id="monatlich15" type="radio" value="1"/>
<label for="monatlich15">monatlich </label>
<input id="vierteljaehrig15" type="radio" value="2"/>
<label for="vierteljaehrig15">vierteljaehrig </label>
<input id="halbjaehrig15" type="radio" value="3"/>
<label for="halbjaehrig15">halbjaehrig </label>
<input id="jaehrlich15" type="radio" value="4"/>
<label for="jaehrlich15">jaehrlich</label>
<hr>
<label>Ich benötige eine Zuwendungsbestätigung zur Vorlage beim Finanzamt,die mir am Anfang des Folgejahres meiner Beitragszahlung / Spende zugestellt wird.</label>
<br>
<input id="Ja15" type="radio" value="1"/>
<label for="Ja15">Ja</label>
<input id="Nein15" type="radio" value="2"/>
<label for="Nein15">Nein</label>
<hr>
</fieldset>
<fieldset id="Form_Sum10"><!--форма пожертвования 10 евро-->
<legend>Step 3 - Sum10</legend>
<label>Welchen Betrag möchten Sie spenden?</label>
<input id="Welchen10" type="text" />
<hr>
<label>Ziehen Sie den oben genannten Betrag von meinem Konto ab.</label>
<br>
<input id="monatlich10" type="radio" value="1"/>
<label for="monatlich10">monatlich </label>
<input id="vierteljaehrig10" type="radio" value="2"/>
<label for="vierteljaehrig10">vierteljaehrig </label>
<input id="halbjaehrig10" type="radio" value="3"/>
<label for="halbjaehrig10">halbjaehrig </label>
<input id="jaehrlich10" type="radio" value="4"/>
<label for="jaehrlich10">jaehrlich</label>
<hr>
<label>Ich benötige eine Zuwendungsbestätigung zur Vorlage beim Finanzamt,die mir am Anfang des Folgejahres meiner Beitragszahlung / Spende zugestellt wird.</label>
<br>
<input id="Ja10" type="radio" value="1"/>
<label for="Ja10">Ja</label>
<input id="Nein10" type="radio" value="2"/>
<label for="Nein10">Nein</label>
<hr>
</fieldset>
<fieldset id="Form_SumMAX"><!--форма пожертвования, Своя сумма-->
<legend>Step 3 - SumMAX</legend>
<label>Welchen Betrag möchten Sie spenden?</label>
<input id="WelchenMAX" type="text" />
<hr>
<label>Ich benötige eine Zuwendungsbestätigung zur Vorlage beim Finanzamt,die mir am Anfang des Folgejahres meiner Beitragszahlung / Spende zugestellt wird.</label>
<br>
<input id="JaMAX" type="radio" value="1"/>
<label for="JaMAX">Ja</label>
<input id="NeinMAX" type="radio" value="2"/>
<label for="NeinMAX">Nein</label>
<hr>
</fieldset>
<fieldset><!--Отображаются данные, которые заполнил клиент в Step 2-->
<legend>Step 4 Data User View</legend>
<hr>
<label>Name, Anschrift:</label>
<?php echo $DATA_NAMEANSCHRIFT ?>
<br>
<label>Bankverbindung:</label>
<?php echo $DATA_BANNKVERBINDUNG ?>
<br>
<label>Ihre Spende:</label>
<?php echo $DATA_IHRESPENDE ?>
<hr>
<p>
<input id="SaveAccount" class="srenden" type="submit" value="Senden" />
</p>
<hr>
</fieldset>
</form>
</div>
</body>
</html>
К ней подключен скрипт управления, formToWizard.js , вот он
(function($) {
$.fn.formToWizard = function(options) {
options = $.extend({
submitButton: '',
}, options);
var element = this;
var steps = $(element).find("fieldset");
var count = steps.size();
var submmitButtonName = "#" + options.submitButton;
$(submmitButtonName).hide();
// 2
$(element).before("<ul id='steps'></ul>");
steps.each(function(i) {
$(this).wrap("<div id='step" + i + "'></div>");
$(this).append("<p id='step" + i + "commands'></p>");
// 2
var name = $(this).find("legend").html();
$("#steps").append();
if (i == 0) {
createNextButton(i);
selectStep(i);
}
else if (i == count - 1) {
$("#step" + i).hide();
createPrevButton(i);
}
else {
$("#step" + i).hide();
createPrevButton(i);
createNextButton(i);
}
});
function createPrevButton(i) {
var stepName = "step" + i;
$("#" + stepName + "commands").append("<a href='#' id='" + stepName + "Prev' class='prev impressum'>< Back</a>");
$("#" + stepName + "Prev").bind("click", function(e) {
$("#" + stepName).hide();
$("#step" + (i - 1)).show();
$(submmitButtonName).hide();
selectStep(i - 1);
});
}
function createNextButton(i) {
var stepName = "step" + i;
$("#" + stepName + "commands").append("<a href='#' id='" + stepName + "Next' class='next impressum'>Next ></a>");
$("#" + stepName + "Next").bind("click", function(e) {
$("#" + stepName).hide();
$("#step" + (i + 1)).show();
if (i + 2 == count)
$(submmitButtonName).show();
selectStep(i + 1);
});
}
function selectStep(i) {
$("#steps li").removeClass("current");
$("#stepDesc" + i).addClass("current");
}
}
})(jQuery);
Нужен следующий функционал:
(Sum15) Если пользователь выбирает кнопку Button_Sum15 в шаге Step 1 то его перекидывает на форму заполнение данных Step 2 Data User и потом на форму Form_Sum15 .
(Sum10) Если выбирает кнопку Button_Sum10 в шаге Step 1 то его перекидывает на форму Step 2 Data User где он заполняет данные, а потом Form_Sum10 .
(SumMAX) Если выбирает кнопку Button_SumMAX в шаге Step 1 то его перекидывает на форму Step 2 Data User где он заполняет данные, а потом на Form_SumMAX .
Дальше последний шаг Step 4 Data User View и все.
Так же почему то не работает переключение между кнопок(((.
Пожалуйста, помогите решить!
Я уверен для профи это не сложно.
