1

On the Magento admin new product page

/app/design/adminhtml/default/default/template/catalog/product/edit.phtml

I've tried to add the following code

<!-- Start Edits -->
<script src="jquery-2.1.1.js"></script>
<script type="text/javascript" >
//<![CDATA[
alert("This code is running!");
        $(window).load(function(){

function calculate() 
{
    var values = [
        $("#cost").val(), 
        $("#shipping_paid").val(), 
        $("#tax_paid").val()
    ];

    var percent_value = $("#our_markup").val();

    var sub_total = eval( values.join('+') );
    var total = eval("sub_total+(sub_total * percent_value)");
    $("#price").val(total);
}

$(document).on('input', 'input', calculate);
$(document).on('change', 'select,input', calculate);

});
    //]]>
</script>
<!-- End Edits -->

Which will tally up the 3 text fields with id = "cost", "shipping_paid", "tax_paid", and put them in the text field id = "price". But for some reason it does not seem to want to perform correctly.

I have tried it in a stand alone file and all functionality works correctly.

Any help is appreciated!

5

Take a look at How to load a js file on magento admin dashboard

Then create a local.xml for admin and add

<layout>
  <adminhtml_catalog_product_edit>
    <reference name="head">
            <action method="addJs"><script>path/to/jquery.js</script></action>
            <action method="addJs"><script>path/custom/script.js</script></action>         
        </reference>
  </adminhtml_catalog_product_edit>
</layout>

Also because magento default js library is prototype you can not using $ for jQuery see How to add jQuery in Magento

In your custom_script.js chage

...
$(document).on('input', 'input', calculate);
$(document).on('change', 'select,input', calculate);
...

to

...
$j( document ).ready(function() {
  $j(document).on('input', 'input', calculate());
  $j(document).on('change', 'select,input', calculate());
});
...
1
  • That fixed it! It was wrapping in $j( document ).ready(function() { that did the trick. Thank you very much! I had been banging my head against the wall! – new2programming Oct 31 '14 at 13:57
0

Try wrapping your custom function with the jQuery function $(document).ready() instead of using $(window).load(). The native $(window).load() isn't reliable for ensuring that the proper DOM elements are in place before your script runs.

More information about $(document).ready() is available here: http://learn.jquery.com/using-jquery-core/document-ready/

0

Where you include your jquery library, try giving the full path in the src attribute, like this:

<script src="http://www.your-domain.com/skin/path/to/js/jquery-2.1.1.js"></script>

Then, when you load the page, look in the source for this script tag and click it, to check if it shows the jquery file...

then you should use:

$j = jQuery.noConflict();

and use $j instead of just $, because $ is used by prototype in magento.

so you will have something like:

<!-- Start Edits -->
<script src="http://www.your-domain.com/skin/path/to/js/jquery-2.1.1.js"></script>
<script type="text/javascript" >
//<![CDATA[
alert("This code is running!");
    $j = jQuery.noConflict();
        $j(window).load(function(){

function calculate() 
{
    var values = [
        $j("#cost").val(), 
        $j("#shipping_paid").val(), 
        $j("#tax_paid").val()
    ];

    var percent_value = $j("#our_markup").val();

    var sub_total = eval( values.join('+') );
    var total = eval("sub_total+(sub_total * percent_value)");
    $j("#price").val(total);
}

$j(document).on('input', 'input', calculate);
$j(document).on('change', 'select,input', calculate);

});
    //]]>
</script>
<!-- End Edits -->
5
  • Thanks for the suggestions, I made all those changes but to no avail. The alert still runs but NONE of the text-fields are affected. I can't understand where the disconnect is if the file opens up the jquery and the alert runs. – new2programming Oct 30 '14 at 20:41
  • right click in Chrome, choose inspect element, choose the tab console, and see what error is reported there, that should put you on the right track.. – raduparvan Oct 31 '14 at 7:22
  • yeah, that's the bizarre part. not a single issue, just the usual "Failed to load resource: net::ERR_CACHE_MISS" – new2programming Oct 31 '14 at 12:04
  • i tested the script i wrote in admin page of magento and it works. You just need to check and see if #cost, #shipping_paid and #tax_paid have values in them. If they have, then when i input something in #our_markup field, the #price field changes. Try and use console.log($j("#cost")); inside you calculate function. Do that for all variables, and see if it logs something.. – raduparvan Oct 31 '14 at 12:25
  • Thanks for the help! It turns out it was the $j( document ).ready(function() { that the other user suggested that did that trick. – new2programming Oct 31 '14 at 15:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.