Skrip Konfirmasi Kehadiran Tamu Undangan Svelte

mrfdn.com – Pada artikel kali ini saya mencoba membuat form sederhana.

Fungsi form ini adalah untuk mengirimkan data dari aplikasi web ke Google Sheets namun kali ini menggunakan Svelte JS

Jadi langsung saja buat dulu file komponen Svelte.

Lalu pastekan kode ini pada bagian tersebut

<script>
  //export let data;

  const scriptURL =
    "https://script.google.com/macros/s/AKfycbyguZjskDwvOMge67lJXgNfFkWX9xt7orf5Hx3UyFjE3OMELyitQ3wh6jM5Vl_casdf/exec";

  let form;
  let hadir;
  let hadirberapa;
  let btnKirim;
  let btnLoading;

  function jumlahorang() 
    hadirberapa.style.display = hadir.checked ? "block" : "none";
  ;

  function konfirmasihadir() 
    form.addEventListener("submit", async (e) => 
      e.preventDefault();
      btnLoading.classList.toggle("hidden");
      btnKirim.classList.toggle("hidden");
      const formData = new FormData(form);
      const response = await fetch(scriptURL, 
        method: "POST",
        body: formData,
      );
      if (response.ok) 
        btnLoading.classList.toggle("hidden");
        btnKirim.classList.toggle("hidden");
        form.reset();
        console.log("Success!");
       else 
        console.error("Error!");
      
    );
  ;
</script>

Kemudian dibawahnya, buatlah form yang diinginkan.

<form on:submit|preventDefault=konfirmasihadir bind:this=form >
        <label 
          >Nama lengkap
          <input
            name="nama"
            type="text"
            required="required"
          />
        </label>

        <div>
          <label for="hadir" class="block >
            <input
              type="radio"
              id="hadir"
              name="konfirmasi"
              value="yes"
              bind:this=hadir
              on:click=jumlahorang
              class="text-black"
              required="required"
            />
            Ya, saya akan datang
          </label>

          <label for="tidakhadir" class="block">
            <input
              type="radio"
              id="tidakhadir"
              name="konfirmasi"
              value="no"
              on:click=jumlahorang
              required="required"
            />
            Maaf, tidak bisa datang
          </label>
        </div>

        <div
          bind:this=hadirberapa
          style="display:none"
          class="block"
        >
          <label for="floatingPassword" class="block"
            >Berapa orang?
            <input
              type="text"
              inputmode="numeric"
              pattern="[0-9]+"
              name="jumlah"
            />
          </label>
        </div>

        <div class="">
          <label for="ucapan" class="block "
            >Kirim ucapan
            <input
              name="pesan"
              type="text"
            />
          </label>
        </div>

        <button
          bind:this=btnKirim
          type="submit">Kirim</button
        >
        <button
          bind:this=btnLoading
          >Loading</button
        >
      </form>

Setelah itu silahkan simpan dan jalankan.

semoga beruntung

PakarPBN

A Private Blog Network (PBN) is a collection of websites that are controlled by a single individual or organization and used primarily to build backlinks to a “money site” in order to influence its ranking in search engines such as Google. The core idea behind a PBN is based on the importance of backlinks in Google’s ranking algorithm. Since Google views backlinks as signals of authority and trust, some website owners attempt to artificially create these signals through a controlled network of sites.

In a typical PBN setup, the owner acquires expired or aged domains that already have existing authority, backlinks, and history. These domains are rebuilt with new content and hosted separately, often using different IP addresses, hosting providers, themes, and ownership details to make them appear unrelated. Within the content published on these sites, links are strategically placed that point to the main website the owner wants to rank higher. By doing this, the owner attempts to pass link equity (also known as “link juice”) from the PBN sites to the target website.

The purpose of a PBN is to give the impression that the target website is naturally earning links from multiple independent sources. If done effectively, this can temporarily improve keyword rankings, increase organic visibility, and drive more traffic from search results.

Jasa Backlink

Download Anime Batch

Tinggalkan Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *