view release on metacpan or  search on metacpan

cheats.txt  view on Meta::CPAN

function _sort_swartz() {
  $('.row')
    .map( (_,el) => [[el,$(el).find('.rowlink .cell:nth(0)').text()]] )
    .sort((a,b) => {return (a[1] < b[1]) ? -1 : (a[1] > a[b]) ? 1 : 0 })
    .map( (_,el) => el[0] )
    .insertAfter('.header-row')
}


#############################################################
## JQuery Content - Remove
#############################################################

# Remove/Detach/Empty (JQuery)
# Remove removes all the elements and return a reference to the elements
#	which can be used elsewhere. The Returned elements will lose data and
#	event handlers.
# Detach is same like remove, but keep the data and events (like unpack in pTk).
# Empty clears out the contents of the element(s).


#############################################################
## JQuery Content - Selection
#############################################################

# Select a range of elements in jquery
$('.row').hide()
$('.row').slice(0,50).show()

# Check in JQuery if an element has a cetain class.
$("#blanket").hasClass("hidden")

# Look at all the parents of an html element (jquery)
$('#my').parents()				// Append .get() to see more details
$('#my').parents('.target')		// Search for a specific ancestor

# Find the first parent in the ancestry thats a "div"
$('#id').parents("div:eq(0)")

# Find out which radio button is checked and get its value (JQuery Book)
$("input:radio[name*='some-radio']:checked").val()


#############################################################
## JQuery Content - Update
#############################################################

# Add to element with JQuery
$('#id').html(data);	// InnerHTML
$('#id').text(data);	// InnerText

# Add a new attribute to an element in JQuery
$('[name="NAME"]').attr("abc", 123)		// setAttribute("abc", 123)
$('[name="NAME"]').attr("abc")			// getAttribute("abc")

# Wrap all labels and inputs/textarea pairs in a div (Jquery)
$('input, textarea').each( (i,el) => { $el = $(el); $el.add($el.prev("label")).wrapAll('<div class="field"></div>') } )


#############################################################
## JQuery Datepicker (calendar)
#############################################################

# Nice dialog to show the date in jquery (calendar)
<link rel="stylesheet" type="text/css" href="assets\jquery-ui-1.12.1.min.css">
<script src="assets\jquery-3.4.1.min.js"></script>
<script src="assets\jquery-ui-1.12.1.min.js"></script>
function setup_datapicker() {
	$('#delivery_date')
		.datepicker({dateFormat:  "dd-mm-yy"})
		.datepicker("setDate", new Date());
}


#############################################################
## JQuery - Events
#############################################################

# JQuery command to add an event to when a checkbox is clicked/changed
$("input[name=NAME]").change( function(){myfunc()} )

# By placing the script tag just before the closing body tag,
# you can avoid waiting for the DOM to fully load:
$(function(){  /* code here */ })

# Notify when the page is loaded (or ready for use)
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script>
	$(function() {
	$( "p" ).text( "The DOM is now loaded and can be manipulated." );
	});
</script>

# Add/trigger/remove a click event (JQuery)
$('#btn').on('click', function(evt,n1,n2,n3){ console.log(n1,n2,n3) } )
$('#btn').trigger('click', [10,11,12])
$('#btn').off('click')

# Add a single one-shot click event (JQuery)
$('#btn').one('click', function(evt,n1,n2,n3){ console.log(n1,n2,n3) } )
$('#btn').trigger('click', [10,11,12])

# Shortcuts to adding and trigger in JQuery
# click() does not seem to work with inputs
$('#btn').click(function(){ "ABC" } )
$('#btn').click()

# Make a text field which only triggers after a few second delay (JQuery events)
# Nice for input filters.
// $('#myFilter').keyup(myEvent).focus();
//
// {
//   let interval;
//   function myEvent() {
//     const self = this;
//
//     // User is typing, so clear the interval
//     clearInterval(interval);
//
//     interval = setInterval(function() {
//       // User is done type here
//       clearInterval(interval);
//       _filter_table_event(self);
//     }, 1000);