How to parse a date in the dd.mm.yyyy format? - javascript

I try to parse a date in the dd.mm.yyyyformat: Globalize.parseDate(value, "dd.MM.yyyy", "en"); but globalize crashes with errors:
Uncaught Error: E_INVALID_PAR_TYPE: Invalid options parameter
(dd.mm.yyyy). Plain Object expected.
at createError (globalize.js:105)
at validate (globalize.js:182)
at validateParameterType (globalize.js:257)
at validateParameterTypePlainObject (globalize.js:295)
at Function.Globalize.dateParser.Globalize.dateParser (date.js:1853)
at Function.Globalize.parseDate.Globalize.parseDate (date.js:1908)
at $.validator.methods.date (Index:1891)
at $.validator.check (jquery.validate.js:759)
at $.validator.checkForm (jquery.validate.js:450)
Linked script files:
<script src="/Scripts/cldr.js"></script>
<script src="/Scripts/globalize.js"></script>
<script src="/Scripts/globalize/message.js"></script>
<script src="/Scripts/globalize/number.js"></script>
<script src="/Scripts/globalize/date.js"></script>
How can I fix it?

You need to pass the function a value and then an options object.
Globalize.locale('en');
Globalize.parseDate(value, {
skeleton: 'dd.MM.yyyy'
});
You can find the documentation for this here.

Related

Getting error when trying to return value using dropzone

hi i want to recover id use dropzone but it gives me error Uncaught SyntaxError: Unexpected token '.' i don't know why.
var id = $("#id").html();
Dropzone.options.dropzone = function(){console.log(id)};
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/min/dropzone.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/dropzone.js"></script>
<h3 class="jumbotron" id="id">241</h3>
I don't the package but you have a syntax error here.
If Dropzone.options.dropzone suppose to be an object you should pass it with a set of key and values like this:
Dropzone.options.dropzone =
{
key: "value";
}
Or if it supposes to get a function do it like this:
Dropzone.options.dropzone = function(){console.log(id)};
Does one of these solutions solves your problem?

Cannot read property 'fn' of undefined / Uncaught TypeError: $(...).daterangepicker is not a function

I tried to display jquery datepicker to my webpage but it giving 2 errors :
Uncaught TypeError: Cannot read property 'fn' of undefined
Uncaught TypeError: $(...).daterangepicker is not a function
looks like I missed something
I'm using jquery 3.3.1.min.js and datepicker.js
here's the code in html and head
<link rel="stylesheet" type="text/css" href="{{ url('') }}/assets/header_css/bootstrap.css" />
<script type="text/javascript" src="{{ url('') }}/assets/header_js/daterangepicker.js"></script>
here's the code for input type
<input type="text" value ="YYYY/MM/DD" class="form-control datepicker" v-model="tanggalpickup" name="tanggalpickup" id="tanggalpickup"/>
here's the code for the javascript
$(document).ready(function() {
$("input.datepicker").singleDatePicker();
});
$.fn.singleDatePicker = function() {
$(this).on("apply.daterangepicker", function(e, picker) {
picker.element.val(picker.startDate.format(picker.locale.format));
});
return $(this).daterangepicker({
locale: {
format: 'YYYY-MM-DD' // Change to local formats YYYY-MM-DD - MM-DD-YYYY
},
singleDatePicker: true,
autoUpdateInput: false
});
};
all your responses will be highly appreciated
The reason is the library datepicker is not initialized correctly. When you add libraries which are using jQuery, You need to add those after jQuery.
The code should be like,
<script src='yourpath/jquery.min.js'></script>
<script src='yourpath/daterangepicker.js'></script>

javascript moment.js format date

