MVC4 Bundling Errors

[Seabizkit]

version 1.2

I am getting "Uncaught TypeError: undefined is not a function "

It WORKS fine if i include it separately...

I Also highly recommend you run your script through;
http://www.javascriptlint.com/online_lint.php

As they highlight some things missing semi-colons and formatting

I think the error is coming through as part of the minification process and if statements not having beginning and closing braces.

Please update soon! ;-)

Thanks

[trentrichardson]

I am not familiar with MVC4, but there was a user change request on this line a month or two back:

https://github.com/trentrichardson/jQuery-Timepicker-Addon/blob/master/jquery-ui-timepicker-addon.js#L40

The change is in place but the previous syntax was declaring the function like:

function Timepicker(){

Can you try switching that back out to see if it goes back to working?

This was the pull request: #540

[hankinsoft]

Hello,
I tried switch the code you mentioned with no luck. FYI I was using version 1.0.5 this morning and had the problem, since then I switch up to 1.2 and am still encountering the issue. I'm assuming its more of a problem with the ASP.Net optimizer.

[Seabizkit]

You don't need to worry about MVC4 part.

Basically it going to try remove all comments and minify the source code. (remove all spaces)

The problem I suspect is that there is an issue with the formatting of your source code.

Which once minified it does not read how it was before the minification.

That is why i include http://www.javascriptlint.com/online_lint.php

as it seems to highlight quite abit.

To test what we are on about.... I assume you have Visual Studio 2010 or higher.

Download and install MVC4... then create a new bundle... add you code to the bundle.

It will minify your code. but will have issue when trying to run.

I have not had time to go through this... again and i haven't not got it working yet... as i need to go through the soucre code line by line to see what is coursing this

[Seabizkit]

I have not tried this as... I don't really follow, how this fix's a syntax issue in version 1.2

Your fix: is that for version 1.2

Also I don't think this can be "classed" as a fix.
As it doesn't explain why its not minifing.

Trentrichardson would please shed some light on this.

I believe its a JSLint issues, someone need to go through this....

On another note anyone know when you minify do "if" statements need curly braises...{ }
as everything will be put on one line with no tab indentations....so js will no longer be able to inter-prate your if blocks?

[trentrichardson]

What hanky6 has suggested is swapping out (function(){ })(jQuery) for $(document).ready(); I don't agree with this as they are two completely different things, although by process they achieve one of the same goals, which is encapsulating the code so there are no conflicts with other libraries and code.

However $(document).ready() is an event, which is called when the document is.. well.. ready. (function(){ })(jQuery) is simply encapsulating the code in a function and immediately executing it. There is no waiting on an event, or little overhead.

I went through and "fixed" a lot of the lint warnings, although I don't agree with some of them, like the unexpected end of lines. It is common practice in my opinion to wrap if conditions for instance if the line is running too long. This also occurs on line 1332 with the replace() functions. If anyone is still having trouble with MVC minification I would try placing them all on one line to see if that works. I regularly minify my code, but not with MVC, so MVC must do some extra optimizations that is being broken somewhere.

If anyone gets a chance please report back if this works. My lint changes are in the dev branch to test.

[Seabizkit]

Sozs just tested this did not fix it.

could you include a minified version so that i can test that.

thanks for going thought it and ruling out those syntax recommendations.

[trentrichardson]

I used the simple jsmin, it does nothing more than strip whitespace. I created a gist:

https://gist.github.com/trentrichardson/5125896

You did try the version from the dev branch correct?

[Seabizkit]

gd new i think i worked it out....

(function ($) { // your code starts
$.fn.datetimepicker = function (options) { // wrapper

      //your code

} // end wrapper

})(jQuery); //your code neds

I think the wrapper stuff is the JQuery's standard way of declaring code so that JQuery plugins don't conflict.

Please do not take my word on this...

[Seabizkit]

yeah i tried the dev version

[trentrichardson]

Well to my understanding the wrapper is a good practice even when not using jQuery:

(function(){
    // your code for whatever
})();

This way nothing ever conflicts, regardless if your using mootools, dojo, whichever. So is this fixed you think?

[Seabizkit]

I was talking about ... arround all your code

$.fn.datetimepicker = function (options) { // wrapper

}

i got this idea from another library that i include... called tiptip
http://code.drewwilson.com/entry/tiptip-jquery-plugin

and they warp there plugin like

(function($){
$.fn.tipTip = function(options) {

          //code
}

})(jQuery);

and that bundles fine in MVC4 so i tried that and it works...

yeah i believe
(function(){
// your code for whatever
})();

is standard..... but what about the second wrapper...?

[trentrichardson]

While that is possible, on line 964 we are already doing that. The reason I don't wrap all of it is because there is also $.fn.timepicker() and $.fn.datetimepicker() and while those are pretty similar the do behave differently. So, the var Timepicker = function(){} near the top at line 40 is the base class. This is also similar to how jqueryui datepicker works:

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.datepicker.js

A while back a user reported that the .Net MVC minification didn't work, and that line 40 use to be:

function Timepicker(){

Needed to change to how it is now:

var Timepicker = function(){

But, perhaps some of the changes I made earlier today was actually the problem and this should change back (to be just like datepicker)?

[Seabizkit]

OK all i can tell you so far is:

function Timepicker(){
and
var Timepicker = function(){

have the same result.

there is a issue with:
$.fn.datetimepicker = function (options) { // wrapper
as the first call to the picker doesn't register.

so still no fix yet....its frustrating as i bet its something simple.