Q: Có cách nào để bọc table trong div trong TinyMCE không?

Trả lời: Dùng <span>jQuery("table").wrap( "<div class='table-responsive'></div>" )</span> Khi tạo bảng (table) trong TinyMCE sẽ thường có dạng: Ví dụ <table> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>A content</td> <td>B content</td> </tr> </tbody> </table> Nếu bạn dùng bootstrap table thì sẽ thường bao bọc table trong cặp <div class='table-responsive'></div> Giờ muốn làm điều đó thì bạn có thể dùng JQuery để thay đổi hiển thị của bảng bằng code sau: Ví dụ $(document).ready(function(){ $("table").wrap( "<div class='table-responsive'></div>" ); }); Kết quả hiển thị sẽ là: Ví dụ <div class='table-responsive'> <table> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>A content</td> <td>B content</td> </tr> </tbody> </table> </div>

Q: TinyMCE textarea và biểu mẫu (Form) đăng bằng ajax

Trả lời: Dùng tinymce.get('id_cua_textarea_dung_tinymce').getContent() để lấy dữ liệu Code ví dụ như sau: Ví dụ $('#' + 'id_cua_textarea_dung_tinymce').html( tinymce.get('id_cua_textarea_dung_tinymce').getContent()); var form = $('form#formdata')[0]; var formData = new FormData(form); $.ajax({ //Code post ở đây }); Hoặc bạn có thể xem hướng dẫn chi tiết tại Tích hợp TinyMCE trong PHP & MySQL bằng Ajax mới vừa được cập nhật

Question 1

Làm thế nào để vô hiệu hóa các ngày cụ thể trong Bootstrap Datepicker bằng jQuery?

Accepted Answer

Trả lời: Để vô hiệu hóa một số ngày cụ thể trong Bootstrap Datepicker chúng ta sử dụng chức năng dateDisabled

Đôi khi chúng ta cần vô hiệu hóa ngày cụ thể để người dùng không thể chọn từ đó hoặc có thể bạn có điều kiện rằng người dùng đáp ứng các yêu cầu thì bạn cần phải vô hiệu hóa các ngày đó.

May mắn thay, Bootstrap Datepicker đã cung cấp một tùy chọn có tên là dateDisabled, sau đó chúng tôi sẽ chỉ đặt giá trị ngày tháng bị vô hiệu hóa dưới dạng biến mảng như bạn có thể thấy bên dưới:

Ví dụ

var datesForDisable = ["11-01-2022", "12-10-2022", "12-11-2022", "20-12-2021"]

$('.datepicker').datepicker({
   format: 'dd-mm-yyyy',
   autoclose: true,
   todayHighlight: true,
   datesDisabled: datesForDisable
});

Mã nguồn hoàn chỉnh: Mình sẽ lấy mẫu từ bài Bootstrap Datepicker trong PHP & MySQL bằng Ajax nhé

Ví dụ




  	Cách sử dụng Bootstrap Datepicker trong PHP & MySQL bằng Ajax

  	
	
	
	
  

  

   
	

		



	    Cách sử dụng Bootstrap Datepicker trong PHP & MySQL bằng Ajax

	    



	    
		  	
			    Ngày sinh:

Question 2

Regex để xác thực tên miền

Accepted Answer

Trả lời: Sử dụng một biểu thức chính quy để kiểm tra xem nó có phải là một tên miền hợp lệ hay không.

Mã và cách sử dụng như bên dưới:

Mã JS

Hàm JS Cách sử dụng

function isValidDomain(v) {
  if (!v) return false;
  var re = /^(?!:\/\/)([a-zA-Z0-9-]+\.){0,5}[a-zA-Z0-9-][a-zA-Z0-9-]+\.[a-zA-Z]{2,64}?$/gi;
  return re.test(v);
}

isValidDomain('example.com') // true
isValidDomain('foo.example.com') // true
isValidDomain('bar.foo.example.com') // true
isValidDomain('exa-mple.co.uk') // true
isValidDomain('exa_mple.com') // false
isValidDomain('example') // false
isValidDomain('ex*mple.com') // false
isValidDomain(3434) // false

Question 3

Cách lấy giá trị của tùy chọn đã chọn trong hộp chọn (Select) bằng jQuery

Accepted Answer

Trả lời: Sử dụng jQuery Selector`:selected`

Bạn có thể sử dụng bộ chọn jQuery :selected kết hợp với phương thứcval()này để tìm giá trị tùy chọn đã chọn trong hộp chọn hoặc danh sách thả xuống.

Hãy thử ví dụ sau để hiểu về cơ bản nó hoạt động như thế nào:

Ví dụ





jQuery Get Selected Option Value


 

    
        Select Country:

Nếu giá trị cho một tùy chọn không được xác định cụ thể, nội dung văn bản của phần tửsẽ được sử dụng làm giá trị thay thế, như được minh họa trong ví dụ sau:

Ví dụ





jQuery Get Selected Option Text


 

    
        Select Country:

Ngoài ra, bạn có thể sử dụng phương thứcjQuerytext()để lấy nội dung văn bản của một phần tử

Nhận các tùy chọn đã chọn từ nhiều hộp chọn

Tương tự, bạn có thể lấy các giá trị đã chọn từ nhiều hộp chọn bằng một mẹo nhỏ.

Một hộp nhiều lựa chọn cho phép người dùng chọn nhiều tùy chọn.Nhấn giữ phím điều khiển trên Windows hoặc phím lệnh trên Mac để chọn nhiều tùy chọn.Bạn có thể bật nhiều phần trong một hộp chọn bằng cách thêm thuộc tínhmultiplevào thẻ

Question 4

Có cách nào để bọc table trong div trong TinyMCE không?

Accepted Answer

Trả lời: Dùng `jQuery("table").wrap( " " )`

Khi tạo bảng (table) trong TinyMCE sẽ thường có dạng:

Ví dụ


	
		
			A
			B
		
	
	
		
			A content
			B content

Nếu bạn dùng bootstrap table thì sẽ thường bao bọc table trong cặp

Giờ muốn làm điều đó thì bạn có thể dùng JQuery để thay đổi hiển thị của bảng bằng code sau:

Ví dụ

$(document).ready(function(){
    $("table").wrap( "" );
});

Kết quả hiển thị sẽ là:

Ví dụ


	
		
			
				A
				B
			
		
		
			
				A content
				B content

Question 5

TinyMCE textarea và biểu mẫu (Form) đăng bằng ajax

Accepted Answer

Trả lời: `Dùng tinymce.get('id_cua_textarea_dung_tinymce').getContent()` để lấy dữ liệu

Code ví dụ như sau:

Ví dụ

$('#' + 'id_cua_textarea_dung_tinymce').html( tinymce.get('id_cua_textarea_dung_tinymce').getContent());
var form = $('form#formdata')[0]; 
var formData = new FormData(form);
$.ajax({
//Code post ở đây
});

Hoặc bạn có thể xem hướng dẫn chi tiết tại Tích hợp TinyMCE trong PHP & MySQL bằng Ajax mới vừa được cập nhật

Question 6

Lấy dữ liệu CkEditor để đăng bằng ajax form

Accepted Answer

Trả lời: Buộc CKeditor cập nhật giá trị textarea

Buộc CKeditor cập nhật giá trị textarea bằng cách sử dụng:

Ví dụ

for (instance in CKEDITOR.instances) {
    CKEDITOR.instances[instance].updateElement();
}

Ngoài ra, bạn có thể sử dụng .serialize cho dữ liệu – sau đó bạn sẽ không phải duy trì mã AJAX nếu tham số thay đổi:

Ví dụ


function saveArt() 
{
    for (instance in CKEDITOR.instances) {
        CKEDITOR.instances[instance].updateElement();
    }

    jQuery.ajax({
        type: 'POST',
        url: 'save.php',
        data: $("#art").serialize()
     });  
     return false; 

 }

Làm thế nào để vô hiệu hóa các ngày cụ thể trong Bootstrap Datepicker bằng jQuery?

Trả lời: Để vô hiệu hóa một số ngày cụ thể trong Bootstrap Datepicker chúng ta sử dụng chức năng dateDisabled

Ví dụ

Ví dụ

Câu hỏi liên quan