O zaman hoşgeldin diyelim :) Kategorileri seçerken dikkat edersen çok daha mutlu oluruz ^^ soruna gelecek olursak
input mask olayını istiyorsan bunun için yazılmış pluginler var, yeniden yazmak yerine onları tercih edebilirsin
https://github.com/RobinHerbots/Inputmask (en popüleri)
jquery kütüphanesi ve eklenti dosyasını çağırdıktan sonra istediğin örnekleri şöyle elde edebilirsin
$('.elem').inputmask("0(599) 999 99 99")
$('.elem2').inputmask("99:99")
$('.elem3').inputmask("99-99-9999")
kısaca senin x dediğin yerlere eklentide 9 koyuyoruz. Eğer harf yazsınlar dersen 9 yerine a koyabilirsin. Hem harf hem sayı dersende 9-a koyabilirsin senin x dediğin değerlere. İstersen daha fazla kullanımına eklenti dökümanından bakabilirsin.
Demo: https://codepen.io/tayfunerbilen/pen/abJrbYa
Eğer ben sadece valid olup olmadığını kontrol etmek istiyorum diyorsan şöyle bir şey de olabilir
<form action="" novalidate="novalidate">
<input type="text" placeholder="0(5xx) xxx xx xx" pattern="0\(5[0-9]{2}\) [0-9]{3} [0-9]{2} [0-9]{2}" required />
<input type="text" placeholder="xx:xx" pattern="[0-9]{2}:[0-9]{2}" required />
<input type="text" placeholder="xx-xx-xxxx" pattern="[0-9]{2}-[0-9]{2}-[a-z]{4}" required />
</form>
<style>
input {
outline: 0;
}
input:invalid {
border-color: red;
}
input:valid {
border-color: green;
}
</style>
belli kelimeleri mi sansürlemek istiyorsun? verdiğin örnekte lo kelimesi gibi. eğer öyleyse en basiti
const str = 'hello23232323'
console.log(str.replace(/lo/, '****'));
istediğiniz konuları listelerken eğer bir yanıt varsa bunu başında YNT: olarak belirtmek mi? ona göre bir sql kodu paylaşacağım çünkü
is_numeric() ile değeri kontrol edip eğer true dönüyorsa geriye (float) olarak döndürebilirsin. Örnek bir fonksiyon;
function convertData($data) {
return array_map(function($value) {
if (is_numeric($value)) return (float) $value;
return $value;
}, $data);
}
kullanırkende
$data = [
'toplam' => '109.51',
'tarih' => '2021-05-03',
'paraBirimi' => 'TRY',
'tesisatNo' => '',
'zaman' => '18:54:38',
'odenecek' => '118.27',
'vergi' => '8.76',
'gonderimSekli' => 'KAGIT'
];
var_dump(convertData($data));
/*
array(8) {
["toplam"]=>
float(109.51)
["tarih"]=>
string(10) "2021-05-03"
["paraBirimi"]=>
string(3) "TRY"
["tesisatNo"]=>
string(0) ""
["zaman"]=>
string(8) "18:54:38"
["odenecek"]=>
float(118.27)
["vergi"]=>
float(8.76)
["gonderimSekli"]=>
string(5) "KAGIT"
}
*/
// ya da json çıktısı
echo json_encode(convertData($data));
/*
{
"toplam": 109.51,
"tarih": "2021-05-03",
"paraBirimi": "TRY",
"tesisatNo": "",
"zaman": "18:54:38",
"odenecek": 118.27,
"vergi": 8.76,
"gonderimSekli": "KAGIT"
}
*/
buna neyin sebep olduğundan emin değilim, başka kodlar etkiliyor olabilir ama en kötü ihtimalle min ve max değerleride ekleyip sabitleştirebilirsin.
img {
--image-size: 50px; /* boyutu buradan ayarla */
width: var(--image-size);
min-width: var(--image-size);
max-width: var(--image-size);
height: var(--image-size);
min-height: var(--image-size);
max-height: var(--image-size);
border-radius: 50%;
}
javascript dosyanı sayfanın en altında çağırman gerekiyor ya da yukarıda çağıracaksan şu kodların içinde yazman lazım;
document.addEventListener('DOMContentLoaded', function(){
// kodların
});
bu açıkçası gördüğüm tüm pwa uygulamalarında olan bir sorun, twitter'ın uygulamasını aynı şekilde indirip denersen ondada tema değiştirdiğimizde aynı problem oluyor.
muhtemelen bir bug ve yakın zamanda bir düzenleme gelecektir.
en basit haliyle
<table border="1" width="100%">
<thead>
<tr>
<th>ID</th>
<th>Başlık</th>
<th>Durum</th>
</tr>
</thead>
<tbody>
<tr data-id="1">
<td>1</td>
<td>Başlık 1</td>
<td class="status"></td>
</tr>
<tr data-id="2">
<td>2</td>
<td>Başlık 2</td>
<td class="status"></td>
</tr>
<tr data-id="3">
<td>3</td>
<td>Başlık 3</td>
<td class="status"></td>
</tr>
</tbody>
</table>
<button id="get-request-btn">Sorgula</button>
<style>
tr.error td {
background: orangered;
color: #fff;
}
tr.success td {
background: green;
color: #fff;
}
</style>
ve javascript tarafın
let total = $('table tbody tr').length,
current = 0
$('#get-request-btn').on('click', () => {
if (current + 1 < total) {
getRequest(current);
}
});
function getRequest(current) {
const tr = $('table tbody tr:eq(' + current + ')');
const id = tr.data('id');
$.post('ajax.php', {id}, function(response) {
tr.find('td:last').text(response.status);
if (response.statusCode == 1) {
tr.addClass('error');
} else {
tr.addClass('success');
}
if (current < total) {
getRequest(current);
}
}, 'json');
current += 1;
}
php tarafın
<?php
sleep(1);
$id = $_POST['id'];
$status = ['Başarılı', 'Hata!'];
$statusCode = rand(0,1);
echo json_encode([
'id' => $id,
'status' => $status[$statusCode],
'statusCode' => $statusCode
]);
bunları kendine göre uyarlamak sana kalmış :)
burada .container için sabit bir genişliğin olması lazım, diğer türlü esnemeye devam edecektir.