Cihan Topcu » MOOTOOLS

Easy javascript AJAX with Mootools

Cihan Topcu — Sat, 28 Mar 2009 12:34:04 +0000

We most used Ajax requests the following snippet of code will make your life easier. Mootools “Request” function is used in this code. The next article in this function we’ll see how ASP.NET.

Sensei = {};
Sensei.Send = function(URL, fName, prms, retryCount, OnComplete) {
	if (retryCount == null) retryCount = 0;
	var jsonRequest = new Request(
		{
                'encoding' : 'utf-8',
		method: 'post',
		url: URL,
		onComplete:  OnComplete,
		onFailure: function(){
					if(retryCount<3)
						Sensei.Send(URL, fName, prms, OnComplete, retryCount++);
		},
       }).send('m=' + fName + '&' + prms);
};

How to use :

Sensei.send("service/serviceurl.ashx","doIt","cId=5&bId=5",0, function(result){
      alert(result);
});

Mootools kullanarak kolay javascript AJAX

Cihan Topcu — Thu, 26 Mar 2009 17:23:33 +0000

Bolca kullanığımız AJAX requestleri (post) için aşağıdaki kod parçası hayatınızı kolaylaştıracaktır. Mootools “Request” fonksiyonu kullanılmaktadır. Daha sonraki yazılarda bu fonksiyonu ASP.NET ile nasıl kullanabileceğimizi göreceğiz.

Sensei = {};
Sensei.Send = function(URL, fName, prms, retryCount, OnComplete) {
	if (retryCount == null) retryCount = 0;
	var jsonRequest = new Request(
		{
                'encoding' : 'utf-8',
		method: 'post',
		url: URL,
		onComplete:  OnComplete,
		onFailure: function(){
					if(retryCount<3)
						Sensei.Send(URL, fName, prms, OnComplete, retryCount++);
		},
       }).send('m=' + fName + '&' + prms);
};

Kullanımı :


Sensei.send("service/serviceurl.ashx","doIt","cId=5&bId=5",0, function(result){
      alert(result);
});

Select box styling with mootools (fake combo)

Cihan Topcu — Mon, 23 Mar 2009 17:44:17 +0000

As you know, ‘select box’ is a special control and its style cannot be changed very much. For example the height property can be changed in Firefox, but it can’t be changed in IE. Instead of creating a formal select box, our aim is to create a virtual select box whose properties can be adjusted. It should only include HTML codes, so it will give the same result in all browsers.

This select box also changes all the select boxes automatically when you add JS and CSS into the page. Using this component is totaly up to your talent.

Working Model: It scans all the select boxes in your page. It hides adding the “Multiple” tag. It inserts a

into its location and shows the real select box when it is clicked that you made “Multiple”. Thus you can select the items in your real select box.

Working Example : http://www.cihantopcu.com/samples/fakecombo/index.html

For download : http://www.cihantopcu.com/samples/fakecombo/fakecombo.rar

This control based to http://www.cult-f.net/2007/12/14/elselect/

Mootools ile özel select box (fake combo)

Cihan Topcu — Mon, 23 Mar 2009 14:57:51 +0000

Bildiğiniz gibi select box özel bir kontroldür ve görünümü çok fazla değiştirilemez. Örneğin “heigth” özelliği firefox da değişmesine rağmen ie de değişmez. Amacımız select box ların yerine tüm görsel özellikleriyle oynayabileceğimiz, sadece html kodlarından oluştuğu için tüm browser larda aynı sonucu veren sanal select box oluşturmaktır. Öyle bir select box ki js yi ve css i sayfaya eklediğinizde tüm select box ları otomatik değiştiriyor. Yerleştirmek sizin yeteneğinize kalmış.

Çalışma şekli : Sayfanızda bulunan tüm select box ları tarıyor, “multiple” tag ı ekleyerek gizliyor. Bulunduğu konuma

ekliyor ve tıklandığında “multiple” hale getirdiğiniz gerçek select box unuzu gösteriyor. Böylece gerçek select box unuzdaki item larınızı seçiyorsunuz.

Çalışan örnek için : http://www.cihantopcu.com/samples/fakecombo/index.html

İndirmek için : http://www.cihantopcu.com/samples/fakecombo/fakecombo.rar

Bu kontrol http://www.cult-f.net/2007/12/14/elselect/ adresindeki kontrol optimize edilerek yeniden yazılmıştır.