I am doing in accordance with this question and I need to format my resulting time string. I use bootstrap datetimepicker and moment.js and I have this code:
$("#datetimepicker2").on("dp.change", function (e) {
console.log('date2: ' + e.date.format('MM.DD.YYYY HH:mm:ss') );
end_date = e.date;
end_date.toJSON = function(){ return moment(this).format(); };
});
console.log(JSON.stringify(end_date));
My problem is that I receive
"2017-06-20T17:29:05+03:00"
while I need something like this:
"2017-06-20T17:29:05.013Z"
Any ideas how to get it would be welcome. Thank you.
You can convert the moment object to js date and use toISOString() on that.
moment().toDate().toISOString();
You can add .tz() before .format() and pass in the timezone inside .tz("America/New_York"), etc.
$(function() {
$("#datetimepicker2").datepicker();
$("#datetimepicker2").on("change", function(e) {
console.log(moment().utc($(this).val()).format());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone-with-data.js"></script>
Date: <input type="text" id="datetimepicker2" />

bootstrap-datepicker set language globally

I'm using bootstrap-datepaginator that inside uses bootstrap-datepicker.
Utilizzanto bootstrap-datepicker as a single component, there are no problems to set the language, but the same is not true using bootstrap-datepaginator. How can I do?
I'm trying to set the Italian language as a default for the entire project.
In index.html I put the following script:
<script src="vendors/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="vendors/jquery-ui/ui/i18n/datepicker-it.js"></script>
<script>
$(function() {
$( "#datepicker" ).datepicker( $.datepicker.regional[ "it" ] );
});
</script>
But in the console I get these errors:
Uncaught TypeError: Cannot read property 'regional' of undefined datepicker-it.js:15
Uncaught TypeError: Cannot read property 'regional' of undefined (index):394
I tried everything but I'm going crazy!
Bootstrap Datepicker i18n
I changed the code in this way:
<script src="vendors/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="vendors/bootstrap-datepicker/js/locales/bootstrap-datepicker.it.js"></script>
<script>
$(function() {
$.datepicker.setDefaults( $.datepicker.regional["it"] );
});
</script>
but now the error is as follows:
Uncaught TypeError: Cannot read property 'setDefaults' of undefined
With this fix:
$('.datepicker').datepicker({
language: "it"
});
I haven't got errors in console but the language is always english by default
You can set default options for Bootstrap Datepicker by assigning them like so:
$.fn.datepicker.defaults.language = 'it';
Example below:
$(document).ready(function(){
$.fn.datepicker.defaults.language = 'it';
});
$(document).ready(function(){
$('.datepicker').datepicker();
});
<link href="https://cdn.jsdelivr.net/bootstrap.datepicker-fork/1.3.0/css/datepicker3.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/bootstrap.datepicker-fork/1.3.0/js/bootstrap-datepicker.js"></script>
<script src="https://cdn.jsdelivr.net/bootstrap.datepicker-fork/1.3.0/js/locales/bootstrap-datepicker.it.js"></script>
<input class="datepicker"/>
Use jQuery's extend() utility method to merge your settings into the datepicker defaults object:
$.extend( $.fn.datepicker.defaults, {format: 'dd-mm-yyyy', language: 'nl'} );
<script src="/jquery/jquery.ui.datepicker.js" type="text/javascript"></script>
<script src="/jquery/jquery.ui.datepicker-it.js" type="text/javascript"></script>
<script>
$.datepicker.setDefaults( $.datepicker.regional["it"] );
$( "#data" ).datepicker();
</script>

jqxGrid fails with error "Object [object Object] has no method 'jqGrid'"

I am trying to embed jqxgrid into my HTML page.
This are the libraries that I import:
<script src="./wicket/resource/org.apache.wicket.resource.JQueryResourceReference/jquery/jquery-1.10.1-ver-1379671500000.js"></script>
<script src="./wicket/resource/org.apache.wicket.ajax.AbstractDefaultAjaxBehavior/res/js/wicket-event-jquery-ver-1379671500000.js"></script>
<script src="./wicket/resource/org.apache.wicket.ajax.AbstractDefaultAjaxBehavior/res/js/wicket-ajax-jquery-ver-1379671500000.js"></script>
<script src="/jquery/jquery-ui.min.js"></script>
<script src="/jqwidgets/jqxcore.js"></script>
<script src="/jqwidgets/jqxdata.js"></script>
<script src="/jqwidgets/jqxbuttons.js"></script>
<script src="/jqwidgets/jqxscrollbar.js"></script>
<script src="/jqwidgets/jqxmenu.js"></script>
<script src="/jqwidgets/jqxcheckbox.js"></script>
<script src="/jqwidgets/jqxlistbox.js"></script>
<script src="/jqwidgets/jqxdropdownlist.js"></script>
<script src="/jqwidgets/jqxgrid.js"></script>
<script src="/jqwidgets/jqxgrid.columnsresize.js"></script>
<script src="/jqwidgets/jqxgrid.edit.js"></script>
<script src="/jqwidgets/jqxgrid.filter.js"></script>
<script src="/jqwidgets/jqxgrid.pager.js"></script>
<script src="/jqwidgets/jqxgrid.selection.js"></script>
<script src="/jqwidgets/jqxgrid.sort.js"></script>
I omitted type="text/javascript" for simplicity reasons. As you can see the whole think is a wicket application, so I can't really influence the first three imports.
I implemented the jqxgrid as follows:
<script type="text/javascript">
$(document).ready(function() {
var theme = "smoothness";
var dataAdapter = new $.jqx.dataAdapter(data);
$("#jqxgrid").jqxGrid({
width : "99%",
autoheight: true,
theme : theme,
// many more configuration options
columns: [ /* column declaration */ ]
});
// events
$("#jqxgrid").on('cellendedit', function(event) {
var args = event.args;
$.post("EditResponse", {
id: $('#jqxgrid').jqGrid('getCell',args.rowindex,'Name'),
value: args.value
});
});
});
</script>
Again I omitted (in my opinion) unnecessary details, as the initializaton of jqxgrid works fine, I see the table with every data I want it to show.
But when I edit a cell and end editing, the row
$('#jqxgrid').jqGrid('getCell',args.rowindex,'Name')
yields an error in the console:
TypeError: Object [object Object] has no method 'jqGrid'
I did some research but could not fine a clear explanation. Any experiences what could be wrong? Any import I forgot? Anything in the wrong order?
type Error, change
$('#jqxgrid').jqGrid(...
to
$('#jqxgrid').jqxGrid(...

Categories