I'm trying to pull documents from an internal website for multiple accounts at a time.
I'm using VBA in Excel 2010. I created the code to login and navigate until I get to the part where I need to click an image button.
Below is the related source code. First there is a function:
<script language="javascript" type="text/javascript">
<!--
function __doPostBack(eventTarget, eventArgument) {
var theform;
if (window.navigator.appName.toLowerCase().indexOf("microsoft") > -1) {
theform = document.Form1;
}
else {
theform = document.forms["Form1"];
}
theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
theform.__EVENTARGUMENT.value = eventArgument;
theform.submit();
}
// -->
</script>
And then skipping down there is this block of code where "Print.gif" is the button to click:
<LINK rel="stylesheet" type="text/css"
href="/crystalreportviewers10/css/default.css">
<table id="CrystalReportViewer1" cellpadding="0" cellspacing="0"
style="height:1043px;width:901px;Z-INDEX: 101;LEFT: 8px; POSITION: absolute; TOP: 8px">
<tr><td>
<div style="width: 901px; height: 1043px;position:relative">
<div style="height:30px;width:901px;top:0px;left:0px;">
<table class="crtoolbar" cellspacing=0 cellpadding=0><tr nowrap>
<td nowrap width=16> </td>
<td nowrap width=24px>
<input type="image" name="CrystalReportViewer1:_ctl2:_ctl0"
title="Show/Hide Group Tree"
onmouseover="this.src='/crystalreportviewers10/images/toolbar/grouptree_over.gif'"
onmouseout="this.src='/crystalreportviewers10/images/toolbar/grouptree.gif'"
src="/crystalreportviewers10/images/toolbar/grouptree.gif" alt="" border="0"
style="height:24px;width:24px;" /></td>
<td nowrap width=16> </td>
<td nowrap width=24px>
<img title="Print"
onclick="javascript:__doPostBack('CrystalReportViewer1:_ctl2:_ctl3','')"
onmouseover="this.src='/crystalreportviewers10/images/toolbar/print_over.gif'"
onmouseout="this.src='/crystalreportviewers10/images/toolbar/print.gif'"
src="/crystalreportviewers10/images/toolbar/print.gif" alt="" border="0"
style="height:24px;width:24px;" /></td>
I've tried a few different ways to fire the "onclick" but I'm having trouble because it looks like it passes to the above function to navigate to the correct page. So far I've tried:
For Each obj In IE.Document.all
' MsgBox obj.innerHTML
If InStr(obj.innerHTML, "Print") > 0 Then
obj.Click
' Exit For
End If
Next
or
For Each obj In IE.Document.all
If obj.Name = "Print" Then
obj.Click
Exit For
End If
Next
and a couple variations that have failed me so far. Any help on this would be great. Thanks.
Try below code and let us know the results.
For Each obj In ie.document.all
If InStr(obj.innerHTML, "Print") > 0 Then
obj.document.parentWindow.execScript "javascript:__doPostBack('CrystalReportViewer1:_ctl2:_ctl3','')"
End If
Next
OR
For Each obj In ie.document.all
If InStr(obj.innerHTML, "Print") > 0 Then
obj.Click
obj.FireEvent ("onclick")
End If
Next
Related
I have a page that represents a "box" for example. In this box I have multiple images. I am showing each image information on a row inside a data grid view. What I am trying to achieve is showing the image itself under the grid by clicking on any row. What I have tried to do is the next:
In the code behind, while loading the grid, I am adding an attribute in the ItemDataBound event such as:
Private Sub dgrBox_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles dgrBox.ItemDataBound
If e.Item.DataItem IsNot Nothing Then
Dim oBox As Box
oBox = CType(e.Item.DataItem, Box)
If oBox IsNot Nothing Then
e.Item.Attributes.Add("onclick", "GetImage('" + oBox.ID.ToString() + "','" + oBox.Name + "');")
End If
End If
End Sub
In the aspx page I have the following:
<div id="divInfo" style="overflow: auto; overflow-x: hidden; width: 100%; height: 330px;">
<table width="98%" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="100%">
<tr>
<td>
<div id="divZoomSlider" style="overflow: auto;">
<asp:Image ID="imgRectoImg" runat="server" Width="700px" Height="300px" oncontextmenu="ZoomOutImage(this);return false;"
onclick="ZoomInImage(this);"/>
<asp:Image ID="imgVersoImg" runat="server" Width="700px" Height="300px" oncontextmenu="ZoomOutImage(this);return false;"
onclick="ZoomInImage(this);"/>
</div>
</td>
<td align="right" valign="bottom">
<input type="image" onclick="return FlipImage();" src="../Images/recto-verso-impression-icone-8241-32.png" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
Plus in the header I have this javascript code that I am calling onclick from each row:
function GetImage(sID, sName) {
try {
var oimgRectoImg = document.getElementById("imgRectoImg");
var oimgVersoImg = document.getElementById("imgVersoImg");
oimgRectoImg.imageURL = "~/ImageDisplay.aspx?ID=" + sID + "&Mode=FULLSIZE&IMAGEDISPLAY=RECTO&TYPE=Out";
// alert(oimgRectoImg.imageURL);
oimgVersoImg.imageURL = "~/ImageDisplay.aspx?ID=" + sID + "&Mode=FULLSIZE&IMAGEDISPLAY=VERSO&TYPE=Out";
//alert(oimgVersoImg.imageURL);
} catch (e) {
alert("GetImage: " + e.message);
}
}
I already made sure with these alerts that my click event is fired. I also visited the url shown in the alert to make sure that everything is fine.
My problem is that when I click on any given row from the data grid, no image is displayed. I feel like I am missing something like refreshing the page or somehow refreshing the asp:Image to load the image from the new imageUrl that was assigned using the javascript code. I am not sure how to fix it since I have little experience with front-end development.
imageURL is a server-side property only.
ASP.NET tags are just changed into HTML by the ASP.NET engine and then sent to the browser, which can only read HTML.
In the rendered HTML the attribute containing the URL is called "src". See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img
Therefore changing imageURL to src as follows
var oimgRectoImg = document.getElementById("imgRectoImg");
var oimgVersoImg = document.getElementById("imgVersoImg");
oimgRectoImg.src = "/ImageDisplay.aspx?ID=" + sID + "&Mode=FULLSIZE&IMAGEDISPLAY=RECTO&TYPE=Out";
oimgVersoImg.src = "/ImageDisplay.aspx?ID=" + sID + "&Mode=FULLSIZE&IMAGEDISPLAY=VERSO&TYPE=Out";
should solve your problem, I think.
I am new to the site (and coding) so please bear with me!
I am trying to add the following clickable slideshow to my site in a way that means I can change the images in one file (HTML or JS) and this be reflected on every page on which the slideshow is called:
<table border="0" cellpadding="0">
<td width="100%">
<img src="image1.bmp" width="200" height="200" name="photoslider"></td>
</tr>
<tr>
<td width="100%">
<form method="POST" name="rotater">
<div align="center">
<center><p>
<script language="JavaScript1.1">
var photos=new Array()
var text=new Array()
var which=0
var what=0
photos[0]="image1.bmp"
photos[1]="image2.bmp"
photos[2]="image3.bmp"
text[0]="Image One"
text[1]="Image Two"
text[2]="Image Three"
window.onload=new Function("document.rotater.description.value=text[0]")
function backward(){
if (which>0){
window.status=''
which--
document.images.photoslider.src=photos[which];
what--
document.rotater.description.value=text[what];
}
}
function forward(){
if (which<photos.length-1){
which++
document.images.photoslider.src=photos[which]
what++
document.rotater.description.value=text[what];
}
else window.status='End of gallery'
}
function type()
{
alert("This textbox will only display default comments")
}
</script>
<p><input type="text" name="description" style="width:200px" size="50">
<p><input type="button" value="<<Back" name="B2"
onClick="backward()"> <input type="button" value="Next>>" name="B1"
onClick="forward()"><br />
</p>
</center>
</div>
</form>
</td>
</tr>
Currently I have used:
<script type="text/javascript" src="images.js"></script>
in the relevant html div. to call a simple .js file which displays the images in one long list, e.g.
document.write('<p>Image One</p>')
document.write('<img src="image1small.png" alt=Image One; style=border-radius:25px>')
document.write('<p>Image Two</p>')
document.write('<img src="image2small.png" alt=Image Two; style=border-radius:25px>')
I have tried every way I can think of, and searched many posts on here to try and get the slideshow to display within the same div. I have copied the html code into the .js file and appended it with document.write on every line, I have tried / on every line, I have tried 'gettingdocument.getElementById', but nothing works!
The slideshow code itself is fine; if I put this directly onto each page then it works correctly, I just can't seem to 'link' to this code and have it run so anything appears.
Please provide the simplest possible solution for this, without any need to install jquery plugins, or use anything other than basic HTML and JS.
There were alot of small bugs, i fixed them for you. you didn't put a semicolon after your javascript statements, tey aren't neccesary but it's cleaner code, you didn't exit alot of html tags
<table border="0" cellpadding="0">
<tr>
<td width="100%">
<img src="image1.bmp" width="200" height="200" name="photoslider">
</td>
</tr>
<tr>
<td width="100%">
<form method="POST" name="rotater">
<div align="center">
<center>
<p>
<p id="description" style="width:200px" size="50"></p>
<p><a onClick="backward()"><img src="imageback.png" alt="back" />Back Image</a>
<p><a onClick="forward()"><img src="forward.png" alt="forward" />Forward Image</a>
</p>
</center>
</div>
</form>
</td>
</tr>
Javascript:
(function() {
var photos=[];
var text= [];
var which=0;
var what=0;
photos[0]="image1.bmp";
photos[1]="image2.bmp";
photos[2]="image3.bmp";
text[0]="Image One";
text[1]="Image Two";
text[2]="Image Three";
document.getElementById('description').innerHTML = text[0]
backward = function(){
if (which>0){
which--;
window.status='';
what--;
console.log(which);
document.images.photoslider.src=photos[which];
document.getElementById('description').innerHTML = text[what];
}
}
forward = function(){
if (which < (photos.length-1)){
which++;
console.log(which);
document.images.photoslider.src=photos[which];
what++;
document.getElementById('description').innerHTML = text[what];
}
else {
document.getElementById('description').innerHTML = 'End of gallery';
}
}
function type()
{
alert("This textbox will only display default comments")
}
})();
And last but not least i've created the fiddle to show you it's working:
http://jsfiddle.net/45nobcmm/24/
You can create a javascript file that search for an element and change the innerHTML of the element to the slideshow you want to show.
For example this could be the script:
var slideshow = document.getElementById('slideshow');
slideshow.innerHTML = 'Your slideshow html';
and your main html page should have a slideshow div.
but you need to know that it's not the best solution, you should learn PHP or another back-end language and than you could use include('page.html'); for example
I am trying to make div control visible/invisible according to RadioButtonList selected values using javascript.
The div is embodied in FormView:
<asp:FormView ID="fv" runat="server" DataKeyNames="RootId"
DataSourceID="SomeDataSource" DefaultMode="Edit">
<EditItemTemplate>
<div class="SubTitle">
Fees
</div>
<table cellpadding="0" cellspacing="0" border="0" class="FormTable">
<tr>
<td class="FirstColumn">
<table cellpadding="0" cellspacing="0" border="0" class="FormTable">
<tr>
<td>
<asp:RadioButtonList ID="ftCtrl" runat="server" DataSource='<%# Eval("ftList") %>'
DataValueField="Key" DataTextField="Value" SelectedValue='<%# Bind("ft") %>'/>
</td>
</tr>
<tr>
<div runat="server" id="BreakdownDiv" style="display:none" >
...
And here is the script:
<script type="text/javascript">
$('#<%= fv.FindControl("ftCtrl").ClientID %>').find('input:radio').click(function() {
var Br = $('#<%= fv.FindControl("BreakdownDiv").ClientID %>');
if ($(this).next().html() == 'New') {
Br.show('slow');
}
else {
Br.hide('slow');
}
});
Here is the generated HTML:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$('#ctl00_ContentAreaMain_fv_Inv1_fv_BreakdownDiv').find('input:radio').click(function() {
var Br = $('#ctl00_ContentAreaMain_fv_Inv1_fv_BreakdownDiv');
if ($(this).next().html() == 'New') {
Br.show('slow');
}
else {
Br.hide('slow');
}
});
</script>
<table cellspacing="0" clientIDMode="static" border="0" id="ctl00_ContentAreaMain_fv_Inv1_fv" style="border- collapse:collapse;">
.
.
.
<div id="ctl00_ContentAreaMain_fv_Inv1_fv_BreakdownDiv" style="display:none">
Debugging the script I can see that the div control is being found but nothing happens - it's not being hide or shown when different radiobuttons are checked.
Does anyone have an idea what I am doing wrong?
Finally found what was the issue.
The Div I was trying to hide/show contained table and from some reason the table content wasn't hiden/shown. I've did some restructuring, removed the div and made the show/hide on the table itself.
Thanks everybody for your comments. Hope this help someone in the future.
Here is the sample code for hiding and showing divs based on selction of values.
OWNER is used as a constant here having the value "Owner".
$(":radio[id*=rbl_saleby]").change(function () {
var fetcheddata = $(".mainContainer").find("#saleby").find(":radio[id*=rbl_saleby]:checked").val();
if (fetcheddata == OWNER)
{
$("#saleby").show();
$("#salebyowner").show();
$("#salebyALA").hide();
}
});
In your CSS code make sure the div block is set to div{display:none}
only a function with 2 radio and a div
http://jsfiddle.net/forX/WGLQx/
$("input[type=radio][name=radio1]").change(function () {
if($(this).val()=='New')
{
$("div[id$=BreakdownDiv]").show('slow');
}
else
{
$("div[id$=BreakdownDiv]").hide('slow');
}
});
I'm not sure you can get the text of input radio. I used value instead.
<div id='popup'>
<input id='btnConfirm'/>
</div>
$("#btnConfirm").click(function () {
var frame = $('#[id$=ReportViewer1ParameterArea]'); //get the frame
//s57 is a table element in the viewer
frame.contents().find("#Preview")
.click(
function () {
alert('hover!');
}
);
});
Below is part of the HTML rendered by Telerik Report Viewer
<iframe id="ctl00_ctl00_MainContent_MainContent_ReportViewer1ParametersArea" scrolling="auto" width="100%" height="0px" frameborder="0" align="left" src="/Telerik.ReportViewer.axd?instanceID=0001be3494c046c69b091014203c2914&culture=en-US&uiculture=en-US&optype=Parameters" style="height: 26px;">
<table id="parametersTable" cellspacing="0" cellpadding="0" border="0" style="width:100%;border-collapse:collapse;">
<tr id="parametersRow">
<td valign="middle" align="center" rowspan="2">
<input id="Preview" type="submit" onclick="return ParametersPage.Validate();" value="Preview" name="Preview">
</td>
</tr>
Question :
I need to access the Preview button ID="Preview" in the Report Viewer from a DIV that contains button with ID= btnConfirm on the ASPX page as given above in the JQuery script. The ASPX page contains the Telerik Report Viewer. I put code in the
$("#btnConfirm").click(function () event but that does not work. Can you give me ideas please?
Try using this selector:
var frame = $('[id$="ReportViewer1ParameterArea]"');
Removing the # and adding quotes " around the value.
The below code is what I developed to make my code work:
var reportFrame = document.getElementById('ctl00_ctl00_MainContent_MainContent_ReportViewer1ParametersArea');
var reportDocument = reportFrame.contentWindow.document;
var body = reportDocument.getElementsByTagName("body")[0];
$(body).contents().find("#Preview").click();
I have a page and when I mouse over the links it changes an image and some html on another portion of the page. However Im wondering how this script works and when I look at the script at the top of the page:
<script type="text/javascript">
var CONTENT_CURRENT = 0;
showContent = function() {
if (CONTENT_CURRENT > 0) {
var o = YAHOO.util.Dom.get('content' + CONTENT_CURRENT);
o.style.display = 'none';
var a = YAHOO.util.Dom.get('link' + CONTENT_CURRENT);
a.style.color = '#46689e';
}
var c = YAHOO.util.Dom.get('content' + arguments[0]);
c.style.display = 'block';
var l = YAHOO.util.Dom.get('link' + arguments[0]);
l.style.color = '#000000';
CONTENT_CURRENT = arguments[0];
};
YAHOO.util.Event.onDOMReady(function() { showContent('1'); });
</script>
How is this script setting the an element on the page? The actual page is at:
Link to site
Under the title 'Streaming Software Products'...
There is another code block you need to look at to understand this code
<div class="real-products-mid-lh">
<a id="link5" href="/products/helix_server.aspx" onmouseover="showContent('5')">Helix Server</a><br />
<a id="link1" href="/products/rlp.aspx" onmouseover="showContent('1')">Real License Program</a><br />
<a id="link2" href="/products/helix_security_manager.aspx" onmouseover="showContent('2')">Helix Security Manager</a><br />
<a id="link3" href="/products/real_player_enterprise_manager.aspx" onmouseover="showContent('3')">RealPlayer Enterprise</a><br />
<a id="link4" href="/products/helix_mobile_server.aspx" onmouseover="showContent('4')">Helix Mobile Server</a><br />
<a id="link6" href="/products/helix_proxy.aspx" onmouseover="showContent('6')">Helix Proxy</a><br />
<a id="link7" href="/products/real_producer.aspx" onmouseover="showContent('7')">RealProducer</a><br />
<a id="link8" href="/products/capture_station.aspx" onmouseover="showContent('8')">Accordent Capture Station</a><br />
<a id="link9" href="/products/elp.aspx" onmouseover="showContent('9')">Real Education Licensing</a><br />
<a id="link10" href="/products/helix_mobile_producer.aspx" onmouseover="showContent('10')">Helix Mobile Producer</a>
</div>
Here each link in the list calls showContent with an index as the argument. There are a bunch of divs below like this one:
<div id="content1" style="display:none;">
<div class="real-products-mid-rh">
<div class="real-products-logos">
<table width="100%" cellpadding="0" cellspacing="0" style="border:1px solid #d6d6d6; height:107px;">
<tr>
<td align="center"><img src="/_common/images/logo_real_sm.gif" alt="Real License Program" style="vertical-align:middle" /></td>
</tr>
</table>
<table width="100%" cellpadding="0" cellspacing="0" style="border-left:1px solid #d6d6d6; border-right:1px solid #d6d6d6; border-bottom:1px solid #d6d6d6; padding-top:5px; padding-bottom:5px;">
<tr align="center">
<td><strong>LICENSE PROGRAM</strong></td>
<td><img src="/_common/images/px_more.gif" alt="Find out more" /></td>
<td> </td>
</tr>
</table>
</div>
<p><strong>Cost effective and all encompassing RealNetworks License Programme available exclusively to UK enterprise customers<br />
Real License Program <img src="/_common/images/px_more.gif" alt="Find out more" /></strong></p>
</div>
</div>
That div's ID is "content1". So the showContent function does three things:
If there is a content div that is
visible, make it hidden
(display=none)
Make the desired content div
visible.
Set the current visble content
index.
This cause the content to the right of the links to change on mouse over.
YAHOO.util.Dom.get() works like document.getElementById()
o.style.display = 'none'; // hides current content
a.style.color = '#46689e'; // paints current link blue
c.style.display = 'block'; // displays new content
l.style.color = '#000000'; // paints new link black