𝗠𝘂𝗹𝘁𝗶-𝘀𝘁𝗲𝗽 𝗳𝗼𝗿𝗺𝘀 𝘄𝗶𝘁𝗵𝗼𝘂𝘁 𝘁𝗵𝗲 𝗼𝘃𝗲𝗿𝗵𝗲𝗮𝗱
ಹೆಚ್ಚುವರಿ ಹೊರೆಯಿಲ್ಲದ ಮಲ್ಟಿ-ಸ್ಟೆಪ್ ಫಾರ್ಮ್ಗಳು
ಹೆಚ್ಚಿನ ಫಾರ್ಮ್ಗಳು POST ವಿಧಾನವನ್ನು ಬಳಸುತ್ತವೆ. ಕೆಲವರು ಮಾತ್ರ GET ವಿಧಾನವನ್ನು ಬಳಸುತ್ತಾರೆ. GET ನಿಮ್ಮ URL ನ ಕೊನೆಯಲ್ಲಿ ಡೇಟಾವನ್ನು ಸೇರಿಸುತ್ತದೆ.
ಪುಟಗಳ ನಡುವೆ ಡೇಟಾವನ್ನು ವರ್ಗಾಯಿಸಲು GET ಬಳಸಿ. ಡೇಟಾವನ್ನು ಸಂಗ್ರಹಿಸಲು ನಿಮಗೆ ಬ್ಯಾಕ್ಎಂಡ್ (backend) ಅಗತ್ಯವಿಲ್ಲ. ಫೀಲ್ಡ್ಗಳನ್ನು ತೋರಿಸಲು ಅಥವಾ ಮರೆಮಾಡಲು ನಿಮಗೆ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ (Javascript) ಅಗತ್ಯವಿಲ್ಲ. ಬ್ರೌಸರ್ನ ಅಂತರ್ಗತ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಬಳಸಿ.
- ಸ್ಟ್ಯಾಟಿಕ್ ಪುಟಗಳೊಂದಿಗೆ ನಿಮ್ಮ ಫಾರ್ಮ್ ಅನ್ನು ನಿರ್ಮಿಸಿ.
- ಲಾಜಿಕ್ (logic) ಗಾಗಿ ಕ್ವೆರಿ ಸ್ಟ್ರಿಂಗ್ (query string) ಡೇಟಾವನ್ನು ಬಳಸಿ.
- ಹಿಂದಿನ ಉತ್ತರಗಳ ಆಧಾರದ ಮೇಲೆ ನಿರ್ದಿಷ್ಟ ಫೀಲ್ಡ್ಗಳನ್ನು ತೋರಿಸಿ.
ಪುಟಗಳಾದ್ಯಂತ ಡೇಟಾವನ್ನು ವರ್ಗಾಯಿಸಲು ಈ ಸ್ಕ್ರಿಪ್ಟ್ ಬಳಸಿ. ಇದು URL ನಿಂದ ಅಡಗಿರುವ (hidden) ಫೀಲ್ಡ್ಗಳನ್ನು ರಚಿಸುತ್ತದೆ.
window.onload = function() {
var querystring = window.location.href.split('?')[1];
var parameters = querystring.split('&');
for(i = 0; i < parameters.length; i++) {
var pair = parameters[i].split('=');
var hiddenfield = document.createElement("input");
hiddenfield.type = "hidden";
hiddenfield.name = pair[0];
hiddenfield.value = pair[1];
document.forms[0].appendChild(hiddenfield);
}
};
ಕೊನೆಯಲ್ಲಿ POST ರಿಕ್ವೆಸ್ಟ್ ಮೂಲಕ ನಿಮ್ಮ ಸರ್ವರ್ಗೆ ಅಂತಿಮ ಡೇಟಾವನ್ನು ಕಳುಹಿಸಿ. ಡೇಟಾ ಬ್ರೌಸರ್ನಲ್ಲೇ ಇರುತ್ತದೆ.
ಈ ಅಂಶಗಳನ್ನು ನೆನಪಿನಲ್ಲಿಡಿ:
- ಡೇಟಾ URL ನಲ್ಲಿ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತದೆ.
- ಇದನ್ನು ಪಾಸ್ವರ್ಡ್ಗಳಿಗಾಗಿ ಬಳಸಬೇಡಿ.
- ಬಳಕೆದಾರರು ತಮ್ಮ ಡೇಟಾ ಇರುವ URLಗಳನ್ನು ಹಂಚಿಕೊಳ್ಳಬಹುದು.
ಮೂಲ: https://dev.to/ovidem/multi-step-form-without-the-overhead-5bjc