), elements using an ID, and classes if you use a '.' to prefix the class name.
Usage to remove our postData tag that indicates that LD+Json is being used: removeStr(value, "postData")
Usage to remove the 'foo' class from a string: removeStrBetween(str, '.foo');
*/
var removeStrBetween = function(str, selector) {
// Create a new container to operate on
var wrapped = $(" " + str + " ");
// Remove the content between the tags.
wrapped.find(selector).remove();
// Return it
return wrapped.html();
}
// Function to truncate and add an elipsis if the text exceeds a certain value
function truncateWithEllipses(text, max) {
return text.substr(0,max-1)+(text.length>max?'...':'');
}
function stripHtml(html){
html.replace(/<[^>]*>?/gm, '');
return html;
}
// Determine if a string has a space
function hasWhiteSpace(s) {
const whitespaceChars = [' ', '\t', '\n'];
return whitespaceChars.some(char => s.includes(char));
}
// ColdFusion like string functions
// ReplaceNoCase, scope is either 'all' or 'one'.
// Gregory Alexander
function replaceNoCase(string,subString,replacement, scope){
if (scope == 'all'){
// i is a RegEx ignore case flag, g is global flag
var regEx = new RegExp(subString, "ig");
} else {
// i is an RegEx ignore case flag
var regEx = new RegExp(subString, "i");
}
// i is an ignore case flag, g is global flag
var regEx = new RegExp(subString, "ig");
var result = string.replace(regEx, replacement);
return result;
}
// ColdFusion like list functions
function listLen(list, delimiter){
// Gregory Alexander
if(delimiter == null) { delimiter = ','; }
var thisLen = list.split(delimiter);
return thisLen.length;
}
function listGetAt(list, position, delimiter, zeroIndex) {
// Gregory Alexander
if(delimiter == null) { delimiter = ','; }
if(zeroIndex == null) { zeroIndex = true; }
list = list.split(delimiter);
if(list.length > position) {
if(zeroIndex){
// Better handling for JavaScript arrays
return list[position];
} else {
// Handles like the CF version without a zero-index
return list[position-1];
}
} else {
return 0;
}
}
function listFind(list, value, delimiter) {
// Adapted from a variety of sources by Gregory Alexander
var result = 0;
if(delimiter == null) delimiter = ',';
list = list.split(delimiter);
for ( var i = 0; i < list.length; i++ ) {
if ( value == list[i] ) {
result = i + 1;
return result;
}
}
return result;
}
// Compares two lists of comma seperated strings. Used to determine if the selected capabilities match the default capabilities for a given role. Function based on the listCompare method found in cflib.
function listCompare(string1, string2){
// Adapted from a variety of sources by Gregory Alexander
var s = string1.split(",");
for(var k = 0 ;k < s.length; k++){
if(string2.indexOf("," + s[k] + ",") ){
return true;
}
}
return false;
}
// Adds a value to a comma separated list. Will not add the value if the list already contains the value.
function listAppend(list, value) {
// Adapted from a variety of sources by Gregory Alexander
var re = new RegExp('(^|\\b)' + value + '(\\b|$)');
if (!re.test(list)) {
return list + (list.length? ',' : '') + value;
}
return list;
}
// Removes a value to a comma separated list. Based on the ListDeleteValue function by Ben Nadel CF fuction https://gist.github.com/bennadel/9753040
var listDeleteValue = function(list, value){
// Adapted from a variety of sources by Gregory Alexander
var values = list.split(",");
for(var i = 0 ; i < values.length ; i++) {
if (values[i] == value) {
values.splice(i, 1);
return values.join(",");
}
}
return list;
}
// URL functions
//
// parseUri 1.2.2
// (c) Steven Levithan
// MIT License
/*
Splits any well-formed URI into the following parts (all are optional):
----------------------
- source (since the exec method returns the entire match as key 0, we might as well use it)
- protocol (i.e., scheme)
- authority (includes both the domain and port)
- domain (i.e., host; can be an IP address)
- port
- path (includes both the directory path and filename)
- directoryPath (supports directories with periods, and without a trailing backslash)
- fileName
- query (does not include the leading question mark)
- anchor (i.e., fragment) */
function parseUri (str) {
var o = parseUri.options,
m = o.parser[o.strictMode ? "strict" : "loose"].exec(str),
uri = {},
i = 14;
while (i--) uri[o.key[i]] = m[i] || "";
uri[o.q.name] = {};
uri[o.key[12]].replace(o.q.parser, function ($0, $1, $2) {
if ($1) uri[o.q.name][$1] = $2;
});
return uri;
};
parseUri.options = {
strictMode: false,
key: ["source","protocol","authority","userInfo","user","password","host","port","relative","path","directory","file","query","anchor"],
q: {
name: "queryKey",
parser: /(?:^|&)([^&=]*)=?([^&]*)/g
},
parser: {
strict: /^(?:([^:\/?#]+):)?(?:\/\/((?:(([^:@]*)(?::([^:@]*))?)?@)?([^:\/?#]*)(?::(\d*))?))?((((?:[^?#\/]*\/)*)([^?#]*))(?:\?([^#]*))?(?:#(.*))?)/,
loose: /^(?:(?![^:@]+:[^:@\/]*@)([^:\/?#.]+):)?(?:\/\/)?((?:(([^:@]*)(?::([^:@]*))?)?@)?([^:\/?#]*)(?::(\d*))?)(((\/(?:[^?#](?![^?#\/]*\.[^?#\/.]+(?:[?#]|$)))*\/?)?([^?#\/]*))(?:\?([^#]*))?(?:#(.*))?)/
}
};
// Dump function. Use like you would with cfdump.
// function to dump out a a javascript object.
function mydump(arr,level) {
var dumped_text = "";
if(!level) level = 0;
var level_padding = "";
for(var j=0;j \"" + value + "\"\n";
}
}
} else {
dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
}
console.log(dumped_text);
}
Kendo template with void to consume a function in an anchor link
by Gregory Alexander
![]()
I have a Kendo template that is used to display real-time statuses for contracts and programmed a href tag that was intended to consume a javascript function rather than opening up a link. On my first attempt, I was having problems as I could not program a pound symbol into the Kendo template (like ColdFusion, a pound symbol indicates a variable within a Kendo template), so I escaped it using two pounds and found myself struggling to figure out why my window was suddenly being refreshed. I spent around ten minutes stepping through my code only to find out that the href tag refreshed the entire page, even though it was blank as the double pound sign escaped. On further introspection, this is understandable as I just had inadvertently programmed a typical link. To fix this issue, I used a simple javascript:void(0); within the link, and the javascript function is called without the default href tag opening up the link. Essentially, the void(0) code prevents the default behavior of the link, and it acts like a a href="#". I would not typically use void in other code, but using it within a Kendo MVVM template is an appropriate place. Here is the code:
<script type="text/x-kendo-template" id="myApprovalTemplate">
/* Note: dynamic vars can be displayed like so: #: myApprovalDs.total() # */
/* Alternate row colors. */
# if(window.altRow) { #
<tr class='k-alt'>
# } else { #
<tr class='k-content'>
# } #
# if(ApprovalId > 0){ #
<td class="border">
<input type="checkbox" name="approved#: ApprovalId #" id="approved#: ApprovalId #" value="1" /></td>
<td class="border">#: ApproverTitle #</td>
<td class="border"><a href="javascript:void(0);" onClick="openContractDetailWindow(#: ContractId #, #: ApprovalId #, '')">#: Contract #</a></td>
<td class="border">#: Contractor #</td>
<td class="border">pdf</td>
<td class="border"></td>
#} else {#
<td colspan="6"<!--- class="k-loading-image k-loading-color" --->>
<br/>There are no contracts eligible for you to approve
</td>
#}#
</tr>
<!--- Toggle the window variable. --->
# window.altRow = !window.altRow; #
</script>
Tags
Kendo MVVM Template
|
Gregory Alexander
|
Hi, my name is Gregory! I have several degrees in computer graphics and multimedia authoring, and I have been developing enterprise web applications for the last 25 years. I love web technologies and the outdoors and am passionate about giving back to the community.
|
This entry was posted on April 24, 2019 at 9:51 PM and has received 1398 views.
|