menangkap nilai item yang dipilih dari daftar drop-down pilih yang dibuat dari file teks menggunakan jquery
Saya memiliki file teks yang berisi beberapa kata sederhana seperti: make, this, work.
Saya ingin memuat file teks dan membuat daftar drop-down pilih dinamis darinya. Ketika pengguna mengklik kirim, itu mencetak nilai item yang dipilih.
Di bawah ini adalah kodenya, saya menggunakan handle bar untuk merender halaman kepada pengguna. Ketika pengguna mengklik tombol kirim, itu masuk ke indeks / tampilan untuk melihat apa yang mereka pilih.
Alih-alih mencetak nilai sebenarnya dari opsi yang dipilih, itu mencetak indeks opsi yang dipilih, bukan nilainya.
<form method="post" action="index/display" id = "first" name="first">
<fieldset>
<div style="display: inline-block; margin-left:10px ">
<legend>Selecting items from text file</legend>
<script type="text/javascript" src="js/jquery.js"></script>
<script>
$.get("js/pytxt.txt", function(data) { /*alert( "Data Loaded: " );*/ var options = data.split(','), $select = $('select#value'); for (var i = 0; i < options.length; i++) { $select.append('<option value="' + i + '">' + options[i] + '</option>"');
console.log ($select)};
});
</script>
<p>
<label></label>
<select id = "value" name="first">
<option selected value="base">Please Select</option>
</select>
</p>
</div>
<p>
<input type="submit">
</p>
</fieldset>
Ini adalah fungsi posting:
app.post('/index/display', (req, res) => {
res.status(200).send('POST works!' + req.body.first);
});
Jawaban
Harap ganti:
$select.append('<option value="' + i + '">' + options[i] + '</option>"');
Dengan baris ini:
$select.append('<option value="' + options[i] + '">' + options[i] + '</option>"');
Ini seharusnya memperbaiki masalah Anda.
Anda dapat sedikit menyederhanakannya dengan melakukan:
options.forEach(v => $select.append( new Option(v, v)))
Demo:
let options = 'one,two,three,four'.split(','), $select = $('#value'); options.forEach(v => $select.append( new Option(v, v)))
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="value"></select>