ByMaDaK adlı üyeden alıntı: mesajı görüntüle

Merhaba, hayırlı geceler Bu konuyu açmasam olmayacaktı.

Sıfırdan istediğim gibi bir kodlamayı çok kısa sürede yazdırabiliyorum. Derdimi anlatabilirsem, kesinlikle istediğim kodlamayı bana çok rahat bir şekilde çıkarabiliyor.

Prompt vs. hiç kullanmıyorum. İstediğimi açıkça anlaşılır olarak anlatınca çözüme kavuşturuyor kesiklikle.

(function($) {
$.fn.wizard = function(options) {
var settings = $.extend({
startStep: 0,
prevBtnText: 'Previous',
nextBtnText: 'Next',
}, options);

return this.each(function() {
var wizard = $(this);
var steps = wizard.find('.step');
var content = wizard.find('.wizard-content [data-wizard-content]');
var progressBar = wizard.find('.progress');
var prevBtn = wizard.find('[data-action="prev"]');
var nextBtn = wizard.find('[data-action="next"]');
var currentStep = settings.startStep;
var isCompleted = false;

function showStep(stepIndex) {
var numSteps = steps.length;
content.removeClass('active').eq(stepIndex).addClass('active');
content.css('transform', `translateX(${-100 * stepIndex}%)`);

steps.removeClass('active successful').slice(0, stepIndex).addClass('successful').end().eq(stepIndex).addClass('active');

var progressPercent = (stepIndex / (numSteps - 1)) * 100;
progressBar.css('width', progressPercent + '%');
}

function updateButtons() {
var isStartStep = (currentStep === 0);
var isLastStep = (currentStep === steps.length - 1);

nextBtn.text(isLastStep ? settings.completionMessage : settings.nextBtnText).toggle(!isLastStep);
prevBtn.toggleClass('back-active', !isStartStep && !isCompleted); // Güncellenen kısım
}

function validateInputs() {
var inputs = content.eq(currentStep).find('input[data-regex]');
var isValid = true;
var matchedInputs = {};

inputs.each(function() {
var input = $(this);
var regexPattern = new RegExp(input.data('regex'));
var value = input.val();
var errorMessage = input.data('error-message');
var matchId = input.data('match-id');
var matchErrorMessage = input.data('match-error-message');
var errorContainer = input.siblings('.error-message');
var matchErrorContainer = matchedInputs[matchId] && matchedInputs[matchId].siblings('.error-message');

if (!regexPattern.test(value)) {
isValid = false;

if (errorContainer.length === 0) {
input.addClass('error').after(`<span class="error-message">${errorMessage}</span>`);
} else {
errorContainer.text(errorMessage);
}
} else {
input.removeClass('error');

if (errorContainer.length > 0) {
errorContainer.remove();
}

if (matchId) {
if (matchedInputs[matchId]) {
var firstInput = matchedInputs[matchId];

if (firstInput.val() !== value) {
isValid = false;

if (matchErrorContainer.length === 0) {
firstInput.addClass('error').after(`<span class="error-message" data-match-id="${matchId}">${matchErrorMessage}</span>`);
} else {
matchErrorContainer.text(matchErrorMessage);
}

input.addClass('error').after(`<span class="error-message" data-match-id="${matchId}">${matchErrorMessage}</span>`);
} else {
firstInput.removeClass('error');

if (matchErrorContainer.length > 0) {
matchErrorContainer.remove();
}

input.removeClass('error');
}
} else {
matchedInputs[matchId] = input;
}
}
}
});

return isValid;
}

function nextStep() {
if (currentStep < steps.length - 1 && !isCompleted) { // Güncellenen kısım
var isValid = validateInputs();

if (isValid) {
var formData = wizard.find('form').serialize();
var ajaxOptions = settings.ajaxOptions;

if (currentStep === settings.postStep) {
performAjaxRequest(formData);
} else {
currentStep++;
showStep(currentStep);
updateButtons();
}
}
}
}

function prevStep() {
if (currentStep > 0 && !isCompleted) { // Güncellenen kısım
currentStep--;
showStep(currentStep);
updateButtons();
}
}

function goToStep(stepIndex) {
if (stepIndex >= 0 && stepIndex < steps.length && stepIndex <= currentStep && !isCompleted) { // Güncellenen kısım
currentStep = stepIndex;
showStep(currentStep);
updateButtons();
}
}

function performAjaxRequest(data) {
var ajaxOptions = settings.ajaxOptions;

$.ajax({
type: ajaxOptions.type,
url: ajaxOptions.url,
data: data,
dataType: ajaxOptions.dataType,
beforeSend: function() {
nextBtn.prop('disabled', true).addClass('btn-loader');
},
success: function(response) {
if (response.error) {
var errorInput = content.find(`input[name="${response.error.input_name}"]`);
var errorContainer = errorInput.siblings('.error-message');
console.log(errorInput);
if (errorContainer.length === 0) {
errorInput.addClass('error').after(`<span class="error-message">${response.error.msg}</span>`);
} else {
errorContainer.text(response.error.msg);
}

if (response.error.step_index !== undefined) {
goToStep(response.error.step_index);
}
if (response.error.refresh) {
location.reload();
}
} else if (response.message) {
currentStep++;
showStep(currentStep);
updateButtons();
if (currentStep === steps.length - 1) {
isCompleted = true;
}
}
nextBtn.prop('disabled', false).removeClass('btn-loader');
}
});
}

wizard.on('click', '[data-action="prev"]', prevStep);
wizard.on('click', '[data-action="next"]', nextStep);

steps.each(function(index) {
$(this).attr('data-step-index', index);
});

wizard.on('click', '[data-step-index]', function() {
var stepIndex = $(this).data('step-index');
goToStep(stepIndex);
});

wizard.on('goToStep', function(event, stepIndex) {
goToStep(stepIndex);
});

showStep(currentStep);
updateButtons();
});
};
})(jQuery);