$.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) { }
});
.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.
<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="https://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="https://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>
<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.
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;
}
Ekrandaki verilerin “screenshots” almak için kullanılır.
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
<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();
}
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.