arşiv

‘JavaScript’ kategorisi için arşiv

ajax post

Pazartesi, 13 Kas 2017 yorum yok
$.ajax({
             url: "http://www.yk.com/Insert",
             type: "POST",
             dataType: "json",
             contentType: 'application/json; charset=utf-8',
             data: JSON.stringify({
                        Code: 123,
                        Data: "data",
                        Comment: ""
             }),
                    success: function (data) { }
 });

 

Categories: JavaScript, jQuery Tags: ,

Jquery Favico Plugin – favico.js

Cuma, 25 Kas 2016 yorum yok

.Bu plugin sayesinde favico olarak resim,video,webcam koyabiliyoruz.Ayrıca favico üzerine sayısal olarak bildirim sayısı da yazdıra biliyoruz ve dinamik olarak değiştire biliyoruz.Tüm ayarları için http://lab.ejci.net/favico.js/ buraya bakabilirsiniz.

Categories: JavaScript Tags:

SweetAlert

Perşembe, 06 Eki 2016 yorum yok

Online Pdf, Excel v.s. Download

Çarşamba, 21 Eyl 2016 yorum yok
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta name="robots" content="noindex, nofollow">
	<meta name="googlebot" content="noindex, nofollow">
	<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.3.js"></script>
	<link rel="stylesheet" type="text/css" href="/css/result-light.css">
	<script type="text/javascript" src="http://www.cloudformatter.com/Resources/Pages/CSS2Pdf/Script/xepOnline.jqPlugin.js"></script>
	<style type="text/css"></style>
	<title>@cloudformatter template</title>
</head>
<body>
  <div id="buttons">
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'download'})">PDF</button>
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'download', mimeType:'application/postscript'})">Postscript</button>
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'download', mimeType:'application/vnd.ms-xpsdocument'})">XPS</button>
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'embed', mimeType:'image/svg+xml'})">SVG</button>
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'embed', mimeType:'image/png'})">PNG @120dpi</button>
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'embed', mimeType:'image/jpg', resolution:'60'})">JPG @60dpi</button>
	  <button onclick="return xepOnline.Formatter.Format('JSFiddle', {render:'embed', mimeType:'image/gif', resolution:'30'})">GIF @30dpi</button>
  </div>
	<hr>
	<div id="JSFiddle">
		<!-- Insert your document here -->
		<header style="display:none;margin-top:20px;"><p>Add your header</p></header>     
		<footer style="display:none"><p>Add your header</p></footer>  
		<h1>Create a Document Here</h1>
	 </div>
</body>
</html>

http://www.cloudformatter.com/

Categories: JavaScript, jQuery Tags: ,

FileSaver.js

Pazar, 04 Eyl 2016 yorum yok
<script src="FileSaver.js"></script>
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
saveAs(blob, "hello world.txt");

Detaylı bilgi ve örneklere https://github.com/eligrey/FileSaver.js sayfasından ulaşabilirsiniz.

Categories: JavaScript Tags:

Javascript base64encode(input)

Cumartesi, 03 Eyl 2016 yorum yok
function base64encode(input) {
	var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
	var output = "";
	var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
	var i = 0;
	input = utf8Encode(input);
	while (i < input.length) {
	  chr1 = input.charCodeAt(i++);
	  chr2 = input.charCodeAt(i++);
	  chr3 = input.charCodeAt(i++);
	  enc1 = chr1 >> 2;
	  enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
	  enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
	  enc4 = chr3 & 63;
	  if (isNaN(chr2)) {
		enc3 = enc4 = 64;
	  } else if (isNaN(chr3)) {
		enc4 = 64;
	  }
	  output = output +
			  keyStr.charAt(enc1) + keyStr.charAt(enc2) +
			  keyStr.charAt(enc3) + keyStr.charAt(enc4);
	}
	return output;
}
function utf8Encode(string) {
	string = string.replace(/\x0d\x0a/g, "\x0a");
	var utftext = "";
	for (var n = 0; n < string.length; n++) {
	  var c = string.charCodeAt(n);
	  if (c < 128) {
		utftext += String.fromCharCode(c);
	  }
	  else if ((c > 127) && (c < 2048)) {
		utftext += String.fromCharCode((c >> 6) | 192);
		utftext += String.fromCharCode((c & 63) | 128);
	  }
	  else {
		utftext += String.fromCharCode((c >> 12) | 224);
		utftext += String.fromCharCode(((c >> 6) & 63) | 128);
		utftext += String.fromCharCode((c & 63) | 128);
	  }
	}
	return utftext;
}

 

