Archive

Archive for the ‘Scripts’ Category

jquery no space allowed in username input

dùng javascript, jquery xóa bỏ khoảng trắng với các các field đăng nhập như username input text


var username = $('#username').val();
var username = username.replace(/\s+/g, '');
$('#username').val(username);

Chúc các bạn thành công

nhantam
thiet ke web

Advertisements

Jquery serialize form id

Khi các bạn submit form bằng method serialize của jquery và chỉ định form id thì làm như sau:


form id="frm_contact"
.... html input tag

Jquery javascript:


var f = $("form#frm_contact");
            
			$.ajax({ type: "POST",   
				 url: http://www.panpic.vn/process.php,
				 async: false,
				 data: f.serialize(),
				 success: function(text){ 
					alert(text);
				 }
			});	

Chúc thành công
nhantam
Web developer team in Vietnam

Jquery trigger khi toàn bộ dự liệu trên website được load

Có yêu cầu đặt ra, làm thế nào để chạy một đoạn script giải quyết một công việc AAA, trong công việc AAA có công việc con là A11, A11 được được thực thi bằng câu lệnh jquery(cậu lệnh A11 được thược thi khi website đã load). Vậy bây giờ làm thế nào để biết toàn bộ các script trên website đã load (đã chạy & thực thi) ?


$( document ).ready(function() {

	$(window).load(function(){
            //do somting
	});
	
});	

// Window load sẽ chạy khi tất cả các script đã được thực thi

 

# Hoặc các bạn có thể dùng trigger của javascript, jquery thực thi câu lệnh sau thời gian 5 giây



window.setInterval( process_img , 5000);


 
nhantam
Web Developer

thiet ke web

Debug jquery

Khi sử dụng một số function cung cấp sẵn của jquery, nếu function đó thực thi bị lỗi, làm thế nào để chúng ta bắt được lỗi. Có rất nhiều cách như: Xem Console của trình duyệt (chrome, firefox, ..vv). Nhưng với những function không xuất ra lỗi Console của trình duyệt thì debug như thế nào ?

nhantam lấy một ví dụ với hàm Jquery getJson


$.getJSON("json_function_update.php", function () {
alert("success");
});

Trường hợp function getJSON bị lỗi chúng ta bắt lỗi như sau:


$.getJSON("json_pm_update.php", function () {
alert("success");
}).fail(function( jqxhr, textStatus, error ) {
var err = textStatus + ', ' + error;
console.log( "Request Failed: " + err);
});

// ouput Request Failed: error...
// Chúng ta có thể thay console.log()  bằng alert()

Các bạn tìm hiểu thêm function fail tại link: http://api.jquery.com/jquery.ajax/

nhantam
PHP Developer
Vietnam web design company

Jquery form processing

Một số thao tác trên form với Jquery

Khi làm việc với form upload dữ liệu, các lập trình viên có rất nhiều thao các khác nhau, yêu cầu xử lý form, ví dụ như các sự kiện; form action, input name click, lấy dữ liệu của radio checkbox (checked), …vv

Hôm nay nhantam giới thiệu một số thao tác cơ ban hay sử dụng của jquery

ví dụ: chúng ta có form html sau:

from name="form_product" id="form_production" action="upload.php"

input type="radio" name="verify" value="2" checked="checked" /> Verify
input type="radio" name="verify" value="1" /> Suppend

Product: input type="text" name="product" value=""
Quantity: input type="text" name="quantity" value=""

input type="button" name="btn_submit" value=" Upload "
...ect
/form

1. Yêu cầu lấy giá trị của radio box name=”verify”:

var verify = $('#verify input:checked').val();

2. Bắt sự kiện click radio box name=”verify”

$('input:radio[name=verify]').click(function() {
// lam viec gi do
});

3. Thay đổi url action của form form_production

$("#form_production").attr("action", test.php);

4. Query format number


function formatNumber (num) {
    return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
}

// Testing

alert(formatNumber(2800));      // 2,800
alert(formatNumber(102800));    // 102,800
alert(formatNumber(222102800)); // 222,102,800

5. Còn tiếp
…..

nhantam
PHP Developer

Cách làm tròn số với ngôn ngữ PHP & Javascript

Cách làm tròn số hay một số phương thức toàn học với PHP & Javascript   1. Cách làm tròn với PHP


Hàm FLOOR // Lấy phần nguyên -  echo FLOOR(3.4) //output 3
Hàm ROUND // Làm tròn xuống -  echo ROUND(3.4) //output 3
Hàm CEIL  // Làm tròn lên - echo CEIL(3.14) //output 4

// nhìn ví dụ echo ở trên các bạn lầm tưởng FLOOR & ROUND giống nhau, nhưng khi hoán đổi các số âm thì sẽ cho ra kết quả khác nhau 2. Cách làm tròn với Javascript Tương tự như PHP, Javascript cũng cung cấp sẵn một số hàm xử lý số


script type="text/javascript" language="javascript"
var myNumber = 19564.556
console.log("Lấy giá trị tuyệt đối: " + Math.abs(myNumber));
console.log("Làm tròn lên: " + Math.ceil(myNumber));
console.log("Làm tròn xuống: " + Math.floor(myNumber));
console.log("Trả về logarit: " + Math.log(myNumber));
console.log("Trả về căn bậc hai: " + Math.sqrt(myNumber));
/ script
3. Cách làm tròng giá trị sau dấu chấm với javascript

 
script type="text/javascript" language="javascript"
 
x =  36.469999999
 
var n = parseFloat(x); x = Math.round(n * 1000)/1000; alert( x ); // 36.47
 
/ script
Chúc các bạn thành công
nhantam PHP Developer thiết kế web

Cách sử dụng alert bootstrap

Cách sử dụng jquery bootstrap alert

Xem thêm tại link:  http://getbootstrap.com/javascript/#alerts

 

Step 1. Tạo một file alert chung đặt tên alert.tpl

alert_tpl

 

Step 2. Gọi file alert.tpl vào vị form hoặc bất cứ file nào bạn muốn cảnh báo warning

Ví dụ: bạn gọi file alert vào form đăng nhập (login.tpl)

đặt đoạn code sau vào vị trí bạn muốn hiện thông báo cách bảo alert trong file login.tpl

<div>{   include file=”alert.tpl”   }</div>

cuối file login.tpl đặt đoạn code javascript sau:

script
var require_user = “Nhập tên đăng nhập !”;
/script

như hình sau:

alert_login

 

Step 3. Script kiểm tra bật tắt alert

Ví dụ: chúng ta sẽ bắt sự kiểm tra form đăng nhập khi người dùng nhấp chuột vào nút đăng nhập mà chưa nhập thông tin user

bootstratp-alert-script

 

 

Note:

– các bạn lưu ý file alert.tpl đoạn code jquery $ (‘ .alert ‘). hide(); //để khi click đóng alert gọi trigger để đóng hoàn toàn, nếu không gọi đoạn code này khi bạn cần hiển thị alert lần thứ 2 sẽ bị lỗi.

– Gọi

$ (‘.alert’). hide();

$ (‘.alert’). show(); đúng vị trí, tránh chồng chéo mà làm alert bị hiển thị sai

 

Chúc các bạn thành công

 

nhantam
PHP Developer

công ty thiết kế web Panpic