Results 1 to 6 of 6

Thread: Problem reading a page with Ajax loader script

  1. #1
    Join Date
    Sep 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Problem reading a page with Ajax loader script

    1) Script Title: Dynamic Ajax Content

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...jaxcontent.htm

    3) Describe problem:

    I'm trying to load a page, but I'm not getting any result.

    Page trying to load: http://review.bovag.nl/00968600/widgetframe.js

    I think the problem is that the page has .js extension, but it returns HTML.

    The aim is to get this HTML in my page, like the 'Ferrari' and 'Porsche' pages are doing in the example.

    Anyone able to help me out?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Put it in an iframe:

    HTML Code:
    <iframe src="http://review.bovag.nl/00968600/widgetframe.js" width="302" height="79" hspace="0" vspace="0" scrolling="no" frameborder="0"></iframe>
    Put that on your page. Or put it in an external file on your domain and fetch that file using the AJAX script.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Sep 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I wanna avoid the iframe, since I wanna alter the content. (add some CSS)

    And since the content is dynamic in the .js, I can't just copy it and place it in my own .html file. I really need to read it again each time.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    No matter what you do, if it's not on your domain, you would need server side code to do that. That's because you cannot import cross domain with AJAX. You could access the code in the iframe and do things with that, but again only if it were on your domain.

    Regardless of where it is though, you could just take its HTML code and place that on your page or on an external page on your domain:

    HTML Code:
    <div style="background-image:url(http://review.bovag.nl/images/kvbovagwidgetbg.jpg);height:79px;width:300px;">
    <div style="position:relative;left:60px;top:27px;width:230px;font-family:\'Lucida Grande\',\'Lucida Sans Unicode\',\'Lucida Sans\',Tahoma,Arial;font-size:11px;line-height:1.3em;color:#000">
    Klanten beoordelen ons met een <strong>8,1</strong>.<br />95% beveelt ons aan.
    </div>
    <a href="http://www.bovag.nl/index.php?pageID=59&catalog=membercars&externalID=00968600" target="_blank" style="line-height:1.3em;position:relative;top:29px;left:60px;font-family:\'Lucida Grande\',\'Lucida Sans Unicode\',\'Lucida Sans\',Tahoma,Arial;font-size:10px;background:url(http://review.bovag.nl/images/bg_submit.png) no-repeat scroll right top transparent;color:#FFFFFF;display:inline-block;height:21px;line-height:20px;overflow:hidden;margin-right:3px;text-decoration:none;width:130px;"><span style="margin-left:5px">Bekijk beoordelingen</span></a>
    <a href="http://review.bovag.nl/enquete/00968600/" target="_blank" style="line-height:1.3em;position:relative;top:29px;left:60px;font-family:\'Lucida Grande\',\'Lucida Sans Unicode\',\'Lucida Sans\',Tahoma,Arial;font-size:10px;background:url(http://review.bovag.nl/images/bg_submit.png) no-repeat scroll right top transparent;color:#FFFFFF;display:inline-block;height:21px;line-height:20px;overflow:hidden;text-decoration:none;width:105px;"><span style="margin-left:5px">Beoordeel zelf</span></a>
    </div>
    Is it on your domain?

    If so, you might be able to use a more complex AJAX call. If it's not on your domain, just use the above HTML instead. That will also work even if it is on your domain.

    And what style did you have in mind? If all you want is a border and/or background, you could do that with an iframe. If you want to change the style of the tags in its HTML, it would probably be easiest to just use the HTML code.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Sep 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Sorry missed the notification of a new reply.

    This ain't on the same domain, but I might be able to convince them to alter the widget a little.

    Is there a specific header I can set on the external file, so it will be available for the ajax loader?

    I wanna make some more changes then just the border. (alter bg-image, link images, overall width etc)

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Use the HTML code then, no header:

    HTML Code:
    <div style="background-image:url(http://review.bovag.nl/images/kvbovagwidgetbg.jpg);height:79px;width:300px;">
    <div style="position:relative;left:60px;top:27px;width:230px;font-family:\'Lucida Grande\',\'Lucida Sans Unicode\',\'Lucida Sans\',Tahoma,Arial;font-size:11px;line-height:1.3em;color:#000">
    Klanten beoordelen ons met een <strong>8,1</strong>.<br />95% beveelt ons aan.
    </div>
    <a href="http://www.bovag.nl/index.php?pageID=59&catalog=membercars&externalID=00968600" target="_blank" style="line-height:1.3em;position:relative;top:29px;left:60px;font-family:\'Lucida Grande\',\'Lucida Sans Unicode\',\'Lucida Sans\',Tahoma,Arial;font-size:10px;background:url(http://review.bovag.nl/images/bg_submit.png) no-repeat scroll right top transparent;color:#FFFFFF;display:inline-block;height:21px;line-height:20px;overflow:hidden;margin-right:3px;text-decoration:none;width:130px;"><span style="margin-left:5px">Bekijk beoordelingen</span></a>
    <a href="http://review.bovag.nl/enquete/00968600/" target="_blank" style="line-height:1.3em;position:relative;top:29px;left:60px;font-family:\'Lucida Grande\',\'Lucida Sans Unicode\',\'Lucida Sans\',Tahoma,Arial;font-size:10px;background:url(http://review.bovag.nl/images/bg_submit.png) no-repeat scroll right top transparent;color:#FFFFFF;display:inline-block;height:21px;line-height:20px;overflow:hidden;text-decoration:none;width:105px;"><span style="margin-left:5px">Beoordeel zelf</span></a>
    </div>
    You can put that right on your page where you want the image to appear, or you may put that and only that in an external file on your domain and fetch it via AJAX.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •