jQuery - disable / removing javascript from iframe - javascript

I have an iframe inside my page with the following code:
...
<script language="javascript" type="text/javascript">
function clearMessage() {
window.print();
}
$(function () {
var state=0;
if (state==1) {
window.print();
window.opener.location = window.opener.location.href;
}
var sentToPrint=0;
if (sentToPrint==1)
{
window.print();
window.opener.location = window.opener.location.href;
}
});
window.onunload = refreshParent;
function refreshParent() {
if (('1') == '1') {
window.opener.location = window.opener.location.href;
//window.opener.location = 'mainPage.aspx'
}
}
</script>
...
Basically what it does is printing the page on form submit or if I having
"print=1" in the URL, which in my case I sending "print=0" because I don't want the iframe to be printed.
so I want to disable this part or removing this part form my parent page using jQuery.
Is there any way to disable the printing function or removing it from the iframe?
thank you!

If you don't want iframe part to be printed then use print media query #media print to hide that iframe while printing
#media print {
iframe {
display: none;
}
}

Finally, I found how to submit the form without printing the page,
I just copied the inputs from the iframe and submitted the form using ajax
$('#myFrame').one('load', function(){
var eventTriger = $("#myFrame").contents().find("#__EVENTTARGET").val();
var eventArgu = $("#myFrame").contents().find("#__EVENTARGUMENT").val();
var viewState = $("#myFrame").contents().find("#__VIEWSTATE").val();
var json = {
'__EVENTTARGET' : eventTriger,
'__EVENTARGUMENT' : eventArgu,
'__VIEWSTATE' : viewState
};
var request = $.ajax({
url: "url",
type: "POST",
data: json,
dataType: "html"
});
});

Related

Objects generated by javascript vanish right after appearing

On a button click I'm calling a python script and I'm populating the result into an array. Once done, I create <a href> as many <a href> objects as the length of the array. Problem is, once the links are displayed, they vanish immediately.
Body:
//I obviously get the same effect by putting the onclick event in the submit button
window.onload = function() {
alert("loaded");
document.getElementById('submit_searchsubs').onclick = function () {
FindSubtitles();
};
};
function FindSubtitles() {
postData = {"movie": "Outlander", "season":"1", "episode":"2"};
$.ajax({
url: "/cgi-bin/find_subtitles.py",
type: "post",
datatype:"json",
async : false,
data: {postData},
success: function(response){
var subs = new Array();
var json = $.parseJSON(response);
for (var i=0;i<json.length;++i) {
subs[i] = new Array(json[i].IDSubtitle, json[i].SeriesEpisode, json[i].SubHash, json[i].SubDownloadsCnt, json[i].SeriesSeason, json[i].ZipDownloadLink, json[i].MovieName, json[i].id, json[i].SubFileName);
}
DisplaySubtitles(subs); //show the users the new words found in this subtitle
}
})
.fail(function(err) {
alert("error" + err);
});
}
function DisplaySubtitles(subs) {
var SubtitleDiv = document.getElementById("SubtitleDiv");
var a = document.createElement('a');
for (i = 0; i < subs.length; i++) {
var linkText = document.createTextNode(subs[i][8]);
a.appendChild(linkText);
SubtitleDiv.appendChild(a);
}
}
So what happens:
Page loads
alert("loaded") is displayed as it's fired in window.onload
FindSubtitles runs
DisplaySubtitles runs and <a> links appear
<a> links disappear and alert("loaded") is displayed again.
I don't know if I should use async: true, because in that case I get [Object object] error, which is strange because in case of another script I use that, otherwise it would freeze the UI.
Any ideas?
As Kieveli mentioned, if submit_searchsubs is a form button that submits, it may be refreshing the page after submit. Try using return false; to bypass the default browser onclick action.
document.getElementById('submit_searchsubs').onclick = function () {
FindSubtitles();
return false;
};

Form is not posted in IE in mvc?

My form is submitted correctly in all browser all functions working right. But In IE the form is not posted.
I have searched and found the issue of cache. But nothing works. This is my code.
$('#newUserForm').submit(function () {
debugger;
var form = $(this);
var url = form.attr('action');
var formData = form.serialize();
$.ajaxSetup({ cache: false });
$.post(url, formData, function (result) {
if (result.redirect) {
window.location.href = result.redirect;
return;
} else {
UserRoles.cleanData();
}
});
return false;
});
Remove the debugger; line from your js. I believe your form works in ie, but only while the developer console is open. The ie stops all script execution after a console.log() for example, while the dev console is closed.
As a workaround, you could ask the window object if a console is opened:
if (window.console) {
debugger;
}

creating new iframe after closing old one

