I have this page in cshtml.
This page execute submit in "formImpressao" (ASP.NET PAGE)
CSHTML page
#using Web.Mvc.Helpers
#{
string msgSucesso = "test";
}
<div id="divSucess">
<h5 style="background-image: url('themes/base/images/48/ico_ok.gif'); text-align:center; background-repeat: no-repeat; font-family: Verdana; color: #1d7100; font-size:'72'">#msgSucesso</h5>
</div>
<div id="HiddenFormTarget" style="display:none;">
<form id="formImpressao" method="post" target="frmPrint" action="/VisualizarRelatorios/ImprimirRelatorio.aspx"></form>
</div>
<iframe id="frmPrint" name="frmPrint" width="0" height="0" runat="server">
</iframe>
<script language="javascript" type="text/javascript">
$("#formImpressao").submit();
</script>
ASPX Page (ImprimirRelatorio.aspx)
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="ImprimirRelatorio.aspx.cs" Inherits="Views.Views.ImprimirRelatorios.ImprimirRelatorio" %>
<%# Register Assembly="Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"
Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
<%--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">--%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="../Scripts/jquery-1.5.1.js" type="text/javascript"></script>
<script src="../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
</head>
<body style="margin: 0px">
<form id="form1" runat="server" style=" width:100%; height:100%;" >
<div style=" width:100%; height:100%; overflow-y:hidden; overflow-x:hidden" >
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<rsweb:ReportViewer ID="rptRelatorio" runat="server" Width="100%"
Height="100%" ProcessingMode="Remote" >
</rsweb:ReportViewer>
</div>
</form>
</body>
</html>
<script language="javascript">
function Imprimir()
{
var viewer = $find("rptRelatorio");
var isLoading = viewer.get_isLoading();
var impresso = false;
if (!isLoading) {
$("input[type='image']:not(:disabled)[title*='Print']").click();
impresso = true;
}
if (!impresso) {
setTimeout(Imprimir, 1000);
}else {
$("#divSucess").style.backgroundColor = "red";
}
}
$(document).ready(function () {
setTimeout(Imprimir, 4000);
});
</script>
The Imprimir function on validates whether the report was printed within Reporting Services.
If printed, it needs to assign to div divSuccess, the attribute: style.backgroundColor = "red".
The problem is that the asp form does not see the divSuccess and the cshtml page does not display the asp form.
How can I call a js function inside the asp page to play the DOM of the page that has the "divSuccess"?
Are there other ways to do this?
The two pages do not talk.
You could send AJAX request to get content of ImprimirRelatorio.aspx page. In success handler you could parse response to get inner HTML of body tag of the ImprimirRelatorio.aspx page, set result to some container (without <iframe>) and call Imprimir function (see details in AJAX documentation). Note, the Imprimir function should be a part of success event handler of should be defined in the calling page.
Related
I am trying to populate my form in iframe. I need to input a value in textbox and select a value from dropdown menu.
webform1
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="admin-lte/js/app.min.js"></script>
<script src="Scripts/jquery-2.1.3.min.js"></script>
</head>
<body>
<style type="text/css">
body {scrolling:no;
}
iframe {position:absolute;
z-index:1;
top:0px;
left:0px;
}
</style>
<form id="form1" runat="server">
<iframe id="frame1" src="WebForm4.aspx" width="100%" height="100%" frameborder="0">
</iframe>
<script>
function getElementWithinIframe() {
var iframe = document.getElementById('frame1');
var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;
var quantity = innerDoc.getElementById("txtQuantity");
quantity.value = "5";
var submit = innerDoc.getElementById("btnQuantity");
submit.click();
}
</script>
</form>
</body>
</html>
webform4
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="ddlProd" runat="server">
<asp:ListItem>Product1</asp:ListItem>
<asp:ListItem>Product2</asp:ListItem>
<asp:ListItem>Product3</asp:ListItem>
<asp:ListItem>Product4</asp:ListItem>
<asp:ListItem>Product5</asp:ListItem>
</asp:DropDownList>
<asp:TextBox ID="txtQuantity" runat="server"></asp:TextBox>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</div>
</form>
</body>
</html>
this doesn't work. What am I missing.?
I've gone through multiple articles but I think I'm not getting it.
Javascript - Get element from within an iFrame
How to pick element inside iframe using document.getElementById
Any help is appreciated.
--
Thanks
In the javascript in the parent you use btnQuantity, while the button in WebForm4.aspx has the ID btnSubmit. So change the script to:
var submit = innerDoc.getElementById("btnSubmit");
Then call the function somewhere, either on a button click or on page load.
<input type="button" onclick="getElementWithinIframe()" value="ClickMe">
<script>
$(document).ready(function () {
setTimeout(function () { getElementWithinIframe(); }, 250);
});
</script>
I have a master page Like this:
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<link href="../Styles/Style.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Path="~/Scripts/jquery-2.1.1.min.js" />
</Scripts>
</asp:ScriptManager>
<div id="Page">
<div id="divMaster" style="width:200px; height:200px; border:1px solid red;"
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<script>
$("#divMaster").click(function () { alert("div in Master Page has been clicked);});
</script>
</form>
</body>
</html>
my content page:
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="serve
<div id="divContent" style="width:200px; height:200px; border:1px solid red;" runat="server"></div>
<script>
$("#divContent").click(function () { alert("div in content page has been clicked);});
</script>
</asp:Content
in Master page showing and hiding div works but in content page not work.
My question?
why jquery (showing and hiding div )doesn't work in my content page?
You could hold your js code in a separte file, lets say script.js
In your master page:
<script src="path/to/script.js"></script>
In your js file (script.js):
$(document).on('event', '#element', function() {
// your code here ..
});
The on() function will identify any element with id element, even if this element is loaded dynamicaly after page load
EDIT
You just have to include (in your master page only), first the jquery file and then your script.js file
Your code in a separate file:
$(document).click(
function () {
$("#KadreNemayeshePayam").hide(1);
}
);
$(document).on('click', '#DivPayamha', function (e) {
e.stopPropagation();
var knp = $("#KadreNemayeshePayam");
if (knp.is(":hidden")) {
knp.show(1);
ListePayamhaRaBegir();
}
else {
knp.hide(500);
}
});
function ListePayamhaRaBegir()
{
var vizhegiha = {};
vizhegiha.url="/Modiriat/Modiriat.Master/GetMessages";
vizhegiha.type = "POST";
vizhegiha.data = null;
vizhegiha.contentType = "application/json/:charset:utf-8";
vizhegiha, datatype = "json";
vizhegiha.success = function (data) { $('lvPayam').bind(data); };
vizhegiha.error = function () { };
$.ajax(vizhegiha);
}
//=========================== ===============
$(document).on('click', '#KadreNemayeshePayam', function (e) { e.stopPropagation(); });
//=========================== ===============
$(document).on('click', '#NavarAbzar', function (e) { e.stopPropagation(); });
NOTE
In this line:
vizhegiha.success = function (data) { $('lvPayam').bind(data); };
lvPayam is not a valid html tag, so it should be $('#lvPayam') or $('.lvPayam')
In addition to previous answer i must say that your element's ID will in case this is a server control (runat="server" attribute is seted) be probably the dynamic. So you should use '#'+'<%=lvPayam.ClientID%>' as the Id.
Because of runat="server" it is not working.
Use
<div id="divContent" style="width:200px; height:200px; border:1px solid red;"></div>
I am trying to trigger the FB subscribe event, but the alert does not work.
The FB like button displays but when I click the like button there is no alert:
Code:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="facebook.aspx.cs" Inherits="iFrame.facebook" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="//connect.facebook.net/en_US/all.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<iframe src="http://www.facebook.com/plugins/like.php?app_id=&href=www.goal.com"
scrolling="no" frameborder="0" style="border: none; overflow: hidden; width: 47px;
height: 20px;" allowtransparency="true"></iframe>
</div>
</form>
</body>
</html>
<script type="text/javascript">
FB.Event.subscribe('edge.create',
function (response) {
alert('You liked the URL: ' + response);
});
</script>
You need to be using the XFBML version of the Like button or else the event isn't detectable.
If the Javascript SDK didn't initialise the Like button then it also won't have access to the event fired. Use the XFBML version of the Like button instead of the iframe version and the rest of your code should work - it looks fine.
I have a page which is attached to a masterpage. In this page i have update panel and in it have i have a asp.net panel.
This panel has gridview which shows data from database. Currently I have fixed width and height of the panel. So if user screen resolution is bigger than that specified width and height, then it leaves blank spaces.
I want to avoid this. I have read that we can use javascript to get screen resolution of user screen. I tried this in a page which is not attached to any masterpage and called that javascript function in the body of that page and it worked fine. But i dont know how to do this in a page attached to a masterpage. The code that used is:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
function getWidth(width)
{
document.getElementById('Panel1').style.width = width+'px';
}
</script>
</head>
<body onload="javascript:getWidth(screen.width)">
<form id="form1" runat="server">
<div>
<asp:Panel ID="Panel1" runat="server" BorderStyle="Dotted" Height="50px" Width="125px" ScrollBars="Horizontal">
</asp:Panel>
</div>
</form>
</body>
</html>
<script language="javascript" type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
function BeginRequestHandler(sender, args) {
}
function EndRequestHandler(sender, args) {
getWidth(screen.width)
}
prm.add_beginRequest(BeginRequestHandler);
prm.add_endRequest(EndRequestHandler);
function getWidth(width)
{
$get('<%=Panel1.ClientID%>').style.width = width+'px';
}
</script>
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<script language="JavaScript" type="text/JavaScript">
CheckBrow();
</script>
function CheckBrow()
{
if((navigator.appName == "Microsoft Internet Explorer") ||(navigator.appName == "Netscape"))
{
HhdnBrowsertype.value=0;
}
else
{
alert("please open the application in IE or Fire fox browser")
HhdnBrowsertype.value=1;
}
}
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:HiddenField ID="HhdnBrowsertype" runat="server" />
</div>
</form>
</body>
</html>
Here is my JavaScript function. Now I need to execute this function on page load.
Here I will check the browser type based on the hidden field value 0 or 1.
I will check this hidden field value on page load
protected void Page_Load(object sender, EventArgs e)
{
// here i need to call my javscript function
// can any one tell me the syntax
If(HhdnBrowsertype.Value==”1”)
{
// here go my page load function
}
}
Can anyone tell me how I can call this JavaScript function on page load? I am using VS 2005.
try this
<body onload="CheckBrow()">
or you can use.
Page.ClientScript.RegisterStartupScript(typeof(string), "CheckBrow", "CheckBrow();", true);