I've been trying tom implement the following script which looks like a great date calculation library built on top of Jquery.
http://www.jquery4u.com/jquery-functions/datetime-functions-complete-listing/
My basic knowledge of Jquery and Javascript isn't sufficient to get this working so I'm looking for some help with the usage.
I've loaded the file in the header of the page I want to use it and tried unsuccessfully to call the functions like:
JQUERY4U.DATETIME.futureDateDays(1);
DATETIME.futureDateDays(1);
futureDateDays(1);
And an assortment of other attempts just doesn't seem to work. I know I'm probably missing something easy.
My goal is to set a variable to the result of the datetime function.
Also, it would be great if you could provide examples for the usage of the date format portion of the script.
I know some of you Jquery and Javascript ninjas will be able to figure this out in under 90 seconds.
Thanks in advance!
Here's a jsFiddle that should have what you need:
http://jsfiddle.net/dKGkY/1/
There are three functions that you would need, and hopefully there's enough in the examples to explain what they do. You can obviously change whatever you need for your requirements, but hopefully this is what you need! Let me know if you need helping modifying or using them.
Related
I know I might be asking something quite simple but for the life of me I can't seem to get my head around this and I'm definitely overseeing something simple but I don't know what. Any help would be very appreciated.
I'm generating a static site using Hugo. On one of my pages, I want to create something like a progress bar, using a variable which I need to get from a file from a Github Gist.
Say this is the gist: https://gist.github.com/bogdanbacila/c5a9683089c74d613ad17cdedc08f56b#file-thesis-words-txt
The file only has one number, that's it. What I'm asking is how to get that number from the gist and store it in hugo or at least just display it in some raw html. I want to mention that I'm not looking to use the provided embedded text, I'd rather just get the raw value. At the end of the day all I need is to read and display the number from the raw link here: https://gist.githubusercontent.com/bogdanbacila/c5a9683089c74d613ad17cdedc08f56b/raw/8380782afede80d234209293d4c5033a890e44b6/thesis-words.txt
I've asked this question on the Hugo forum and that wasn't very helpful, instead of providing me with some guidance I got sent here. Here was my original question: https://discourse.gohugo.io/t/get-raw-content-from-github-gist-to-a-variable/38781
Any help would be greatly appreciated, I know there's something very obvious which I'm not seeing, please guide me to the right direction, this doesn't feel like it should be that complicated.
Best,
Bogdan
You could fetch this data and store it in Hugo as a data file but I don't recommend it.
Since Hugo is a static site generator, you would need to not only modify the data files in your repo every time the value changes, but re-build your site as well. Then you have to worry about running the script on a schedule. Meaning you can't be sure that the value is current the second someone visits your site. This is more headache than it's worth in my opinion.
The better route would be to write some client-side JavaScript that makes a call to the raw URL of the gist to get the content. This is Hugo-agnostic which is why I suspect you were pointed here.
From the Gists API docs:
If you need the full contents of the file, you can make a GET request to the URL specified by raw_url.
You can use something like the Fetch API for this or any other JS client. Simply make a GET request to the URL, parse the value from the response body, and write some JavaScript to insert the value in the DOM when someone makes a request to the page it's on.
#wjh18
Cheers! I didn't know about GET requests so I had to dig around for that a little bit but I managed to get it going with this:
<script>
fetch('https://gist.githubusercontent.com/bogdanbacila/c5a9683089c74d613ad17cdedc08f56b/raw').then(function(response) {
return response.json();
}).then(function(data) {
console.log(data);
}).catch(function() {
console.log("Booo");
});
</script>
I am trying to get a custom component working in Formio.js. I would love a complete, nontrivial working example.
I am not using angular, ng, react or the form.io service.
The documentation is terrible. I can copy out the Checkmatrix example code and run it (after much fiddling) but even it doesn't work correctly: in the formbuilder, the edit and delete controls don't show up. (There an bug issue open on this, but no resolution, which is distinctly worrisome.)
There are dead links all over the SDK reference documentation.. like for example for "Component" which seems particularly important.
There is no documentation of any of code used by the example. For example, it uses the 'renderTemplate' call, but the arguments are not described anywhere.
It appears that the only way to understand any part of this system to try to figure out all of the source code. There are no instructions for adding code.
It's not even clear what the best way to proceed is: whether I should fork the formio.js repo, learn TypeScript, and add components directly (creating a hassle if I ever want to keep formio.js up to date) or continue trying to work by registering components from add-on scripts in the browser.
** Can anyone give concrete advice on the best way to go? **
#nathaniel Tagg I couldn't find form.io proper form examples, so i would like to see your form.io examples if you are like to provide. Here is my email 'udara#staff.medicalwizard.com.au'
Right now I'm writing a small jQuery plugin for fun and profit, so since I'm not too familiar with this library, there's a few questions made me confused at this point.
Let's say we have a pretty simple plugin:
(function($) {
onButtonPress() {
console.log('Button pressed!');
}
render(container, settings) {
$(container).addClass(settings.boxClass);
$('<button></button>').appendTo(container).addClass(settings.addImageButton).on('click', onButtonPress);
}
$.fn.myAwesomeForm = function(options){
var settings = $.extend({
'boxClass': 'box-header with-border',
'addImageButton': 'btn btn-primary btn-sm',
}, options);
render(this, settings);
}
}(jQuery));
1) Let's imagine our render() method is implemented using 25 different functions and they are 400 total lines of code long. Some of these functions are responsible for drawing the UI, some of them doing ajax queries, some of them is just some helpful snippets I made to reduce the amounts (and the ugly-ness) of the code.
How I could split this code into separate files? As far as I understand, I need to write code in different files, then use a tool like grunt/gulp to create a task or watcher to merge them all into a single *.js file (and probably provide a minified version as well), but right now I'm a bit confused about how I should do that. Is there any kind of 'best practice' thing, or any common approach to such thing to make sure that my code will be less confusing for the other possible maintainers?
2) Let's say that default settings is an array of 70 [probably nested] elements, and I want to access one of them in onButtonPress function. Oh, also different one I want to access in someOther function, and there's a few I need for deleteForm() function, so generally it would be better for my code if settings array will be something I could access from pretty much every place of the code, and most important thing, I could have 5-6 instances of my form on the page, so I cannot use a local-scope variable in plugin file for that.
I read about the approach of saving settings in the data fields, but it feels a bit weird for me to be frank. Is there's any better way I could implement it?
3) Let's say that my plugin is growing, and now I want to add a few more pre-defined settings for Bootstrap and Sematic UI frameworks adding to AdminLTE I use now.
Of course, generally I want my $('#form').myAwesomeForm({}) call to not be 70-lines long, so generally I'm looking for a way to somehow move the default settings in another file, to say "myplugin-defaults-lte.js", so then I could do something like this:
<script type='text/javascript' src="myplugin-defaults-bootstrap.min.js">
<script type='text/javascript' src="myplugin.min.js">
<script type='text/javascript'>
// Here's my form. Already bootstrap-customized.
$('#form').myAwesomeForm();
</script>
I'm not sure if it's the best pattern, but perhaps you got the idea. So generally, can anyone please provide a simple code snippet, or something like this, because at this point things starting to be confusing as hell to me, so I'm really not sure how to approach it correct way?
I am new to this very very nice Linq.js library that I have just discovered. I am following the examples to write queries like:
Enumerable.from(jsonArray).select(...); // noice
Can I do this shortcut?
jsonArray.select(...); // error as expected
I read the tests in library, seems like pretty much every call starts with Enumerable.someCommand();. I am wondering if the linq commands have been applied to the correct prototypes in js, so I can call them in the style of 2nd line of code. am I not aware of it because I am a newbie?
I am the creator of the open source project http://www.jinqJs.com.
You could simply do jinqJs().from(jsonArray).select();
Let me know if I could be of any more help
If your concern is that Linq.js doesn't extend the Array prototype, I think it's misplaced. It's not exactly a light framework, kinda the same reason why jquery doesn't do the same thing. You shouldn't expect anything to work on just anything.
If you wanted to make bridging that gap a little nicer, it should be safe to add some methods to convert to the other.
if (!Array.prototype.AsEnumerable) { // not likely to be used by others
Array.prototype.AsEnumerable = () => Enumerable.From(this);
}
Then that would allow you to do:
jsonArray.AsEnumerable().Select(...);
Can somebody please explain the pros and cons for below.
Am having a function to get the url querystring parameters, but I need to know which is the best way to write the function. Eg: if i create the function using jquery plugin style, then every time I need to use a target element to access the function as below
$("#targetDom").getQueryString("name");
However, if I create the function using javascript classes or javascript design pattern, it would be
getQueryString("name");
This is a small example but considering large application which approach is best? is there any disadvantage in going with jquery plugin way?
Regards,
Navin
I found a while ago this sentence:
Don't learn jQuery. Just use it.
It's one of the best advices for a newbie, I think.
jQuery is just an addition to javascript. It simplifies DOM traversing/manipulation, makes easy event handling and so on, but it is not something you should start learning before you know vanilla Javascript.
Regarding your example, it is not the best thought example for jQuery plugin.
The syntax you suggested ($("#targetDom").getQueryString("name");) implies that you treat URL query string as attached somehow to the HTML element, which is wrong...