locked
Rendering Amazon affiliate code RRS feed

  • Question

  • Hi

    I wish to render the following Amazon affiliate code in my LS HTML Client.

    This code shows a blank screen. Any ideas any one? Thanks, Mark.

    myapp.ViewStoreGroup.ScreenContent1_render = function (element, contentItem) {
    
        element.innerHTML = '<script type="text/javascript"><!--amazon_ad_tag = "httpwwwskeman-20"; amazon_ad_width = "600"; amazon_ad_height = "520";//--></script><script type="text/javascript" src="http://ir-na.amazon-adsystem.com/s/ads.js"></script>';
    
    };


    Mark

    Thursday, November 20, 2014 7:52 AM

All replies

  • Hi,

    UI Customization in the LightSwitch HTML client is accomplished through the render and postRender events.

    For example, you may want to add a jQuery Mobile class to a DOM element created by LightSwitch. We’ll also use the postRender event to change the screen header dynamically .

    For more information,please check article below:

    http://blogs.msdn.com/b/lightswitch/archive/2012/12/06/custom-controls-and-data-binding-in-the-lightswitch-html-client-joe-binder.aspx

    Best Regards,


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.




    Friday, November 21, 2014 5:50 AM
  • Hi Qimin

    Thanks for the information.

    I tried to follow the examples but I'm stumped!

    Can you maybe check out the following and let me know if you can help me out.

    The container for my postrender is as per the 1st screen-shot below:

    The code is as follows:

    myapp.ViewStoreGroup.ScreenContent1_render = function (element, contentItem) {
        // element.innerHTML = '<img src="Content/Images/Advert.png"/>'
        var cont = $('<p><script type="text/javascript"><!--amazon_ad_tag = "httpwwwskeman-20"; amazon_ad_width = "600"; amazon_ad_height = "520";//--></script><script type="text/javascript" src="http://ir-na.amazon-adsystem.com/s/ads.js"></script></p>');
        cont.appendTo($(element));
    };

    The above code gives a blank screen.

    If I un-comment the 1st line above and comment the Amazon code (see below), I see the 2nd screen-shot where my image does appear.

    myapp.ViewStoreGroup.ScreenContent1_render = function (element, contentItem) {
        element.innerHTML = '<img src="Content/Images/Advert.png"/>'
        // var cont = $('<p><script type="text/javascript"><!--amazon_ad_tag = "httpwwwskeman-20"; amazon_ad_width = "600"; amazon_ad_height = "520";//--></script><script type="text/javascript" src="http://ir-na.amazon-adsystem.com/s/ads.js"></script></p>');
        // cont.appendTo($(element));
    };

    How do I make the advert display rather than the image?

    Many thanks


    Mark

    Monday, November 24, 2014 6:55 AM
  • First you should know the content of the js file.

    instead of cont.appendTo($(element));


    • Edited by dns jinung Monday, November 24, 2014 7:29 AM
    Monday, November 24, 2014 7:19 AM
  • Hi Pdasg

    Can you please give an example I can follow.

    Many thanks, Mark.


    Mark

    Monday, November 24, 2014 7:38 AM
  • add a js file

    <script type="text/javascript" src="Scripts/moment.js" charset="utf-8"></script>

    render use the js file

    contentItem.dataBind("value", function (value) {
            if (value) {
                $(element).text(moment(value).format("DD/MM/YYYY"));
            }
        });

    Monday, November 24, 2014 7:42 AM
  • Hi Again

    This is probably a case of too much "copy/paste" but as you know LS coders aren't as good as you guys ;-)

    Here's the content of my Amazon.js file that I added to the Scripts folder:

    amzn_assoc_ad_type = "responsive_search_widget";
    amzn_assoc_tracking_id = "httpwwwskeman-20";
    amzn_assoc_link_id = "UH6M52NBPEVOMFNR";
    amzn_assoc_marketplace = "amazon";
    amzn_assoc_region = "US";
    amzn_assoc_placement = "";
    amzn_assoc_search_type = "search_widget";
    amzn_assoc_width = "auto";
    amzn_assoc_height = "auto";
    amzn_assoc_default_search_category = "";
    amzn_assoc_default_search_key = "";
    amzn_assoc_theme = "light";
    amzn_assoc_bg_color = "FFFFFF";

    And here's the code that I am very unsure of:

    myapp.ViewStoreGroup.ScreenContent1_render = function (element, contentItem) {
        var cont = '<script type="text/javascript" src="Scripts/moment.js" charset="utf-8"></script><script src="//z-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&Operation=GetScript&ID=OneJS&WS=1&MarketPlace=US"></script>';
        contentItem.dataBind(cont, function (value) {
            if (value) {
                $(element).text(moment(value).format("DD/MM/YYYY"));
            }
        });
    };

    Please give me some pointers on how to get this working.

    Thanks, Mark.


    Mark

    Monday, November 24, 2014 9:00 AM
  • I don't think amazon.js is supported in ls.
    Tuesday, November 25, 2014 1:51 AM