Bilgisayar » html https://www.bilgisayar.me Wed, 29 Aug 2018 20:31:06 +0000 tr-TR hourly 1 https://wordpress.org/?v=4.2.29 JQuery ile HTML textarea etiketinde kelime sınırlaması https://www.bilgisayar.me/index.php/2015/08/05/jquery-ile-html-textarea-etiketinde-kelime-sinirlamasi/ https://www.bilgisayar.me/index.php/2015/08/05/jquery-ile-html-textarea-etiketinde-kelime-sinirlamasi/#comments Wed, 05 Aug 2015 18:19:02 +0000 http://www.bilgisayar.me/?p=1482 DEMO]]> Jquery eklentisini sayfanıza eklemeyi unutmayın.

 
 
 

HTML

<textarea name="textarea_etiketi" id="textarea_etiketi" class="form-control karakter"></textarea>
<div class="kalan">
    Kalan <span id="kalan_karakter"></span> karakter sayısı
</div>

JQuery

<script>
var max_karakter_sayisi = 500;
(function($){
    $("#kalan_karakter").html(max_karakter_sayisi);
    $('#textarea_etiketi').bind('input propertychange', function() {
        karakterSay();
    });
    $('#textarea_etiketi').bind('keyup', null, function(e) {
        karakterSay();
    });
})(jQuery);

function karakterSay(){
    var textareaetiketi = $("#textarea_etiketi").val();
    var textareaetiketi_uzunluk = textareaetiketi.length;
    var kalan_karakter = max_karakter_sayisi - textareaetiketi_uzunluk;
    if(textareaetiketi_uzunluk <= max_karakter_sayisi)
    {
        $("#kalan_karakter")
			.html(kalan_karakter)
			.css("color", (kalan_karakter <=10 ? "#000000" : "#666"))
			.css("font-weight", 'normal');
    }
    else
    {
        $("#kalan_karakter")
			.html(kalan_karakter)
			.css("color", "#FF0000").css("font-weight", 'bold');
    }
}
</script>

Hepsi bir arada

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery ile HTML textarea etiketinde kelime sınırlaması</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<textarea name="textarea_etiketi" id="textarea_etiketi" style="width:99%; padding:5px; height:auto; line-height:1.6em;"></textarea>
<div class="kalan"> Kalan <span id="kalan_karakter"></span> karakter sayısı </div>
<script>
var max_karakter_sayisi = 500;
(function($){
    $("#kalan_karakter").html(max_karakter_sayisi);
    $('#textarea_etiketi').bind('input propertychange', function() {
        karakterSay();
    });
    $('#textarea_etiketi').bind('keyup', null, function(e) {
        karakterSay();
    });
})(jQuery);

function karakterSay(){
    var textareaetiketi = $("#textarea_etiketi").val();
    var textareaetiketi_uzunluk = textareaetiketi.length;
    var kalan_karakter = max_karakter_sayisi - textareaetiketi_uzunluk;
    if(textareaetiketi_uzunluk <= max_karakter_sayisi)
    {
        $("#kalan_karakter")
			.html(kalan_karakter)
			.css("color", (kalan_karakter <=10 ? "#000000" : "#666"))
			.css("font-weight", 'normal');
    }
    else
    {
        $("#kalan_karakter")
			.html(kalan_karakter)
			.css("color", "#FF0000").css("font-weight", 'bold');
    }
}
</script>
</body>
</html>
]]> https://www.bilgisayar.me/index.php/2015/08/05/jquery-ile-html-textarea-etiketinde-kelime-sinirlamasi/feed/ 0 Bir HTML tablosundan PHP kullanarak MYSQL veritabanından birden fazla satır nasıl silebilir veya güncelleyebilirim? https://www.bilgisayar.me/index.php/2015/07/16/bir-html-tablosundan-php-kullanarak-mysql-veritabanindan-birden-fazla-satir-nasil-silebilir-veya-guncelleyebilirim/ https://www.bilgisayar.me/index.php/2015/07/16/bir-html-tablosundan-php-kullanarak-mysql-veritabanindan-birden-fazla-satir-nasil-silebilir-veya-guncelleyebilirim/#comments Thu, 16 Jul 2015 19:46:45 +0000 http://www.bilgisayar.me/?p=1131 YÜKLE DEMO]]> “Tümünü Seç” onay kutusunu tıklayarak birden fazla onay kutusunu kaldırmak/seçmek ve aynı zamanda MYSQL veritabanından verileri silmek için kullanılabileceğiniz basit uygulama.

 

 
 
 

index.php

JQUERY