I have an Iframe with fields which sent data to php file through ajax. If it was successful I close (it is working) iframe and create new one with another information (doen't work). So question is: how to close the old iframe and open another one?
so here is ajax function that works but doesn't open a new iframe
$.ajax({
type: "POST",
url: "sign.php",
data: {name : name,
data: canvasData
},
success: function () {
//frame_activation(); //if it will be here it will open iframe inside the old one iframe.
alert('done');
close_frame ();
$(body).html(argument[0]);
//windows.top.frame_activation();
frame_activation(); // does't work
}
});
So the result is - the old iframe sent information and close it, but doesn't open a new iframe.
frame activation :
function frame_activation() {
//document.getElementById('bg_frame').style.visibility = 'visible';
reg = document.createElement('iframe');
document.body.appendChild(reg);
reg.id = 'iframe';
reg.src = 'activate.html';
reg.style.width='600px';
reg.style.height='200px';
position_frame(reg);
reg.style.border='solid 5px #d4d4d4';
alert('here');
return false;
}
function to close iframe:
function close_frame () {
parent.document.getElementById('bg_frame').style.visibility = 'hidden';
var el = parent.document.getElementById('iframe');
el.style.display='none';
parent.document.body.removeChild(el);
return(false);
}
function for creating first iframe with fields
function frame_reg() {
document.getElementById('bg_frame').style.visibility = 'visible';
reg = document.createElement('iframe');
document.body.appendChild(reg);
reg.id = 'iframe';
reg.src = 'frame.html';
reg.style.width='640px';
reg.style.height='400px';
position_frame(reg);
reg.style.border='solid 5px #d4d4d4';
return false;
}
You can change src of iframe to change a page display.
This is sample using Jquery :
$(document).ready(function () {
$("#btnMenu1").click(function () {
$("#myIframe").attr("src", "example.aspx");
});
});

AJAX loading a page without reload

I am trying to load content from a new page using AJAX. The test website I am working on is dev.dog-company.com.
This is my code:
$('a[rel="load"]').click(function(){
//var siteurl = "";
var link = $(this).attr("href");
$(this).attr("href", '#');
$('#slider-wrapper').slideUp();
$('#content').wrap('<div id="wrap"></div>').css('opacity', '0.75').css('background-color', 'black');
$.ajax({
type: 'POST',
url: link,
success : function(data){
var response = $(data);
var head= response.find('head');
var slider = response.find('#slider-wrapper');
var content = response.find('#content');
$('#content').unwrap('<div id="wrap"></div>')
jQuery("head").html(head);
if(slider != null)
jQuery("#slider-wrapper").html(slider).slideDown();
jQuery("#content").html(content);
return false;
}
$(this).attr("href", link);
})
});
I am trying load the content on click but the page reload everytime without the click working. Also I am not sure if I need to be doing something else other than what I am doing to my code. The rel="load" is only on home, info->AboutUs & FAQ.
Your help is appreciated.
Update:
I still can't get it to work. This is my latest code. And the site is still running it. When i use the debugging for chrome it never goes through my code. is it the re="load" that is causing the problem?
Update:
My initial problem was not having the document ready. But not I think the way I am parsing the information isn't working. I tried find and filter both seem to not work correctly. Also how do I change the url in the browser after I it pushes the post.
Update
After a lot of messing around with it I got it to partially work. One thing I can't do it replace head. and then the data pushed in slider is there but it does not seem to work on the website. It doesn't slide down like I have it in the code.
$('document').ready(function() {
$('a[rel="load"]').click(function(e){
//var siteurl = "";
e.preventDefault();
var link = $(this).attr("href");
$('#slider-wrapper').slideUp();
$('#content').wrap('<div id="wrap-overlay"></div>');
/*$('#wrap').css({
'opacity': '0.75',
'background-color': 'black',
'z-index' : '10'
});*/
$.ajax({
//ajax setting
type: 'POST',
url: link,
dataType: 'html',
success : function(data){
//parse data
var response = $("<div>").html(data);
console.log(typeof(response));
console.log(response);
//var head = response.find('<head>').html();
slider = response.find('#slider-wrapper').html();
var content = response.find('#content').html();
console.log(content);
//console.log(head);
//console.log(slider);
//Post data
$('#content').unwrap();
//jQuery("head").empty().append(head);
if(slider != null){
jQuery("#slider-wrapper").empty().slideDown().append(slider);
}
jQuery("#content").empty().append(content);
return false;
}
})
});
});
Try this:
$('a[rel="load"]').click(function(e) {
e.preventDefault();
// ...
});
You need to stop default browser behaviour on link click, which is following it.

function doesn't work after ajax succesfully sent data

I have an Iframe with formwhi fields wich sent data to php file through ajax. If it was successful I close iframe (it is working) and create new one with another information. So question is: how to close the old iframe and open another one?
so here is ajax function that works but doesn't open a new iframe
the function opening a new iframe work by it self but doesn't work in ajax. Where is a problem?
$.ajax({
type: "POST",
url: "sign.php",
data: {name : name,
data: canvasData
},
success: function () {
//frame_activation(); //if it will be here it will open iframe inside the old one iframe.
alert('done');
close_frame (); //closing frame with form
$(body).html(argument[0]);
//windows.top.frame_activation();
frame_activation(); // does't work, doesn't open a new iframe
}
});
So the result is - the old iframe sent information and close it, but doesn't open a new iframe.
frame activation :
function frame_activation() {
//document.getElementById('bg_frame').style.visibility = 'visible';
reg = document.createElement('iframe');
document.body.appendChild(reg);
reg.id = 'iframe';
reg.src = 'activate.html';
reg.style.width='600px';
reg.style.height='200px';
position_frame(reg);
reg.style.border='solid 5px #d4d4d4';
alert('here');
return false;
}
function to close iframe:
function close_frame () {
parent.document.getElementById('bg_frame').style.visibility = 'hidden';
var el = parent.document.getElementById('iframe');
el.style.display='none';
parent.document.body.removeChild(el);
return(false);
}
function for creating first iframe with fields
function frame_reg() {
document.getElementById('bg_frame').style.visibility = 'visible';
reg = document.createElement('iframe');
document.body.appendChild(reg);
reg.id = 'iframe';
reg.src = 'frame.html';
reg.style.width='640px';
reg.style.height='400px';
position_frame(reg);
reg.style.border='solid 5px #d4d4d4';
return false;
}

Categories

Resources