Patter ile input'a site adresi girdirmek!

27-01-2023, 02:11:42

Merhaba.

<input type="text" pattern="" required="">

Domain adresi girilen bir input için,
- İçinde Türkçe karakter geçtiğinde uyarı vermesi,
- İçinde nokta geçmediğinde uyarı vermesi,

için nasıl bir pattern yazabilirim?

27-01-2023, 02:29:51

#2

Misafir

Merhaba

Doğru anladıysam

<input type="text" pattern="^[a-zA-Z0-9.]+$" required>

bu pattern sadece a.z 0.9 ve nokta içereceği geri kalan herşeyi reddedeceğini kontrol eder.

27-01-2023, 11:47:34

#3

Alaca

Misafir adlı üyeden alıntı: mesajı görüntüle

Merhaba

Doğru anladıysam

<input type="text" pattern="^[a-zA-Z0-9.]+$" required>

bu pattern sadece a.z 0.9 ve nokta içereceği geri kalan herşeyi reddedeceğini kontrol eder.

Hocam ol olmadı ama şöyle anlatayım:

İçinde
- Türkçe karakter geçtiğinde kabul etmeyecek
- İçinde nokta olmazsa yine kabul etmeyecek.

28-01-2023, 00:49:59

#4

Misafir

Alaca adlı üyeden alıntı: mesajı görüntüle

Hocam ol olmadı ama şöyle anlatayım:

İçinde
- Türkçe karakter geçtiğinde kabul etmeyecek
- İçinde nokta olmazsa yine kabul etmeyecek.

anladım teşekkür ederim. 3 farklı yöntem var fakat bence en uygun stil bu olabilir dilerseniz bunu beğenirseniz biraz daha özelleştirebilirim.
veya direkt yazar yazmaz hata vermeden sildirebiliriz. bir başka yöntem ise ufak üstten gelen bir hata mesaj kutusu ama pek yakıştıramıyorum sitelere.
umarım işinize yarar.

<form>
  <input type="text" id="username" onkeyup="checkCharacters(event)"/>
  <div id="error-message" style="color:red;"></div>
</form>

<script>
  function checkCharacters(event) {
    var input = document.getElementById("username");
    var errorMessage = document.getElementById("error-message");
    var inputValue = input.value;
    var validCharacters = /^[a-zA-Z\.]+$/;
    if (!validCharacters.test(inputValue)) {
      errorMessage.innerHTML = "Türkçe karakterler kullanılamaz. Lütfen sadece harfler ve noktalar kullanın.";
      input.value = inputValue.replace(/[^a-zA-Z\.]/g, "");
    } else {
      errorMessage.innerHTML = "";
    }
  }
</script>

28-01-2023, 00:58:30

#5

Misafir

Misafir adlı üyeden alıntı: mesajı görüntüle

anladım teşekkür ederim. 3 farklı yöntem var fakat bence en uygun stil bu olabilir dilerseniz bunu beğenirseniz biraz daha özelleştirebilirim.
veya direkt yazar yazmaz hata vermeden sildirebiliriz. bir başka yöntem ise ufak üstten gelen bir hata mesaj kutusu ama pek yakıştıramıyorum sitelere.
umarım işinize yarar.

<form>
  <input type="text" id="username" onkeyup="checkCharacters(event)"/>
  <div id="error-message" style="color:red;"></div>
</form>

<script>
  function checkCharacters(event) {
    var input = document.getElementById("username");
    var errorMessage = document.getElementById("error-message");
    var inputValue = input.value;
    var validCharacters = /^[a-zA-Z\.]+$/;
    if (!validCharacters.test(inputValue)) {
      errorMessage.innerHTML = "Türkçe karakterler kullanılamaz. Lütfen sadece harfler ve noktalar kullanın.";
      input.value = inputValue.replace(/[^a-zA-Z\.]/g, "");
    } else {
      errorMessage.innerHTML = "";
    }
  }
</script>

birde böyle basit bir kod var hangisi hoşunuza giderse.

<form>
    <input type="text" id="username" name="username" pattern="[a-zA-Z.]+" title="Lütfen sadece harfler ve noktalar kullanın.">
    <input type="submit" value="Submit">
</form>

28-01-2023, 01:45:56

#6

Alaca

Misafir adlı üyeden alıntı: mesajı görüntüle

anladım teşekkür ederim. 3 farklı yöntem var fakat bence en uygun stil bu olabilir dilerseniz bunu beğenirseniz biraz daha özelleştirebilirim.
veya direkt yazar yazmaz hata vermeden sildirebiliriz. bir başka yöntem ise ufak üstten gelen bir hata mesaj kutusu ama pek yakıştıramıyorum sitelere.
umarım işinize yarar.

<form>
  <input type="text" id="username" onkeyup="checkCharacters(event)"/>
  <div id="error-message" style="color:red;"></div>
</form>

<script>
  function checkCharacters(event) {
    var input = document.getElementById("username");
    var errorMessage = document.getElementById("error-message");
    var inputValue = input.value;
    var validCharacters = /^[a-zA-Z\.]+$/;
    if (!validCharacters.test(inputValue)) {
      errorMessage.innerHTML = "Türkçe karakterler kullanılamaz. Lütfen sadece harfler ve noktalar kullanın.";
      input.value = inputValue.replace(/[^a-zA-Z\.]/g, "");
    } else {
      errorMessage.innerHTML = "";
    }
  }
</script>

Hocam emek harcamışsınız teşekkür ederim. Bu Türkçe karakterler için uyarı veriyor ama tam istediğim şekle sokamadım. Ama şimdilik bu işimi gördü. Teşekkür ederim.