I am trying to require momentjs in my web application. I am using ASP.NET MVC on the server-side, and Durandal on the client-side.
requirejs.config({
urlArgs: "bust=" + (new Date()).getTime(),
paths: {
'text': '../Scripts/text',
'durandal': '../Scripts/durandal',
'plugins': '../Scripts/durandal/plugins',
'transitions': '../Scripts/durandal/transitions',
'moment': '../Scripts/moment'
},
noGlobal: true
});
and then here is my define function
define(['moment'], function(moment) {
moment().format();
});
I am working directly off of the Moment.js Docs
I can see that the moment.js script is loaded but once it gets through the define function the application is just sitting there. If I take the define out everything works fine.
Can someone please help me figure out what I am doing incorrectly here?
I am adding a fiddle of my entire main.js file maybe that will help.
I think that I might have been misunderstanding a concept with require.js. I changed my main.js file to NOT have a the define that returns moment and instead just added a new modules that lookes like this..
define(['moment'], function() {
return {
dates: {
getSimpleDate: getSimpleDate,
getDateTime: getDateTime
}
};
function getSimpleDate (date) {
return moment(date).format('DD-MMM-YYYY');;
};
function getDateTime(date) {
return moment(date).format('DD-MMM-YYYY H:mm:ss a');
}
});
That seems to be working out just fine.
Related
Im using vue fire as a plugin for connecting to firebase easily integrated with VUE JS and VUE router
im really having a hard time solving the null thing after manually binding
like this
line of code
bindUser() {
this.$bindAsArray('buser',this.$firebaseRefs.busers.orderByChild('uid').equalTo(this.uid));
},
and route correctly
using this
toDashboard() {
this.$router.push(`user/${this.buser[0].username}`)
},
why is it always a null? please help me here
Do you need to manually $bindAsArray? Have you tried this on your component options?
firebase() {
debugger // make sure $this.$firebaseRefs.busers... is what you expect
return {
buser: this.$firebaseRefs.busers.orderByChild('uid').equalTo(this.uid)
}
}
Also are you using Vue DevTools? That should help you inspect your bindings.
I have an issue discussed here: Page after canceling print doesn't resize chart.
https://github.com/highslide-software/highcharts.com/issues/1093
I am hoping to reproduce a solution mentioned there. Basically, the solution is to set global options in Highcharts as follows:
Highcharts.setOptions({
chart: {
events: {
afterPrint: function () {
alert('called');
Highcharts.charts.forEach(function (chart) {
if (chart !== undefined) {
chart.reflow();
}
});
}
}
}
});
In my case, the page works as below:
Load the page
Start an Ajax call to retrieve data and draw four charts.
I tried to use the above solution either at page load or after the ajax call. However, afterPrint was never called. Note that I put "alert('called')" there to prove it.
What is the right way to add global afterPrint?
Regards.
I got it working now. I was using version 4.0.4, with which afterPrint did not work as expected. Now I am using the latest version 4.1.9 and afterPrint works as expected without any code change on my side.
I call the global setup at the page load.
Hope this helps.
I did it in easier way by adding following in my script
Highcharts.setOptions({
chart: {
events: {
afterPrint: function () {
jQuery(window).resize()
}
}
}
});
I have the following .js file for my project. This is running in a regular browser, using jquery 1.9.x and jquerymobile 1.3.1. The init function below appears to be running when the page loads and the UI is not updated. Though... I can copy the function into the console and run it, and the UI updates as it is supposed to, so this in not a case of incorrect file paths, or incorrect ids for the UI elements, but I suspect timing. I am also NOT using cordova or phone gap in this instance.
So, my question is, why is the UI not updating when the $(document).bind('pageinit', ...) function is called? If I put a breakpoint in the init method, it is getting called when the page loads. Any suggestions on using a different event or approach?
var simulator = simulator || {};
(function (feedback, $, undefined) { 'use-strict';
feedback.init = function () {
$.get('feedback-config.xml', function (data) {
$('#feedback-to').val($(data).find('email').text());
$('#feedback-subject').val($(data).find('emailSubject').text());
$('#feedback-display').html($(data).find('message').text());
$('#feedback-form').attr('action', $(data).find('serverurl').text()).ajaxForm({success: function () {
alert("Thank you for your feedback!");
}, error: function () {
alert("We're having difficulties sending your feedback, sorry for the inconvenience.");
}});
});
};
}(simulator.feedback = simulator.feedback || {}, jQuery));
$(document).bind('pageinit', function () { 'use strict';
simulator.feedback.init;
});
Thanks in advance.
Found it, simple mistake... In the 'pageinit' function I am calling simulator.feedback.init; instead of simulator.feedback.init(); Not sure why JSLint didn't pick that up initially, but it pointed it out when I tried again later. Thanks.
I am trying to set focus on the control while error occurs. I am use mvc 2.0. In Asp.net we have a property SetFoucsOnError but in MVC what is the substitute of it and how to implement ?
Well I did not get this solution. But i got an alternate option which even works :
$().ready(function() {
$("#Form").submit(function() {
$('.input-validation-error').focus();
$(".input-validation-error").each(function() {
$(this).focus();
});
});
});
I think the easiest way to do this is to use JavaScript.
The example uses jQuery and assumes controls with invalid data have a css class called input-validation-error:
$(function () {
$('form').submit(function() {
$(this).find('input.input-validation-error, select.input-validation-error')
.first()
.focus();
});
});
This will look for all input and select elements with the class input-validation-error, take the first of them and put the focus on it.
I used to use scriptaculous in all my CakePHP projects because of its easy helpers. In time, I got more and more into jQuery, and now I want to replace my current scriptaculous scripts with jQuery scripts. Until now, everything has been good... except jQuery sortable.
JQuery sortable runs, but the AJAX call afterwards isn't working right. Now my programmer is on holiday so I've gotta ask you guys:
Old CakePHP code (inside pages_controller.php):
function order($parent_id = 0){
$this->autoRender=false;
//Users with rights may view this
$user = $this->checkRights('pages',true);
//loop through the data sent via the ajax call
foreach ($this->params['form']['page'] as $order => $id){
$this->Page->id = $id;
if(!$this->Page->saveField('order',$order)) {
$this->flash('Really freaky errors are occuring','/');
exit();
}
}
}
My jQuery looks like:
$(".sortable-list").sortable({
update: function() {
$.post('/pages/order/0', {
data: $('.sortable-list').sortable("serialize")
});
}
});
$(".sortable-list").disableSelection();
With Firebug, I see that the AJAX post call produces something like this:
page[]=14&page[]=23&page[]=18&page[]=11&page[]=26&page[]=28
However, it doesn't seem to work. I guess the page[]=id is different that the old scriptaculous format:
pages_0[] 1
pages_0[] 3
pages_0[] 2
Does anyone know how I can adjust the CakePHP file to read the string correctly?
I don't have working php environment to test, but should work basically.
$pages = $_GET['page'];
foreach( $pages as $order => $id)
{
$this->Page->id = $id;
if(!$this->Page->saveField('order',$order)) {
$this->flash('Really freaky errors are occuring','/');
exit();
}
}
PS. Probably you have kind of problem updating "$this->params".
before foreach line, insert
debug($this->params['form']['page']);
and see how page array looks like. then iterate properly.
Ah, finally.. It turned out that jquery's output was: data: '&page_0[]=1etc'. I had to make it page_0 instead of data and its fixed!
So:
$(".sortable-list").sortable({
update: function() {
$.post('/pages/order/0/, $('#pages_0').sortable("serialize", {key: 'pages_0[]'}))
}
});
$(".sortable-list").disableSelection();
I removed the {} from the second argument of $.post and it turned out to be the winner! thx for the help guys!