I am new to Heroku and trying to get my app working on it. All works fine except non of my scrips are working. I have a PHP header file that provides all the links to e.g. jQuery etc. which I have stored in the js directory.
<title><?=$head_title;?></title>
<link href="css/admin.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
<script src="js/animatedcollapse.js" language="Javascript" type="text/javascript"></script>
<script src="js/functions.js" language="Javascript" type="text/javascript"></script>
I have an apache dyne (heroku-php-apache2) and a ClearDB MySQL database. How do I get jQuery running on Heroku?
Related
I have a Magento website that I have cloned to my local machine running through MAMP Pro with a custom host name e.g: project.local
The issue is, the is a function in the file:
app/design/frontend/default/project/template/page/html/head.phtml
which includes a number of css/js files however the include path seems to be wrong using the base url/directory: /Applications/MAMP/htdocs/project_name/ which results in the files not being found. The function is:
$this->getCssJsHtml()
Here is a list of the files in question which I have taken from the source:
http://i.xomf.com/dcmsw.png
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/styles.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/base/default/css/widgets.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/base/default/css/bubble/elasticsearch.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/inchoo_socialconnect/google/css/button.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/inchoo_socialconnect/facebook/css/button.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/ajax-cart.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/font-awesome.min.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/tablet.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/ie_10.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/print.css" media="print" />
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery-1.7.2.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.noconflict.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.joypopup.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/prototype/prototype.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/lib/ccard.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/prototype/validation.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/builder.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/effects.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/dragdrop.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/controls.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/slider.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/varien/js.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/varien/form.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/mage/translate.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/mage/cookies.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/quickbuy.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/topmenu.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/event.simulate.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/html5.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/ajax_cart.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.CustomScrollbar.min.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.selectbox-0.2.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.maketabs.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.instagram.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.minitwitter.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.placeholder.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.jqzoom-core-pack.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/main.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/social_login.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/utagtracking.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/play_video.js"></script>
Just to be clear, these are the only places that are effected. The other includes seem to relate to the base url set in the database: core_config_data.
I'm not sure if this is anything to do with MAMP Pro and the Virtual Hosts set-up, but needless to say I have tried everything I can after searching many... many hours on the internet for a solution with no success.
I would appreciate any help, thanks again in advance.
Typically simple problem, have you cleared js/css cache. This happens often when the server is moved from one location to the next because the directory path is cached when merged. Disabling Merge JS and Css files in system->developer javascript and css settings will correct the problem however you have to do some front-end hackery in order to actually save the value.
A way to verify this problem is to run the following query
SELECT *
FROM `core_config_data`
WHERE `path` LIKE '%merge%
If these values are set to 1 this will cause your problem, much easier to disable set to "0" this value via Database directly considering you have access. Then Clear Magento cache including JS / CSS cache and this should resolve your problem
Screen shot of what this should look like:
I always have some problems with IE. The problem is that my website must work on every browser, including IE.
Everything works well for the ckeditor plugin named prgfilemanager (I can add pictures into my ckeditor textarea). Every browser are working except IE... I first succeed displaying ckeditor using
<meta http-equiv="X-UA-Compatible" content="IE=9.0">
Without that meta, the textarea isn't a ckeditor textarea.
My problem is that when I try to add pictures, nothing happens ONLY IN IE.
When I click to search pictures there is a popup with the interface with no root..
If i write http://XXX/ckeditor/plugins/pgrfilemanager/PGRFileManager.php?type=Image&CKEditor=Description&XXX everything works well on every browser except for IE..
I'm on IE9. How to make pgrfilemanager working on IE 9 ?
This is what IE gives me
I found how to make it work. As I said, I used <meta http-equiv="X-UA-Compatible" content="IE=9.0"> in my files to make ckeditor working. What to do if you have the same problem that I HAD, in ckeditor\plugins\pgrfilemanager, open PGRFileManager.php and add the meta <meta http-equiv="X-UA-Compatible" content="IE=9.0"> on the <head>. Like
<head>
<!-- ADD THIS -->
<meta http-equiv="X-UA-Compatible" content="IE=9.0">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>PGRFileManager v2.1.0</title>
<link rel="stylesheet" type="text/css" href="css/sunny2/jquery-ui-1.8.1.custom.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.treeview.css" />
<link rel="stylesheet" type="text/css" href="css/fancybox/jquery.fancybox.css" />
<link rel="stylesheet" type="text/css" href="css/PGRFileManager.css" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.treeview.js"></script>
<script type="text/javascript" src="SWFUpload v2.2.0.1 Core/swfupload.js"></script>
<script type="text/javascript" src="js/jquery.i18n.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.2.1.pack.js"></script>
<?php if (PGRFileManagerConfig::$ckEditorScriptPath):?>
<script type="text/javascript" src="<?php echo PGRFileManagerConfig::$ckEditorScriptPath ?>"></script>
<?php endif;?>
<script type="text/javascript" src="lang/lang.js"></script>
<script type="text/javascript" src="js/PGRUploader.js"></script>
<script type="text/javascript" src="js/PGRContextMenu.js"></script>
<script type="text/javascript" src="js/PGRSelectable.js"></script>
<script type="text/javascript" src="js/PGRFileManager.js"></script>
<script type="text/javascript" src="js/PGRFileManagerContent.js"></script>
</head>
In my project I am using imperavi-redactor library. But it seems it doesn't load properly.
When using the import() method, the library is properly loaded in the assets, but it doesn't work. If I modify the template I am using to manually load the css/js AFTER all other libraries, it works.
Here is the generated HTML:
<head>
<link rel="stylesheet" type="text/css" href="/assets/92dfc12c/redactor.css" />
<link rel="stylesheet" type="text/css" href="/assets/f5a106d4/jui/css/base/jquery-ui.css" />
<script type="text/javascript" src="/assets/f5a106d4/jquery.js"></script>
<script type="text/javascript" src="/assets/92dfc12c/redactor.js"></script>
<script type="text/javascript" src="/assets/92dfc12c/lang/es_ar.js"></script>
<title>Create Notification</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/themes/p35/css/main.css" rel="stylesheet" type="text/css" media="all">
<link href="/themes/p35/css/mediaqueries.css" rel="stylesheet" type="text/css" media="all">
<!--[if lt IE 9]>
<link href="/themes/p35/css/ie/ie8.css" rel="stylesheet" type="text/css" media="all">
<script src="/themes/p35/js/ie/css3-mediaqueries.min.js"></script>
<script src="/themes/p35/js/ie/html5shiv.min.js"></script>
<![endif]-->
<!-- Slider -->
<link href="/themes/p35/js/responsiveslides.js-v1.53/responsiveslides.css" rel="stylesheet" type="text/css" media="all">
<!-- Redactor -->
<link rel="stylesheet" type="text/css" href="/assets/54ed052f/imperavi-redactor/redactor.css"/>
<!-- Scripts -->
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>
<script src="/themes/p35/js/jquery.ba-bbq.js"></script>
<script>window.jQuery || document.write('<script src="/themes/p35/js/jquery-latest.min.js"><\/script>\
<script src="/themes/p35/js/jquery-ui.min.js"><\/script>')</script>
<script>jQuery(document).ready(function($){ $('img').removeAttr('width height'); });</script>
<script src="/themes/p35/js/responsiveslides.js-v1.53/responsiveslides.min.js"></script>
<script src="/themes/p35/js/jquery-mobilemenu.min.js"></script>
<script src="/themes/p35/js/custom.js"></script>
<!-- Redactor -->
<script src="/assets/54ed052f/imperavi-redactor/redactor.min.js"></script>
<script src="/assets/54ed052f/imperavi-redactor/lang/es_ar.js"></script>
</head>
Notice how redactor.css, redactor.js and es_ar.js are included twice... The first time each file is included is because of using the regular import() method. The second time they are included is beacuse of manually modifying the template to include them.
I could forget about importing the module regularly, and just changing my theme to load required files all other libs, but I don't like it, and also it would be always loading a library that is only used in a few views.
Any idea of how could I manage to make the import() method work for me?
I can't tell from your code whether you're already using it, but I'd personally recommend the Yii-redactor extension. It handles all the registration of script files for you, all you do it create a redactor widget.
See here http://www.yiiframework.com/extension/redactor/
My saved credit card payment option works well in default magento theme but not working in a custom theme. When we click on "Credit Card (saved)" option nothing happens. No textbox or dropdown is showing up with options to enter card details.
When we click to proceed to next step,the validation error pops up as usual.
I think some where javascript is breaking up. But error console shows no errors as well! Can anyone point out what may be the possible reasons with this error? What is the js needed to get Saved credit card option work?
I am getting this error in a jquery-mobile theme and my header has following parameters..
<script type="text/javascript" src="js/prototype/prototype.js"></script>
<script type="text/javascript" src="js/lib/ccard.js"></script>
<script type="text/javascript" src="js/prototype/validation.js"></script>
<script type="text/javascript" src="js/scriptaculous/builder.js"></script>
<script type="text/javascript" src="js/scriptaculous/effects.js"></script>
<script type="text/javascript" src="js/scriptaculous/dragdrop.js"></script>
<script type="text/javascript" src="js/scriptaculous/controls.js"></script>
<script type="text/javascript" src="js/scriptaculous/slider.js"></script>
<script type="text/javascript" src="js/varien/js.js"></script>
<script type="text/javascript" src="js/varien/form.js"></script>
<script type="text/javascript" src="js/varien/menu.js"></script>
<script type="text/javascript" src="js/varien/payment.js"></script>
<script type="text/javascript" src="js/varien/product.js"></script>
<script type="text/javascript" src="js/mage/translate.js"></script>
<script type="text/javascript" src="js/mage/cookies.js"></script>
<script type="text/javascript" src="js/mage/directpost.js"></script>
<script type="text/javascript" src="js/mage/captcha.js"></script>
<script type="text/javascript" src="js/mage/centinel.js"></script>
<script type="text/javascript" src="js/varien/weee.js"></script>
<link rel="stylesheet" type="text/css" href="skin/frontend/mytheme/default/jquery.mobile-1.0b3.min.css" media="all" />
<script type="text/javascript" src="skin/frontend/mytheme/default/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="skin/frontend/mytheme/default/main.js"></script>
<script type="text/javascript" src="skin/frontend/mytheme/default/jquery.mobile-1.0b3.min.js"></script>
<script type="text/javascript" src="skin/frontend/mytheme/default/additional.js"></script>
<link rel="stylesheet" type="text/css" href="skin/frontend/mytheme/default/mobilephone.css" media="all" />
<link rel="stylesheet" type="text/css" href="skin/frontend/mytheme/default/mobiletheme.css" media="all" />
Here additional.js is Jquery.noConflict(); file.
Am I missing something?
If anyone can point out something, please share.
I found out Why it happens.
The jquery styles were missing in the page. So I gave a create event jQuery('#co-payment-form').trigger("create"); in checkout/onepage/payment/methods.phtml It conflicts the javascript of credit cards.
When I remove the create event. the code works well But Jquery-mobile styles are still missing. I need the styles too.
If anyone knows how to Overcome this situation please share it.
I have a calendar script I got off the internet working fine. Recently, I tried incorporating a jQuery sorting script, but I can't get both working together. It's either the calendar script or the sorting one that works.
I don't have much jQuery experience. I've tried changing the order in lots of ways, changing the jQuery versions and commenting out a bunch of JS scripts but I still can only get either get or one or none of them working.
The page is password-protected and the information being pulled from the database is private, but if it helps I'll try and make a separate page with dummy data; but I hope the mistake is a glaring one.
Here's the page head:
<head>
<title>My Page</title>
<!-- css -->
<link rel="stylesheet" type='text/css' href="stylesheets/datatable.css"/>
<link href="stylesheets/pagination.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="css/jquery-ui-timepicker-addon.css" />
<link rel="stylesheet" media="all" type="text/css" href="css/Aristo.css" />
<!-- scripts -->
<!-- [if lte IE 8]>
<script language="javascript" type="text/javascript" src="scripts/excanvas.js"></script> <![endif] -->
<script type="text/javascript" src="js/jquery-latest.js"></script>
<script type="text/javascript" src="scripts/jquery.datatables.js"></script>
<script type="text/javascript" src="scripts/jquery.fullcalendar.js"></script>
<script type="text/javascript" src="scripts/jquery.placeholder.js"></script>
<script type="text/javascript" src="scripts/jquery.accordion.js"></script>
<script type="text/javascript" src="scripts/jquery.tabbed.js"></script>
<script type="text/javascript" src="scripts/application.js"></script>
<!-- If I enable this, the calendar works but the sorting script stops working:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.23/jquery-ui.min.js"></script> -->
<script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="js/jquery-ui-sliderAccess.js"></script>
</head>
Is there an obvious mistake here? I'm using someone else's jQuery. Let me know if there is any other info I can add that might help with this...
The problem is that you are loading the jQuery library twice when you uncomment the part in question. This will result in the second script overwriting the $ and therefore also all functionality the plugins above have already attached to it (their functions are living inside the $ object).
Simple solution to your problem: Only load jQuery once (preferrably via a CDN), load the original library as the first script, then load its plugins, and then load your own scripts.
The correct order should therefore be:
<!-- Loading jQuery via Google -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<!-- Loading jQuery scripts -->
<script type="text/javascript" src="scripts/jquery.datatables.js"></script>
<script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="js/jquery-ui-sliderAccess.js"></script>
<script type="text/javascript" src="scripts/jquery.fullcalendar.js"></script>
<script type="text/javascript" src="scripts/jquery.placeholder.js"></script>
<script type="text/javascript" src="scripts/jquery.accordion.js"></script>
<script type="text/javascript" src="scripts/jquery.tabbed.js"></script>
<script type="text/javascript" src="scripts/application.js"></script>
Your sorting script and your calendar script are using 2 different versions of jQuery. I assume the one your sorting script is pulling up is conflicting with the calendar one (the one commented out in your code). Specifically:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
and:
<script type="text/javascript" src="js/jquery-latest.js"></script>
are competing with each other.