Build A survey form | freecodecamp

 

Buat Formulir Survei

Tujuan: Bangun aplikasi yang fungsinya mirip dengan https://survey-form.freecodecamp.rocks

Cerita Pengguna:

     Anda harus memiliki judul halaman dalam elemen h1 dengan id judul
     Anda harus memiliki penjelasan singkat dalam elemen p dengan id deskripsi
     Anda harus memiliki elemen formulir dengan id formulir survei
     Di dalam elemen formulir, Anda diharuskan memasukkan nama Anda di kolom input yang memiliki id nama dan jenis teks
     Di dalam elemen formulir, Anda diminta untuk memasukkan email Anda di kolom input yang memiliki id email
     Jika Anda memasukkan email yang tidak diformat dengan benar, Anda akan melihat kesalahan validasi HTML5
     Di dalam formulir, Anda dapat memasukkan nomor di kolom input yang memiliki id nomor
     Masukan angka tidak boleh menerima non-angka, baik dengan mencegah Anda mengetiknya atau dengan menunjukkan kesalahan validasi HTML5 (bergantung pada browser Anda).
     Jika Anda memasukkan angka di luar rentang masukan angka, yang ditentukan oleh atribut min dan max, Anda akan melihat kesalahan validasi HTML5
     Untuk bidang input nama, email, dan nomor, Anda dapat melihat elemen label yang sesuai dalam formulir, yang menjelaskan tujuan setiap bidang dengan id berikut: id="nama-label", id="label-email", dan id="nomor-label"
     Untuk bidang input nama, email, dan nomor, Anda dapat melihat teks placeholder yang memberikan deskripsi atau petunjuk untuk setiap bidang
     Di dalam elemen form, Anda harus memiliki elemen dropdown pilih dengan id dropdown dan setidaknya dua opsi untuk dipilih
     Di dalam elemen formulir, Anda dapat memilih opsi dari grup yang terdiri dari setidaknya dua tombol radio yang dikelompokkan menggunakan atribut nama
     Di dalam elemen formulir, Anda dapat memilih beberapa bidang dari rangkaian kotak centang, yang masing-masing harus memiliki atribut nilai
     Di dalam elemen form, Anda disajikan dengan textarea untuk komentar tambahan
     Di dalam elemen formulir, Anda disajikan tombol dengan id kirim untuk mengirimkan semua masukan

Penuhi cerita pengguna dan lewati semua tes di bawah untuk menyelesaikan proyek ini. Berikan gaya pribadi Anda sendiri. Selamat Coding!

Catatan: Pastikan untuk menambahkan <link rel="stylesheet" href="styles.css"> di HTML Anda untuk menautkan stylesheet dan menerapkan CSS Anda.

 

Silahkan merapat ke website dibawah ini, untuk melihat contoh project:

https://survey-form.freecodecamp.rocks/ 

 

 

Tes

Menunggu: Anda harus memiliki elemen h1 dengan id judul.
Menunggu: #judul Anda tidak boleh kosong.
Menunggu: Anda harus memiliki elemen p dengan id deskripsi.
Menunggu: #deskripsi Anda tidak boleh kosong.
Menunggu: Anda harus memiliki elemen formulir dengan id formulir survei.
Menunggu: Anda harus memiliki elemen input dengan id nama.
Menunggu: #nama Anda harus memiliki jenis teks.
Menunggu: #nama Anda harus memerlukan masukan.
Menunggu: #nama Anda harus turunan dari #survey-form.
Menunggu: Anda harus memiliki elemen input dengan id email.
Menunggu: #email Anda harus memiliki jenis email.
Menunggu: #email Anda harus meminta masukan.
Menunggu: #email Anda harus turunan dari #survey-form.
Menunggu: Anda harus memiliki elemen input dengan id nomor.
Menunggu: #nomor Anda harus turunan dari #formulir survei.
Menunggu: #nomor Anda harus memiliki jenis nomor.
Menunggu: #nomor Anda harus memiliki atribut min dengan nilai numerik.
Menunggu: #nomor Anda harus memiliki atribut maks dengan nilai numerik.
Menunggu: Anda harus memiliki elemen label dengan id label nama.
Menunggu: Anda harus memiliki elemen label dengan id label email.
Menunggu: Anda harus memiliki elemen label dengan id label nomor.
Menunggu: #label nama Anda harus berisi teks yang menjelaskan masukan.
Menunggu: #label-email Anda harus berisi teks yang menjelaskan masukan.
Menunggu: #nomor-label Anda harus berisi teks yang menjelaskan masukan.
Menunggu: #label-nama Anda harus turunan dari #form-survey.
Menunggu: #label-email Anda harus turunan dari #formulir-survei.
Menunggu: #nomor-label Anda harus turunan dari #survey-form.
Menunggu: #nama Anda harus memiliki atribut dan nilai placeholder.
Menunggu: #email Anda harus memiliki atribut dan nilai placeholder.
Menunggu: #nomor Anda harus memiliki atribut dan nilai placeholder.
Menunggu: Anda harus memiliki bidang pilih dengan id dropdown.
Menunggu: #dropdown Anda harus memiliki setidaknya dua elemen opsi yang dapat dipilih (bukan dinonaktifkan).
Menunggu: #dropdown Anda harus turunan dari #survey-form.
Menunggu: Anda harus memiliki setidaknya dua elemen masukan dengan jenis radio (tombol radio).
Menunggu: Anda harus memiliki setidaknya dua tombol radio yang merupakan turunan dari #survey-form.
Menunggu: Semua tombol radio Anda harus memiliki atribut nilai dan nilai.
Menunggu: Semua tombol radio Anda harus memiliki atribut nama dan nilai.
Menunggu: Setiap grup tombol radio harus memiliki setidaknya 2 tombol radio.
Menunggu: Anda harus memiliki setidaknya dua elemen masukan dengan jenis kotak centang (kotak centang) yang merupakan turunan dari #survey-form.
Menunggu: Semua kotak centang Anda di dalam #survey-form harus memiliki atribut nilai dan nilai.
Menunggu: Anda harus memiliki setidaknya satu elemen textarea yang merupakan turunan dari #survey-form.
Menunggu: Anda harus memiliki input atau elemen tombol dengan id kirim.
Menunggu: #kirim Anda harus memiliki jenis kiriman.
Menunggu: #submit Anda harus turunan dari #survey-form.