18 Kasım 2016 Cuma

Asp.Net Mvc ActionName Attribute Kullanımı

Yorum Bırak
asp.net mvc actionname attribute kullanımı

Asp.Net Mvc projelerimizde kullandığımız Action Metodların isimleri client tarafından ajax istekleri ile çağırılarak metodun döndürdüğü cevaplar UI kısmına yansıtılır.


public class StudentController : Controller
{

public StudentController()
{

}

[ActionName("find")]
public ActionResult GetById(int id)
{
// get student from the database
return Json(true);
}
}

Örneğin yukarıdaki kısımda normalde GetById metodunu bu isimle direk olarak client tarafından çağırabiliriz. Ancak yukarıda verdiğimiz ActionName attribute ile bu metodu GetById ismi ile değil de find ismi ile çağırabiliyoruz.

 Örneğin bu istek yerine  http://localhost/student/getbyid/1
http://localhost/student/find/1 bu istek ile metodu çağırıyoruz.
Yazıyı Oku

Asp.Net Mvc Yönlendirme (Routing) İşlemleri

2 yorum
Asp.Net Web Forms uygulamalarında her url bir .aspx  dosyası ile eşleşiyordu. Örneğin; www.codefixes.xyz/merhaba.aspx url'si bir merhaba.aspx dosyası ile bağlantılıydı.

Asp.Net Routing kavramını tanımlıyarak, her url'nin bir fiziksel dosya ile ilişkişendirilmesi zorunluluğunu ortadan kaldırmış oldu. Routing sadece Mvc frameworküne ait bir kavram değildir, aynı zamanda Asp.Net WebForms uygulamaları ile de kullanılabilir.

Route işlemi bir url pattern oluşturur ve bu patternları bir RouteTable'da tutarak Routing işlemi ile hangi dosyanın çağırılacağına karar verir. İşlem şemasını aşağıdan inceleyebilirsiniz:

asp.net mvc routing işlemleri

Her Mvc uygulaması en azından bir tane route konfigürasyonu içermelidir. Mvc frameworkü tarafından bu App_Start klasörü altında RouteConfig class dosyası içerisinde varsayılan olarak oluşturulmaktadır.

 public class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}
}
Yukarıda görüldüğü gibi yoksayılacak url bilgisi ve varsayılan olarak oluşturulan konfigürasyonu inceleyebilirsiniz.  Buradaki konfigürasyon sonucunda bir controllera bağlı bir action metodu çağrılabilir ve eğer varsa bir id parametresi bu metoda pass edilebilir. Aynı yukarıdaki gibi, farklı yapılarda url bilgileriniz varsa siz de kendi konfigürasyonununuzu buraya yazabilirsiniz. Routing mekanizması, sizin yazacağınız konfigürasyon ile eşleşen bir url isteği gelmesi halinde otomatik olarak bu konfigürasyon bilgilerini kullanacaktır.

Varsayılan olarak gelen yukarıdaki konfigürasyona örneğin aşağıdaki gibi bir istek gelebilir:

www.codefixes.xyz/Home/Index/2

Bu kısımda kırmızı ile yazılan Home bizim Controller ismimizi içermektedir, Index kısmı bu controller içerisindeki Action metodumuzun ismidir, 2 ise bizim routing konfigürasyonumuzda belirttiğimiz isteğe bağlı id parametresidir. Yukarıdaki varsayılan konfigürasyonla eşleşecek farklı url örneklerini aşağıdan inceleyebilirisiniz:

URLControllerActionId
http://localhost/homeHomeControllerIndexnull
http://localhost/home/index/123HomeControllerIndex123
http://localhost/home/aboutHomeControllerAboutnull
http://localhost/home/contactHomeControllerContactnull
http://localhost/studentStudentControllerIndexnull
http://localhost/student/edit/123StudentControllerEdit123

Route Kısıtlamaları

Yönlendirme yaparken verdiğimiz parametreler için bazı kısıtlamaları RouteConfig dosyasında konfigürasyon oluştururken verebiliriz:

  routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Login", action = "Index", id = UrlParameter.Optional },
constraints: new { id = @"\d+" }
);
Örneğin bu konfgürasyonda id parametesinin sadece nümerik parametre alabileceğiniz constraints kısmında belirttik.

Route konfigürasyonlarmızı belirttikten sonra bunu uygulama başlangıcında (Application_Start() metodunda) Global.asax dosyasında register ediyoruz:

protected void Application_Start()
{
RouteConfig.RegisterRoutes(RouteTable.Routes);
}
Yazıyı Oku

