In this script it tries to do so that when you choose the date and the given format it shows. Of course, something is wrong with validation . If the "Select date format" option is selected, it will show an error. If you choose the other 2 formats, normally you should do
var nazwamiesiecy = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var nazwadni = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
let input = document.querySelector("input");
let guzik = document.querySelector("button");
guzik.addEventListener("click", () => {
event.preventDefault();
let wybranaData = new Date(input.value);
let format = document.querySelectorAll("select").value
let opcja1 = document.querySelectorAll("option")[0].value
let opcja2 = document.querySelectorAll("option")[1].value
let opcja3 = document.querySelectorAll("option")[2].value
if (!input.value) {
alert("Enter the date");
return;
}
if (!opcja1) {
alert("Enter the date format")
return;
}
if (!opcja2) {
document.getElementById("dataa").innerHTML = wybranaData.getDate() + " " + nazwamiesiecy[wybranaData.getMonth()] + " " + wybranaData.getFullYear().toString() + " roku";
return;
}
if (!opcja3) {
document.getElementById("dataaa").innerHTML = wybranaData.getDate() + "." + wybranaData.getMonth() + "." + wybranaData.getFullYear().toString();
return;
}
})
<form name="">
<div>
<label for="txtnum1">Date: </label>
<input type="date" name="txtnum1" id="txtnum1">
</div>
<label for="sztos">Date format: </label>
<select name="sztos" id="sztos">
<option value="">Choose a date format</option>
<option value="op">12/04/2000</option>
<option value="xd">12 April 2000</option>
</select>
<button type="submit">Calculate</button>
<div id="dataa"></div>
<div id="dataaa"></div>
</form>
var nazwamiesiecy = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var nazwadni = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
let input = document.querySelector("input");
let guzik = document.querySelector("button");
let dataa = document.getElementById("dataa")
guzik.addEventListener("click", (event) => {
event.preventDefault();
if (!input.value) {
alert("Enter the date");
return;
}
let format = document.querySelector("select").value
if (!format) {
alert("Enter the date format")
return;
}
let wybranaData = new Date(input.value);
let dateString = "";
if (format === "xd") {
dateString = wybranaData.getDate() + " " + nazwamiesiecy[wybranaData.getMonth()] + " " + wybranaData.getFullYear() + " roku";
} else if (format === "op") {
dateString = wybranaData.getDate() + "/" + wybranaData.getMonth() + "/" + wybranaData.getFullYear();
}
dataa.innerHTML = dateString;
})
<form name="">
<div>
<label for="txtnum1">Date: </label>
<input type="date" name="txtnum1" id="txtnum1">
</div>
<label for="sztos">Date format: </label>
<select name="sztos" id="sztos">
<option value="">Choose a date format</option>
<option value="op">dd/mm/yyyy</option>
<option value="xd">dd MMMMMM yyyy</option>
</select>
<button type="submit">Calculate</button>
<div id="dataa"></div>
</form>