<script>
(function($){
    // Bütün onay kutularını seç
    $(document).on("click","#hepsinisec",function(){
        $('input:checkbox').not(this).prop('checked', this.checked);
    });
    // Button tıklandı
    $(document).on("click","#kaldir",function(){
        $(this).html('<i class="fa fa-trash"></i> Kaldırılıyor...');
        var onaykutu = $('input[name="onaykutusu[]"]:checked');
        var enazbironay = onaykutu.length > 0;
        if (enazbironay <= 0) {
            alert("En az bir onay kutusu seçmelisiniz");
            return false;
        } else {
            $.ajax({ 
                type: "POST", 
                url: "ajax.php",
		data: "onay=onay&" + onaykutu.serialize(), 
		success: function(html){
		    if (onaykutu){ 
			onaykutu.closest("tr").slideUp();
		    }
		    $("#kaldir").html('<i class="fa fa-trash"></i> Kaldır');
		}
	    });
	}
    });	
})(jQuery);
</script>

HTML

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table">
  <thead>
    <tr>
    <th width="5%"><input type="checkbox" name="hepsinisec" id="hepsinisec" /></th>
    <th width="5%">NO</th>
    <th width="23%">Isim</th>
    <th width="67%">Soyad</th>
  </tr></thead>
  <tbody>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="1"/></td>
    <td>1</td>
    <td>Hakan</td>
    <td>Atılgan</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="23" /></td>
    <td>2</td>
    <td>Murat</td>
    <td>Yalçın</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="423" /></td>
    <td>3</td>
    <td>Mustafa</td>
    <td>Ermiş</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="33" /></td>
    <td>4</td>
    <td>Süleyman</td>
    <td>Solak</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="22" /></td>
    <td>5</td>
    <td>Tayyip</td>
    <td>Erdoğan</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="44" /></td>
    <td>6</td>
    <td>Doğan</td>
    <td>Kartal</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="onaykutusu[]" id="onaykutusu[]" value="12" /></td>
    <td>7</td>
    <td>Kemal</td>
    <td>Saglam</td>
  </tr>
    </tbody>
</table>
<button class="btn btn-info" id="kaldir"><i class="fa fa-trash"></i> Kaldır</button>

ajax.php

<?PHP
if (isset($_POST) && $_POST['onay'] == 'onay'){
    /*$arr = implode(",",$_POST['onaykutusu']);
    $sql = "DELETE FROM tablo WHERE id IN (".$arr.")";
    $mysqli->query($sql);*/

    //veya
    /*foreach($_POST['onaykutusu'] as $v){
        $sql = "DELETE FROM tablo WHERE id = ".$v;
        $mysqli->query($sql);
    }*/
}
?>
]]> https://www.bilgisayar.me/index.php/2015/07/16/bir-html-tablosundan-php-kullanarak-mysql-veritabanindan-birden-fazla-satir-nasil-silebilir-veya-guncelleyebilirim/feed/ 0 Şehir İsimlerini Açılır Menüde Listelemek https://www.bilgisayar.me/index.php/2015/06/20/sehir-isimlerini-acilir-menude-gostermek/ https://www.bilgisayar.me/index.php/2015/06/20/sehir-isimlerini-acilir-menude-gostermek/#comments Sat, 20 Jun 2015 08:16:27 +0000 http://www.bilgisayar.me/?p=677 Sadece kopyala-yapıştırmanız yeterlidir.

<select>
  <option value="1">Adana</option>
  <option value="2">Adıyaman</option>
  <option value="3">Afyon</option>
  <option value="4">Ağrı</option>
  <option value="68">Aksaray</option>
  <option value="5">Amasya</option>
  <option value="6">Ankara</option>
  <option value="7">Antalya</option>
  <option value="75">Ardahan</option>
  <option value="8">Artvin</option>
  <option value="9">Aydın</option>
  <option value="10">Balıkesir</option>
  <option value="74">Bartın</option>
  <option value="72">Batman</option>
  <option value="69">Bayburt</option>
  <option value="11">Bilecik</option>
  <option value="12">Bingöl</option>
  <option value="13">Bitlis</option>
  <option value="14">Bolu</option>
  <option value="15">Burdur</option>
  <option value="16">Bursa</option>
  <option value="17">Çanakkale</option>
  <option value="18">Çankırı</option>
  <option value="19">Çorum</option>
  <option value="20">Denizli</option>
  <option value="21">Diyarbakır</option>
  <option value="81">Düzce</option>
  <option value="22">Edirne</option>
  <option value="23">Elazığ</option>
  <option value="24">Erzincan</option>
  <option value="25">Erzurum</option>
  <option value="26">Eskişehir</option>
  <option value="27">Gaziantep</option>
  <option value="28">Giresun</option>
  <option value="29">Gümüşhane</option>
  <option value="30">Hakkari</option>
  <option value="31">Hatay</option>
  <option value="76">Iğdır</option>
  <option value="32">Isparta</option>
  <option value="34">İstanbul</option>
  <option value="35">İzmir</option>
  <option value="46">Kahramanmaraş</option>
  <option value="78">Karabük</option>
  <option value="70">Karaman</option>
  <option value="36">Kars</option>
  <option value="37">Kastamonu</option>
  <option value="38">Kayseri</option>
  <option value="79">Kilis</option>
  <option value="71">Kırıkkale</option>
  <option value="39">Kırklareli</option>
  <option value="40">Kırşehir</option>
  <option value="41">Kocaeli</option>
  <option value="42">Konya</option>
  <option value="43">Kütahya</option>
  <option value="44">Malatya</option>
  <option value="45">Manisa</option>
  <option value="47">Mardin</option>
  <option value="33">Mersin</option>
  <option value="48">Muğla</option>
  <option value="49">Muş</option>
  <option value="50">Nevşehir</option>
  <option value="51">Niğde</option>
  <option value="52">Ordu</option>
  <option value="80">Osmaniye</option>
  <option value="53">Rize</option>
  <option value="54">Sakarya</option>
  <option value="55">Samsun</option>
  <option value="63">Şanlıurfa</option>
  <option value="56">Siirt</option>
  <option value="57">Sinop</option>
  <option value="73">Şırnak</option>
  <option value="58">Sivas</option>
  <option value="59">Tekirdağ</option>
  <option value="60">Tokat</option>
  <option value="61">Trabzon</option>
  <option value="62">Tunceli</option>
  <option value="64">Uşak</option>
  <option value="65">Van</option>
  <option value="77">Yalova</option>
  <option value="66">Yozgat</option>
  <option value="67">Zonguldak</option>
</select>

DEMO

]]> https://www.bilgisayar.me/index.php/2015/06/20/sehir-isimlerini-acilir-menude-gostermek/feed/ 0 Ülke para birimleri açılır menüsünde listeleme https://www.bilgisayar.me/index.php/2015/06/20/ulke-para-birimleri-acilir-menusunde-listeleme/ https://www.bilgisayar.me/index.php/2015/06/20/ulke-para-birimleri-acilir-menusunde-listeleme/#comments Sat, 20 Jun 2015 07:46:55 +0000 http://www.bilgisayar.me/?p=812 <select> <option value="EUR">Avro €</option> <option value="AUD">Avusturalya Dolari $</option> <option value="BGN">Bulgaristan Levası лв</option> <option value="CNY">Çin Yuanı ¥</option> <option value="PHP">Filipin Pesosu ₱</option> <option value="GHC">Gana Sedisi ¢</option> <option value="KRW">Güney Kore Wonu ₩</option> <option value="IRR">İran Riyali ﷼</option> <option value="ILS">İsrail Şekeli ₪</option> <option value="JPY">Japon Yeni ¥</option> <option value="NGN">Nigerya Nairası ₦</option> <option value="MNT">Moğol Tugrik ₮</option> <option value="MKD">Makedonia Dinarı ден</option> <option value="OMR">Umman Riyali ﷼</option> <option value="QAR">Katar Riyali ﷼</option> <option value="GBP">İngiliz Sterlin ₺</option> <option value="PLN">Polonya Zlotisi zł</option> <option value="RSD">Sırbistan Dinarı Дин.</option> <option value="SAR">Suudi Arabistan Riyali ﷼</option> <option value="THB">Tayland Bahtı ฿</option> <option value="TRY">Turkiye Lirası ₺</option> <option value="UAH">Ukrayna Grivnası ₴</option> <option value="VND">Viet Nam Dong ₫</option> <option value="YER">Yemen Riyali ﷼</option> </select> Demo

]]> https://www.bilgisayar.me/index.php/2015/06/20/ulke-para-birimleri-acilir-menusunde-listeleme/feed/ 0 Yaklaşan Doğum Günü Widget’ i https://www.bilgisayar.me/index.php/2015/06/19/yaklasan-dogum-gunu-widget-i/ https://www.bilgisayar.me/index.php/2015/06/19/yaklasan-dogum-gunu-widget-i/#comments Sat, 20 Jun 2015 00:33:04 +0000 http://www.bilgisayar.me/?p=643 YÜKLE]]> Uygulamalarınızda veya gösterge panelinde, bu widget’ i kullanıp, kullanıcılarınızı diğer üyelerinizin doğum günleri hakkında bilgilendirebilirsiniz.

 

 
 
dogumgunu

]]> https://www.bilgisayar.me/index.php/2015/06/19/yaklasan-dogum-gunu-widget-i/feed/ 0 HTML datalist etiketini kullanarak, basit bir açılır menü oluşturma https://www.bilgisayar.me/index.php/2015/06/15/html-datalist-etiketini-kullanarak-basit-bir-acilir-menu-olusturma/ https://www.bilgisayar.me/index.php/2015/06/15/html-datalist-etiketini-kullanarak-basit-bir-acilir-menu-olusturma/#comments Mon, 15 Jun 2015 23:45:54 +0000 http://www.bilgisayar.me/?p=629 <Datalist> etiketi <input> elemanı içinde önceden tanımlanmış seçenekler listesini belirtir. Normal seçenekler listesinin aksine, input elementine bir değer girilmesinide sağlar. Formlarda oldukça kullanışlıdır.

<input list="browsers">

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

<datalist> etiketi Internet Explorer 10, Firefox, Opera, and Chrome tarayıcılarınca desteklenmektedir.

DEMO:
 https://www.bilgisayar.me/index.php/2015/06/15/html-datalist-etiketini-kullanarak-basit-bir-acilir-menu-olusturma/feed/ 0