4 Kasım 2016 Cuma

Asp.Net Mvc Proje Dosya Yapısı

Yorum Bırak
Bir önceki yazımızda Asp.Net Mvc ile proje oluşturma konusuna bakmıştık. Yazıyı okumak isteyenler buradan ulaşabilirler. Bu yazımızda da oluşturulan projenin dosya yapısını inceleyeceğiz. Yani hangi klasörde neler oluşturuyor Visual Studio ve bunlar ne işe yarıyor onlara bakacağız.

Visual studio'da bir Mvc projesi açıldığında Visual Studio aşağıdaki proje yapsını oluşturuyor.

.net mvc app_data klasörü

Oluşturulan klasörlere bakacak olursak:

App_Data: Bu klasör LocalDB, .mdf dosyalar, xml dosyalar vb. gibi uygulama veri dosyalarını içeren klasördür.

App_Start: Bu klasör uygulama başladığında çalışacak olan class dosyalarını içerir. Genellikle bunlar AuthConfig.cs, BundleConfig.cs, FilterConfig.cs, RouteConfig.cs gibi config dosyaları olur. MVC 5 varsayılan olarak BundleConfig.cs, FilterConfig.cs and RouteConfig.cs dosyalarını içerir.

.net mvc app_start klasörü
Content: Bu klasör de css dosyaları, resim dosyaları, iconlar gibi statik dosyaları içerir. MVC 5 uygulaması bootstrap.css, bootstrap.min.css ve Site.css dosyalarını varsayılan olarak içerir.

asp.net mvc content klasörü

Controllers: Bu klasör controller class dosyalarını içerir. Controller kullanıcı requestlerini alır işler ve cevabı döner.  Bu dosyaların isminin sonu "Controller" ile biter.

asp.net mvc controllers klasörü

fonts: Bu klasör uygulama fontlarınu içerir. Uygulamamızda özel bir font kullanacaksak buraya ekleyebiliriz.

asp.net mvc fonts klasörü

Models: Bu klasör model class dosyalarını içerir. Eğer bir entity framework gibi bir orm kullanacaksanız ve çok katmanlı bir mimari yapısında olmayacaksa projeniz, entity framework dosyalarını burada barındırabilisiniz.

Script: Bu klasör javascript dosyalarını ve varas VBscript dosyalarını içerir. MVC 5 bootstrap, jquery ve modernizer için javascript dosyalarını varsayılan olarak projeye ekler.

asp.net mvc script klasörü

Views: Bu klasör html dosyalarını içerir.  Bu dosya genelde cshtml dosyasıdır, aynı zamanda içerisine projenizin diline göre C# veya VB.NET kodları da yazabilirsiniz. (Razor syntax). Eğer controller kısmınıza ait bir view dosyası oluşturulacaksa, controllerın isminde (örn; "DenemeController" ise "Deneme" adında), views klasörü altında bir klasör açılır ve ilgili view dosyaları bu klasör altına eklenir.

asp.net Mvc klasörü


Ek olarak Mvc kök dizinde Global.asax, Packages.config, Web.config gibi projesi bazı dosyalar da içerir.

Global_asax: Bu dosya uygulamanın çalışma zamanlarına ait metodları içerir. Bunlar; Application_BeginRequest, application_start, application_error, session_start, session_end vb. dir.

Packages.config: Bu config dosyası Nuget tarafından yönetilen paketlerin versiyon ve yüklü olan paket bilgilerini içerir.

Web.config: Uygulama katmanındaki config bilgilerini içerir. Bazı ayarlarda sıklıkla kullanılan bid dosyadır. Örneğin; requestin  maksimum boyutunu ayarlama vs.

Diğer yazılarda görüşmek üzere...

Yazıyı Oku

3 Kasım 2016 Perşembe

Asp.Net Mvc Projesi Oluşturma

Yorum Bırak
Bu bölümde Visual Studio 2013 kullanarak bir Mvc projesi oluşturmayı göreceğiz. Bu anlatım Visual Studio 2013 for Web Express sürümü ve Mvc v5.2 üzerinden anlatılacaktır. Visual Studio 2013 for Web Update 4 versiyonunu buradan indirebilirsiniz.

Programlarımızı yüklendikten sonra sistemimiz hazırsa, Visual Studio'yu açıyoruz ve başlangıç sayfasındaki New Project linkine tıklıyoruz. İstersek File menüsü altından New Project diyerek de yeni projemizi oluşturabiliriz.

yeni asp.net mvc projesi

