I'm working on a project which passes a variable into a iFrame with this code:
jQuery(function() {
var search = window.location.search;
jQuery(".iframe-wrapper").attr("src", jQuery(".iframe-wrapper").attr("src")+search);
});
But, when I pass through §ion=P1 in a URL, it just gives a 404.
Source of the iFrame: example.com/page?cart=1
After going to site.com/§ion=P1 the iFrame should change to example.com/page?cart=1§ion=P1
Anyway to pass through the §ion=P1 through the URL?
Please send your HTML as mine is working fine with the below:
<iframe width="500" height="200" class="iframe-wrapper" src="http://www.google.com?param=1"></iframe>
<script type="text/javascript">
$(function() {
var search = window.location.search;
search = search.replace("?","&");
$(".iframe-wrapper").attr("src", $(".iframe-wrapper").attr("src")+search);
});
</script>
Related
I'm trying to integrate TrackerRMS on my WORDPRESS website. On the main jobs page, I have an iframe that produces a listing of jobs.
<iframe frameborder="0"
scrolling="yes"
width="1000"
height="780"
src="https://evoportalus.tracker-rms.com/mycompany/jobs?
theme=purplehaze
&fields=title,worktype,location,salaryfrom,salaryto,sector,joblink
&joblinkuri=http://example.com/jobs-detail&joblinktarget=_parent&filters=">
</iframe>
Once displayed, there is a button on the page with a link to apply for that job is in this format:
http://example.com/jobs-detail?jobcode=1234
The problem is that I need to be able to pass the number, 1234, into this iframe code, on the jobs-detail page.
<iframe frameborder="0"
scrolling="no"
width="100%"
height="700"
src="https://evoportalus.tracker-rms.com/mycompany/jobs
?theme=purplehaze
&fields=reference,title,location,worktype,description,linkregister
&filters=reference|JOBCODE-NUMBER-NEEDS TO APPEAR HERE">
</iframe>
What do I need to add to the second iframe code on the jobs-detail page to grab the jobcode number from the URL, and append it after the "reference|"?
Note again, this is a Wordpress site, so I'm just using a shortcode to insert raw HTML code onto the page.
Thank you.
Apparently this works, by adding this code to the jobs-detail page:
<script type="text/javascript">
loadSite();
function getQueryString (field, url) {
var href = url ? url : window.location.href;
var reg = new RegExp('[?&]' + field + '=([^&#]*)', 'i');
var string = reg.exec(href);
return string ? string[1] : null;
};
function loadSite() {
var site = "https://evoportalus.tracker-rms.com/mycompany/jobs";
site += "?theme=purplehaze&fields=reference,title,location,worktype,description,linkregister&filters=reference|" + getQueryString("jobcode");
console.log(site);
document.getElementById('trmsjobs').src = site;
}
I am using http://instafeedjs.com/ to display Instagram feed in my WordPress site.
I have included this file:
<script type="text/javascript" src="path/to/instafeed.min.js"></script>
<script type="text/javascript">
var feed = new Instafeed({
get: 'tagged',
tagName: 'awesome',
clientId: 'YOUR_CLIENT_ID'
});
feed.run();
and added into the page <div id="instafeed"></div>. But this displays
ReferenceError: Instafeed is not defined
error in the Firebug, and the feed not displays.
Does anyone know solutions to fix this?
Try to wrapp your code in some delay function, like this:
<script type="text/javascript">
jQuery(document).ready(function(){
var feed = new Instafeed({
get: 'tagged',
tagName: 'awesome',
clientId: 'YOUR_CLIENT_ID'
});
feed.run();
});
</script>
You called your instafeed.min.js after your code, thats why you get Not Defined error.
Another solution will be to call instafeed.min.js file before your code in Dom: in header, in body, up to your code. In this case you can use your code without wrapping in delay functions
I want to embed the Google Adwords Conversion Tracking Code into my Meteor app:
<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = XXX;
var google_conversion_language = "en";
var google_conversion_format = "3";
var google_conversion_color = "ffffff";
var google_conversion_label = "XXXX";
var google_remarketing_only = false;
/* <![CDATA[ */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js"></script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="//www.googleadservices.com/pagead/conversion/XXXX/?label=XXXX&guid=ON&script=0"/>
</div>
</noscript>
I tried to put it right into the html code of a template and I tried to append it to the html after the template rendered:
Template.success_page.rendered = function () {
$("body").append(
'.....');
}
Both ways do not work. The Tag Assistant Chrome Plugin gives me the error "No HTTP response detected".
And on the browser console I can see
"Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened."
How do I have to embed it to make it work?
I just integrated it using this:
https://developers.google.com/adwords-remarketing-tag/asynchronous/
It is coming from a remarketing perspective, but the conversion tag and the remarketing tag are basically the same thing.
Just set "google_remarketing_only" to false
I am creating a preview for users entering html but I am having problems sharing the html across an iframe.
I have the following javascript
$(function () {
var pathname = "https://" + document.domain + "/newspreview.aspx";
localStorage.contents = $("#<%=Content.ClientID%>").val();
$("#preview").attr("src", pathname);
});
and the html is
<iframe id="preview" style="border:2px solid; width:880px;height:600px;" >
</iframe>
on the newspreview.aspx page I have the javascript below, all I get displayed is undefined.
Has anybody got any ideas why this is the case. (BTW both pages are using https)
<script type="text/javascript" language="javascript">
var result = localStorage.contents;
document.write(result);
localStorage.removeItem("contents");
</script>
Regards
Podge
I have an html image, and I am trying to figure out if it is possible to do a partial page refresh when someone clicks on the image. I was thinking I would use a javascript. I am using aspx, and mvc model
Here is my thought
<img id = "Img1" , alt = "Click me" src = /content/img1.gif/>
my script would look something like
<script type = "text/javascript" src ="../../Scripts/jquery-1.5.1.js" >
$(function()
{
$("#Img1").click(function()
{
$('#updatePartialView'). load('#Url.Action("myAction", "myController")');
});
});
</script>
but it doesn't seem to want to work, I don't even know if it is possible .
--Update per Comment
I have a series of images on the top, and when the user click on the images the bottom half of the page refreshes with information about that picture.
---update so I wanted to try something different but it doesn't work see below
<script type = "text/javascript" src ="../../Scripts/jquery-1.5.1.js" >
$(function()
{
$("#Img1").click(function()
{
alert("I clicked this");
});
});
</script>
Just remove closing ");" in your end of javascript myFunction(). It would be working.
But I would suggest to add the onclick handler as below.
<img id = "Img1" alt = "Click me" src="">
Script:
<script src="#Url.Content("~/Scripts/jquery-1.5.1.js")" type="text/javascript"></script>
<script type = "text/javascript">
$(function(){
$("#Img1").click(function(){
$('#updatePartialView').load('#Url.Action("myAction", "myController")');
});
});
</script>