String Extensions

Daha önce burada bir kısmını paylaştığım metin uzantılarını daha da geliştirdim ve String Extensions ismi ile Github’da paylaştım. Uzantıların listesi şu şekilde;

Github’da metodların nasıl kullanılabileceklerine dair küçük örnekler de bulunuyor.

“Could not set the selected property. Unspecified error.” hatası ve olası çözümü

jQuery kullandığım bir projede, seçim kutusu(select elemanı) seçeneklerini(option) değişkende saklayarak, istediğim zaman istediğim kadar kullanmayı planladım. Daha iyi anlaşılabilmesi için ufak bir kod örneği vereyim;

  var secenekler = '<option value="34">İstanbul</option><option value="6">Ankara</option><option value="35">İzmir</option>';
  $('#Baslangic').html(secenekler);
  $('#Varis').html(secenekler);

Buraya kadar bir sorun ortaya çıkmadı. Ne zaman ki, bu şekilde doldurduğum seçim kutularında bir elemanı seçili hale getirmeye çalıştım, işte o zaman Internet Explorer 6’da (IE6) garip bir hata mesajı ile karşılaştım: “Could not set the selected property. Unspecified error.” IE7, IE8, Firefox, Opera, Chrome ve Safari’de sorunsuz bir şekilde çalışırken, IE6 bu şekilde, anlaşılmaz bir hata mesajı ile beni çıkmaza soktu. Seçim yapmak için kullandığım kod öbeğini de eklersek kod örneğimiz şu hale geliyor;

  var secenekler = '<option value="34">İstanbul</option><option value="6">Ankara</option><option value="35">İzmir</option>';
  $('#Baslangic').html(secenekler).val(34);
  $('#Varis').html(secenekler).val(35);

Hata mesajının ilk bölümü, kısmen problemin neden kaynaklandığını açıklasa da ikinci bölümdeki “Belirsiz hata” ibaresi direkt olarak bir çözüme yönlenmemi engelledi. Internetlerde yaptığım ufak bir araştırma ile bu sayfada probleme ve olası bir çözüme ulaştım. Problem IE6’da DOM’un yeteri kadar hızlı çalışamamasından kaynaklanıyormuş. DOM ağacını zamanında hazırlayamadığı için, seçim yapmak istediğimizde seçim kutusunda ilgili elemanı bulamıyor ve ilgili hata mesajını ekrana basıyor.

Problemi çözmek için bir çok alternatif yöntem uygulayabilirsiniz. Problem ile ilgili bilgi bulduğum sayfadaki çözüm, try/catch bloğunu iş akışının bir parçası olarak kullandığından benim gözümde ideal bir çözüm değil. Tabi tercih size kalmış. Benzer bir durum için benim önerebileceğim çözüm şu olabilir;

  var secenekler = '<option value="34">İstanbul</option><option value="6">Ankara</option><option value="35">İzmir</option>';
  var $Baslangic = $('#Baslangic').html(secenekler);
  var $Varis = $('#Varis').html(secenekler);
  if($.browser.msie && $.browser.version === "6.0") {
    setTimeout(function() {
      $Baslangic.val(34);
      $Bitis.val(35);
    }, 1);
  }
  else {
    $Baslangic.val(34);
    $Bitis.val(35);
  }

İşin püf noktası, tarayıcı IE6 ise, seçim işlemlerini 1 milisaniyelik bir gecikme ile gerçekleştirip, bu ufacık gecikme ile DOM’a kendini toparyalabilmesi için zaman tanımak.

Alternatif olarak, imkanınız varsa, seçeneklerden seçili olmasını istediğiniz elemana da selected=”selected” özelliğini atayarak bu hatadan kaçınabilirsiniz. Bu örnekte aynı seçenekleri birden çok kez kullanacağım için ve varsayılan olarak belirli bir tanesini seçili durumda oluşturamayacağım için bu şekilde bir çözüm yoluna gittim.

JavaScript için HTML etiketleri temizleme metodu

Daha önce bahsettiğim .NET için HTML etiketleri temizleme metodunu JavaScript uygulamalarında kullanmak için düzenledim. Şöyle buyrun:

function StripTags(input)
{
  var array = [];
  var inside = false;

  for (i = 0; i < input.length; i++)
  {
    var let = input.charAt(i);
    if (let == '<')
    {
      inside = true;
      continue;
    }
    if (let == '>')
    {
      inside = false;
      continue;
    }
    if (!inside)
      array.push(let);
  }
  return array.join('');
}

valiDate v2.1

Bugün valiDate metodunu çalışma arkadaşıma gösterirken, neden doğrulama başarılı olduğunda tarih nesnesini döndürmediğim sorusu aklıma geldi. Toplam 7 byte’lık ufak bir ekleme ile, doğrulama başarılı olduğunda JavaScript tarih nesnesi döndürecek şekilde metodu güncelledim. Bu sayede metottan dönen değeri hala if ifadesi içinde kullanabilirken, isterseniz if ifadesinden önce metottan dönen değeri bir değişkene atayarak, bu değişkeni if ifadesinde kullanabilir ve doğrulamayı geçerse değişkeni tarih nesnesi olarak kullanabilirsiniz. Hatta abartıp doğrulamadan dönen değeri direkt if ifadesi içinde değişkeninize atayarak da kullanabilirsiniz.

/*
 * valiDate
 * http://www.karalamalar.net/
 *
 * Copyright (c) 2009 İzzet Emre Erkan
 * Licensed under Creative Commons Attribution-Share Alike 3.0 Unported License
 * http://creativecommons.org/licenses/by-sa/3.0/
 *
 * Date: 2010-04-16 17:08:32 +0300 (Fri, 16 Apr 2010)
 * Revision: 7
 */
String.prototype.valiDate =
  function() {
    if(/^(0[1-9]|[12][0-9]|3[01])[- /.](0[1-9]|1[012])[- /.](19|20)[0-9]{2}$/.test(this)) {
      var v = this.replace(/[- /]/g,'.').split('.');
      var d=parseInt(v[0],10), m=parseInt(v[1],10), y=parseInt(v[2],10);
      var o = new Date(y, m - 1, d);
      return o.getDate() == d && o.getMonth() + 1 == m && o.getFullYear() == y ? o : false;
    }
    else
      return false;
  }

Metodun küçültülmüş halini (647 byte) buradan edinebilirsiniz.

JavaScript kapsam ve kaplamları anlamak

Bu makalenin orijinali (Explaining JavaScript scope and closures) Robert Nyman tarafından kendi blogunda yazılmıştır. Türkçe çevirisi için kendisinden izin alınmış olup, aşağıda okuyacağınız birinci tekil şahıs yine Robert Nyman’ın kendisidir;

Javascript ile uygulama geliştirirken bir çok insanın zorluk çektiği bir konuyu açıklamaya çalışmak istedim.
Okumaya devam et JavaScript kapsam ve kaplamları anlamak