Açılan New Project dialoğundan Visual C# kısmını aşağı doğru açıyoruz ve buradan Web kısmının altında bulunan Asp.Net Web Application projesini seçiyoruz ve aşağıdaki textbox kısmından projemizin adını veriyoruz. Eğer istiyorsanız projemizin oluşturulacağı yeri de Browse seçeneğinden istenilen yeri seçerek değiştirebilirsiniz. OK deyip devam ediyoruz.

yeni asp.net web uygulaması

Açılan New ASP.NET Project diyaloğundan MVC seçeneğini seçiyoruz. Mvc seçeneğini seçtiğimizde bize taslak bir uygulama açılacak. İçerisinde üyelik vs bulunmakta. Ama eğer ben uygulamamı sıfırdan kendim başlatacağım diyorsanız Empty seçeneğini seçerek boş bir MVC uygulaması açabilirsiniz. Biz MVC seçeneğini seçip devam ediyoruz.

asp.net mvc proje taslağı



Biz su anda bir authentication istemediğimizden dolayı, Change Authentication kısmından No Authentication seçeneğini seçiyoruz. OK deyip Visual Studio'nun projeyi hazırlamasını biraz bekledikten sonra projemiz hazır duruma gelecektir.

.net mvc authentication

ilk asp.net mvc projemiz

Şimdi projeyi debug modda açmak istiyorsak F5'e, debug mod olmadan başlatmak istiyorsak ctrl+F5'e basıyoruz ve projemiz derlendikten sonra browser üzerinde açılacaktır.

mvc projesini çalıştırma

MVC 5 proje taslağı bootstrap 3.0 versionun javascript ve css dosyalarını default olarak içerir. Ekranı küçültüp büyüttüğümüzde proje taslağının responsive olduğunu göreceksiniz. Örneğin, menü kısmı mobil cihazlarda aşağıdaki gibi görünecektir.

mvc proje taslağı mobil görünüm

Böylece ilk Asp.Net MVC 5 projemizi Visual Studio 2013 kullanarak oluşturmuş olduk. Diğer yazılarda devam etmek üzere...
Yazıyı Oku

2 Kasım 2016 Çarşamba

Asp.Net Mvc'ye Giriş

Yorum Bırak
Asp.Net Mvc'ye Giriş

Mvc tasarım deseni yazılım  dünyasında uzun bir süredir var. Mvc uygulamamızı 3 ana kısıma ayırmakta. Bunlar Model, View ve Controller. Baş harfleri zaten Mvc kısaltmasını oluşturmaktadır. Bu kısımları inceleyecek olursak:

Model: Model kısmı verimizin sunulduğu kısım diyebiliriz. İstersek bu kısımda veritabanımıza bağlantı kısmında bir ORM mekanizması olan entity framework gibi yapıları da kullanabiliriz.

View: Bu kısım da kullanıcının arayüzde gördüğü client kısmıdır. Dropdownlar, inputlar, button gibi UI kısmındaki kontrollerimiz burda bulunur.

Controller: Controller kısmı da requestlerimizi alan kısımdır. Kulannıcı View kısmı ile muhatap olur, burdan yaptığı işlemler ile Controller kısmına istek yollar ve Controller da isteğe göre sonuçlar döndürür. Aslında View kısmının sonucunu döndüren de Controller'dır.

Mvc mimarisini bir şekil üzerinde görecek olursak:

Kullanıcının ilk andan itibaren siteye girdiğindeki işlemleri göz önünde bulunduracak olursak, kullanıcı browser'a bir url yazıyor ve burdan server ilgili Controller'a yönleniyor ve eğer Controller veri ile alakalı bir işlem varsa Model ile iletişime geçip işlemlerini yaptıktan sonra kullanıcının browser'a yazdığı url'ye ait View bu controller tarafından döndürülüyor ve kullanıcı somut olarak ekranı karşısında görüyor. Umarım Mvc'nin çalışma prensibi hakkında faydalı bilgiler verebilmişimdir.

Asp.Net Mvc ile örnek proje oluşturma yazısına buradan  ulaşabilirsiniz.

Yazıyı Oku

.Net Mvc Tarih Formatlama

Yorum Bırak
.net mvc tarih formatlama

Modelimizde aşağıdaki gibi bir datetime property'miz olsun.

public Nullable<System.DateTime> BaslangicTarihi { get; set; }
Bu tarihi view kısmında gün/ay/yıl şeklinde formatlayarak göstermek istiyoruz. Bunun için view kısmımızdaki bu BaslangicTarihi property'mizi bind ettiğimiz textboxfor inputumuzu aşağıdaki şekilde düzenleyebiliriz:

@Html.TextBoxFor(m => m.BaslangicTarihi, "{0:dd/MM/yyyy}")
Yazıyı Oku

1 Kasım 2016 Salı

.Net Mvc String Result Döndürme

Yorum Bırak
.Net Mvc String Result Döndürme

Asp.Net Mvc projelerimizde controller tarafında sadece string döndürmek istiyorsak ContentResult kullanabiliriz:

public ActionResult Temp() {
return Content("Merhaba Dünya!");
}
ContentResult default olarak  text/plain  döndürür.
Yazıyı Oku

.Net Mvc ile Basit Dosya Yükleme İşlemi (File Upload)

Yorum Bırak
.Net Mvc ile Basit Dosya Yükleme İşlemi (File Upload)

.Net Mvc projelerimizde basit bir şekilde dosya yükleme işlemi yapmak istiyorsak aşağıdaki işlemleri takip edebiliriz:

Öncelikle view kısmında dosya yükleme inputlarının görünmesini istediğimiz yere aşağıdaki kodu koyuyoruz:

@using (Html.BeginForm("Index", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<input type="file" name="file" />
<input type="submit" value="Dosya Yükle" />
}

Daha sonra view ile ilgili controllera gidip (yukarıda Home/Index olduğundan,burada HomeController olacak) aşağıdaki parametreli metodu ekliyoruz:


[HttpPost]
public ActionResult Index(HttpPostedFileBase file)
{
// Verify that the user selected a file
if (file != null && file.ContentLength > 0)
{
// extract only the filename
var fileName = Path.GetFileName(file.FileName);
// store the file inside ~/App_Data/uploads folder
var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);
file
.SaveAs(path);
}
// redirect back to the index action to show the form once again
return RedirectToAction("Index");
}

işlemimiz tamam. Burda yapılan işlemi kısaca özetleyecek olursak, view tarafında inputlarımız ekledik ve "dosya yükle" buttonuna basıldığında formu HomeController'daki parametreli Index  metoduna post ettik ve burda da dosya null ve boş değilse projemiz içerisindeki App_Data klasörü içerisindeki uploads klasörüne dosyamızı yüklemiş olduk. İşlem sonucunda da tekrar Home/Index sayfasına yönlendirme yapmış olduk.
Yazıyı Oku

Javascript'te Json Serialize ve Deserialize İşlemleri

Yorum Bırak
Javascript'te Json Serialize ve Deserialize İşlemleri


Javascript kullanarak verilerimizi json formatına serialize etmek istiyorsak aşağıdaki örneklerden faydalanabiliriz:

JSON.stringify({});                  // '{}'
JSON.stringify(true); // 'true'
JSON.stringify('foo'); // '"foo"'
JSON.stringify([1, 'false', false]); // '[1,"false",false]'
JSON.stringify({ x: 5 }); // '{"x":5}'

JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))
// '"2006-01-02T15:04:05.000Z"'

JSON.stringify({ x: 5, y: 6 });
// '{"x":5,"y":6}' or '{"y":6,"x":5}'
JSON.stringify([new Number(1), new String('false'), new Boolean(false)]);
// '[1,"false",false]'

JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });
// '{"x":[10,null,null,null]}'
gördüğümüz gibi verilen verilerin serialize edilmiş hallerini yukarıda görebilirsiniz.

Elimizde json verisi varsa ve yukarıdakinin tam aksine bunu deserialize etmek istiyorsak da aşağıdaki örneklerden faydalanbiliriz:

JSON.parse('{}');              // {}
JSON.parse('true'); // true
JSON.parse('"foo"'); // "foo"
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
JSON.parse('null'); // null
Kaynak:mozilla.org
Yazıyı Oku

Jquery Kullanarak Tablonun Sonuna Yeni Satır Eklemek

Yorum Bırak
Jquery Kullanarak Tablonun Sonuna Yeni Satır Eklemek


Varolan bir html tablosunun sonuna jquery kullarak yeni bir satır eklemek için aşağıdaki kodlardan durumumuza uygun olan birisini kullanabiliriz:

Eğer tablomuz aşağıdaki gibi tbody içeriyorsa;

<table id="myTable">
<tbody>
<tr>...</tr>
<tr>...</tr>
</tbody>
</table>
aşağıdaki kodu kullanabiliriz:

$('#myTable > tbody:last-child').append('<tr>...</tr>');
burada son satırın altına yeni bir satır eklenecektir. 3 nokta ile olan yere de sütünlarımızı ekleyebiliriz isteğimize göre.