Categories: JavaScript Tags:

html2canvas

Cumartesi, 03 Eyl 2016 yorum yok

Ekrandaki verilerin "screenshots" almak için kullanılır.

http://html2canvas.hertzen.com/

Categories: JavaScript, jQuery Tags: ,

Export HTML Table to CSV TXT JSON XML SQL XLS DOC PNG PDF

Cumartesi, 03 Eyl 2016 yorum yok

Installation

To save the generated export files on client side, include:

<script type="text/javascript" src="libs/FileSaver/FileSaver.min.js"></script>

To export the table as a PDF file the following includes are required:

<script type="text/javascript" src="libs/jsPDF/jspdf.min.js"></script>
<script type="text/javascript" src="libs/jsPDF-AutoTable/jspdf.plugin.autotable.js"></script>

To export the table in PNG format, you need to include:

<script type="text/javascript" src="libs/html2canvas/html2canvas.min.js"></script>

To generate the export file in the desired format, finally include:

<script type="text/javascript" src="tableExport.min.js"></script>

Please keep this include order.

https://github.com/hhurz/tableExport.jquery.plugin

 

Categories: JavaScript, jQuery Tags: ,

Sayfa Yükleniyor…..

Çarşamba, 10 Ağu 2016 yorum yok
<div id="divLoading" style="display:none; z-index: 10002;">
    <div class="jtable-busy-panel-background" style="left:0; top:0; margin:0; width: 100%; height: 100%;"></div>
    <div style="position: fixed; top: 45%; left: 45%;">
        <i class="fa fa-refresh fa-spin fa-5x fa-fw margin-bottom"></i>
    </div>
</div>
$(document).ajaxStart(function () {
    onBegin();
});

$(document).ajaxStop(function (event, request, settings) {
    onComplete();
});
function onBegin() {
    $("#divLoading").show();
}
 
function onComplete() {
    $("#divLoading").hide();
}

 

https://www.javascripting.com/

Cuma, 22 Tem 2016 yorum yok
Categories: bestURL, JavaScript, jQuery Tags: ,

HTML5 Data Attribute

Cuma, 20 May 2016 yorum yok

Bu yazımca kısaca HTML5 ile birlikte gelen data attritube kullanımından bahsedeceğim.

Bu attribute sayesinde HTML elemanları üzerinde (div, button, input vb.) istediğiniz bir veriyi(datayı) tutabiliyorsunuz.

Data atrritube kullanımı şu şekildedir.

data-data_adi=”data_degeri

“data-” yazımından dan sonra oluşturacağınız data attribute’e istediğiniz bir ismi verebilir ve içerisine string formatında istediğiniz veriyi doldurabilirsiniz. Bir html elemanı üzerinde istediğiniz kadar data attribute kullanabilirsiniz. Tanımlama yaparken büyük harf kullanmamaya özen gösteriniz, yazım standartlarına aykırı ve bazen çalışmayabiliyor.

Örnek vermek gerekirse bir ürün listemiz var diyelim. Site ziyaretçileri “Satın Al” butonuna tıkladıklarında satın alma işlemi gerçekleşecek.

<table>
 <tr>
 <th>Urun Adı></th>
 <th>İşlem</th>
</tr>
<tr>
 <td>Microsoft Lumia 640XL</td>
 <td><input type="button" value="Satın Al" data-urunid="14"></td>
</tr>
<tr>
 <td>LG G4</td>
 <td><input type="button" value="Satın Al" data-urunid="15"></td>
</tr>
<tr>
 <td>Apple iPhone 6</td>
 <td><input type="button" value="Satın Al" data-urunid="16"></td>
</tr>
</table>

Yukarıdaki gibi bir yapıda müşterilerimiz “Satın Al” butonuna bastıklarında hangi ürünü satın almak istediklerini anlamak için ilgili ürünün ID değerine ulaşmam gerekecek. Örnekte olduğu gibi bunu data-urunid alanını oluşturarak tuttum.

Şimdi jQuery kullanarak data nesnesine nasıl ulaşabileceğime bakalım.

var urunID= $(this).data('urunid'); // veya $(this).attr('data-urunid');

Sadece jQuery kullanarak değil direk olarak javascript ile de hatta ilgili buttonlara runat=”server” vererek C# tarafında da bu data attributelerine ulaşabilirsiniz.

Kaynak: http://www.sinanbozkus.com/html5-data-attribute/

Categories: JavaScript Tags: