JavaScript Note
Basic maniputation:
‘value’ property usually us same to the text appears on the component.
$(‘#buttonaa’).val(‘454’);
# to catch id
. to catch class
==============================================
GET PARAMETER BY NAME:
function getParameterByName(name) {
name = name.replace(/[\[]/, “\\[“).replace(/[\]]/, “\\]”);
var regex = new RegExp(“[\\?&]” + name + “=([^&#]*)”),
results = regex.exec(location.search);
return results === null ? “” : decodeURIComponent(results[1].replace(/\+/g, ” “));
}
==============================================
GET ELEMENT BY NAME:
$(‘td[name=tcol1]’) // matches exactly ‘tcol1’
$(‘td[name^=tcol]’) // matches those that begin with ‘tcol’
==============================================
BOOTBOX WITH CALL BACK:
bootbox.confirm(“Are you sure?”, function(result) {
Example.show(“Confirm result: “+result);
});
==============================================
NEAT WINDOW:
function neatWindow(url) {
// Set height and width
var NewWinHeight = 500;
var NewWinWidth = 700;
// Place the window
var NewWinPutX = ($(window).width() – NewWinWidth) / 2;
var NewWinPutY = ($(window).height() – NewWinHeight) / 2;
TheNewWin = window.open(url, ‘TheNewpop’, ‘fullscreen=no,toolbar=no,location=no,
directories=no,tatus=no,menubar=no,
scrollbars=yes,resizable=yes’);
//TheNewWin.resizeTo(NewWinWidth, NewWinHeight);
//TheNewWin.moveTo(NewWinPutX, NewWinPutY);
}
==============================================
GET WINDOW SIZE:
GET$(window).height()
==============================================
USAGE OF JSON:
object to Json:
stringfy(obj);
Json string to Object:
Json.phras(json)
==============================================
GENERATE COMPONENTS AT WEB SIDE:
function AddComponents(fSet) {
var TargetDiv = document.getElementById(‘ =divTarget.ClientID );
for (i = 0; i < fSet.length; i++) {
var checkbox = document.createElement('input');
var place = document.createElement('p');
place.setAttribute('align', 'center')
checkbox.setAttribute('type', 'checkbox');
checkbox.setAttribute('id', fSet[i].ID);
var lbl = document.createElement('Label');
lbl.innerHTML = fSet[i].Name;
TargetDiv.appendChild(place);
place.appendChild(checkbox);
place.appendChild(lbl);
}
}
EXAMPLE2:
var checkbox = document.createElement('input');
var place = document.createElement('p');
place.setAttribute('align', 'center')
checkbox.setAttribute('type', 'checkbox');
checkbox.setAttribute('id', fSet[i].ID);
var lbl = document.createElement('Label');
lbl.innerHTML = fSet[i].Name;
TargetDiv.appendChild(place);
place.appendChild(checkbox);
place.appendChild(lbl);
==============================================
NORMAL AJAX FUNCTION:
$.ajax({
type: "POST",
url: 'ajax_event.aspx/generateFunction',
data: '{cateID:"1"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var fSet = JSON.parse(response.d);
AddComponents(fSet);
},
failure: function (response) {
alert(response.d);
}
});
==============================================
EXAMPLE OF JSON ARRAY:
var array = [];
var r = new Object();
r.CategoryID = $(this).attr('id');
r.RoleID = $(this).find(":selected").val();
array.push(r);
==============================================
SIMPLE WAY TO REFRESH:
window.location.href = 'document.URL';
==============================================
The way to previous page:
javascript:history.back();
==============================================
how to use Javescript to call method from server:
function tr() {
__doPostBack(‘LinkButton1’, ”);
}
Server:
protected void LinkButton1_Click(object sender, EventArgs e)
{
Response.Write(“這是server端的程式”);
}
==============================================
default button style in bootstrap:
btn btn-default
btn btn-primary
btn btn-success
btn btn-info
btn btn-warning
btn btn-danger
btn btn-link
http://getbootstrap.com/css/#buttons
==============================================
redirect site by javascript:
window.location.href = ‘http://www.google.com’;
==============================================
modify css by javascript:
$(‘.page-content-wrapper .page-content’).css(‘margin-left’, ’25px’);
==============================================
$ is not defined/found:
jQuery未成功載入,可能是檔名、路徑的錯誤