Eğer tablomuz aşağıdaki gibi tbody içermiyorsa;

<table id="myTable">
<tr>...</tr>
<tr>...</tr>
</table>
aşağıdaki kodu kullanabiliriz:

$('#myTable tr:last').after('<tr>...</tr>');
burada son satırın altına yeni bir satır eklenecektir. 3 nokta ile olan yere de sütünlarımızı ekleyebiliriz isteğimize göre.


Yazıyı Oku

31 Ekim 2016 Pazartesi

Javascript Kullanarak Kullanıcının Mobil Cihazdan Giriş Yapıp Yapmadığını Kontrol Etme

Yorum Bırak
javascript mobil cihaz saptama

Günümüzde websitelerine mobil cihazlardan giriş yapma oranı çok yükselmiş durumda. Bunun için de websitesi gelişiricileri mobil cihazlarda daha okunabilir ve kullanışlı olması açısından, mobil cihazlara özel tasarım geliştirmekteler. Bazı durumlarda kullanıcının mobil cihazdan girip girmediğini kontrol etmemiz gerekebilir. Bunun için aşağıdaki kodu kullanabiliriz:

var isMobile = false; //false olarak tanımlıyoruz
// aygıt tanımlama işlemi
if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent)
|| /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0,4)))
{
//buraya girdiyse mobil cihazıdır
isMobile
= true;
}
Yazıyı Oku

Jquery ile Bir Elementin Spesifik Bir Class'a Sahip Olup Olmadığını Kontrol Etme

Yorum Bırak
Jquery ile Bir Elementin Spesifik Bir Class'a Sahip Olup Olmadığını Kontrol Etme

Jquery kullanarak bir elementin bir class'a sahip olup olmadığını kontrol etmek için hasClass metodunu kullanabiliriz. Örneğin;

$( "#elementID" ).hasClass( "classIsmi" );
Yazıyı Oku

Jquery ile Dinamik Olarak Oluşturulan Inputlara Event Bind Edilmesi

Yorum Bırak
Jquery ile Dinamik Olarak Oluşturulan Inputlara Event Bind Edilmesi

Web sayfalarımızda bazı kontrolleri dinamik olarak oluşturmak zorunda kalabiliriz. Örneğin ajax sonucunda gelen bir veriyi div tagleri içerisinde body içerisine append etme gibi bir ihtiyaç olduğunu düşünelim. Bu append ettiğimiz içerisinde de input type'ı button olan bazı button'larımız olsun. Bunların click eventlerini yazma ihtiyacımız olabilir. Bunu normal olarak ;

$("#buttonID").click(function(){})
 şeklinde tanımlarsak, bu click eventi çalışmayabilir. Bunu için, dinamik olarak oluşturulan bu buttonların click eventini aşağıdaki gibi bind edebiliriz:

$("#buttonID").on("click", ".myDiv", function(){
//buttona tıklandığında ne olacağını burda yazabiliriz

});
Yukarıdaki işlem myDiv classı içerisindeki element id'si buttonID olan  inputun click eventidir. Bu event içerisine buttona tıklandığında yapılması istenen işlemleri yazıyoruz.
Yazıyı Oku

28 Ekim 2016 Cuma

Javascript Math Objesi Kullanımı

Yorum Bırak
javascript matematiksel işlemler

Javascript Math objesi sayılarla matematiksel işlemleri yapmamızı sağlar. Bu yazıda Math objesinin bazı metodlarını ve sabit değerlerini göreceğiz.

Math.PI;            // 3.141592653589793 pi sayısını döndürür

Math.round(4.7);    // sayıyı yukarı yuvarlar ve 5 döndürür

Math.round(4.4);    // sayıyı aşağı yuvarlar ve  4 döndürür


Math.pow(8,2);      // 8 in karesini alır ve 64 döndürür

Math.sqrt(64);      // 64 ün karekökünü alır ve 8 döndürür

Math.abs(-4.7);     // -4.7 sayısının mutlak değeri olan 4.7 yi döndürür

Math.ceil(4.4);     // yukarı doğru yuvarlanmış en yakın tam sayı olan 5                          döndürür

Math.floor(4.7);    // aşağı doğru yuvarlanmış en yakın tam sayı olan 4                          döndürür

Math.min(01503020, -8, -200);  // en küçük olan -200 ü döndürür

Math.max(01503020, -8, -200);  // en büyük olan 150 yi döndürür

Math.random();     // 0 la 1 arası random sayı döndürür (0 dahil 1 değil)



Yazıyı Oku