Jquery İletişim Formu

Jquery İletişim Formu

October 29th, 2009

admin

Web sistemlerimizde yer alan iletişim formlarını jquery ve ajax ile daha görsel ve kullanışlı bir hale getirebiliriz. Bu örneğimizde buton veya linke tıklanıldığında iletişim formumuz ekrana geliyor ve gerekli alanların doğruluk kontrolü yapılarak eposta yoluyoruz.Bu iletişim formu SimpleModal üzerine kurulmuştur. OnOpen, onShow ve onClose geriçağırımlarının kullanımı yanı sıra SimpleModal ile Ajax kullanımı gösterir.

İndex.html kodlarımız

<!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=iso-8859-9" />
<link type='text/css' href='css/contact.css' rel='stylesheet' media='screen' />
</head>
    <div id='contact-form' align="center"><h2>Gumusluoglu.Com Jquery İletişim Formu Örneği</h2>

    <input type='button' name='contact' value='İletişim Formu' class='contact demo'/> or <a href='#' class='contact'>İletişim Formu</a>
    </div>
    <!-- Load JavaScript files -->
    <script type='text/javascript' src='js/jquery.js'></script>
    <script type='text/javascript' src='js/jquery.simplemodal.js'></script>
    <script type='text/javascript' src='js/contact.js'></script>
<body>
</body>
</html>

Uygulama dosyalarını zip şeklinde indirmek için tıklayınız.
Uygulamanın çalışır demosunu incelemek için tıklayınız.