I have a url that goes like this index.aspx, but when I click on a button that is linked to a anchor tag it adds this #video
so it will look
index.aspx#video
is there away to remove #video from url?
I haven't gotten much feedback, so here are three options due to the ambiguity of your question.
Option 1 - Use the anchor location, remove the anchor, rescroll the window appropriately.
You can access the # value using location.hash as referenced by this article. Unfortunately as soon as you set the location.hash = '', the page re-navigates to the top of the screen (and leaves the # symbol in the URL). If you set the location.href, the page navigates away from the page losing any local variables stored.
One possible work around that you could do is something like the following:
function RemoveHash(){
var y = location.hash.substring(1, location.hash.length);
location.hash = '';
window.scrollTo(0, y);
}
The downside of this is that the screen will flash as it moves the screen back to the top and back down to your location. Another way you could do it is instead of using the anchors, find the location of the elements on the page, but this, in my experience, has been inaccurate and varies between browsers and becomes a maintenance issue. JQuery libraries may help this some though, may be worth looking into if you go down this route.
Option 2 - Get the Url without the anchor tag
You can do the replacement RegEx to remove the anchor from the url, you can use something like the following:
location.href.replace(/\#\w+/g, "");
Option 3 - Don't use anchors and use JavaScript to scroll
You could just not use anchors and just have the page scroll to the correct location using JavaScript by following this tutorial. The basic idea is getting the scroll offset of the element and scrolling the screen to that location.
function elmYPosition(eID) {
var elm = document.getElementById(eID);
var y = elm.offsetTop;
var node = elm;
while (node.offsetParent && node.offsetParent != document.body) {
node = node.offsetParent;
y += node.offsetTop;
} return y;
}
And use the hyperlink to call the javascript:
<a href="javascript:void(0);" onclick="window.scrollTo(0, elmYPosition('myAnchor'))>myAnchor</a>
Related
I'm exploring different options for .NET PDF libraries. One of my requirements is to place a box at the bottom of the first page and if any of the content reaches the box, it should overflow onto the next page.
For example:
Shown above, paragraph 7 would normally take up some of the space that's occupied by the "reserved" area. Instead, the part that would have taken up that space is shifted to the next page.
That image was achieved using Gembox.Document by adding the box as a footer element that only renders on the first page. However, in iText7, the examples I've seen for adding a footer (such as this one), places the content as a floating element that renders over the existing content and does not affect the layout/flow of the rest of the document.
I also tried adding a paragraph on the PageEnd event handler without the canvas (snippet below), but instead of adding it to the specified page, it's added to the end of the entire document.
public void HandleEvent(Event evt)
{
var docEvent = (PdfDocumentEvent)evt;
var page = docEvent.GetPage();
int pageNum = docEvent.GetDocument().GetPageNumber(page);
if (pageNum == 1)
{
doc.Add(new Paragraph("Testing a thing"));
}
}
Is the type of effect I'm looking for something that I can replicate using iText7?
I believe you can combine the concepts of https://github.com/itext/i7ns-samples/blob/develop/itext/itext.samples/itext/samples/sandbox/acroforms/AddExtraTable.cs and https://github.com/itext/i7ns-samples/blob/develop/itext/itext.samples/itext/samples/sandbox/events/TextFooter.cs to achieve what you need.
The idea is as follows:
reserve place for your box by making iText give the document's renderer less space for the first page
fill this box with a help of iText's end page events
Another option was suggested in How can I insert an element to the bottom of a specific page in iText7? : you can temporary call Document#setBottomMargin , since elements added via Document#add will not be placed on margins. Then, once the first page is layouted, you can set the initial margins again. This option, however, requires understanding of you layout flow, since the margins should be set only after the content of the first page is layouted.
One more suggestion: althouth event functionality is rather flexible and useful, it seems like using a sledgehammer to crack a nut. You need to call Canvas#ShowTextAligned, which could be done without any event handling. So ideally I would prefer to do the following:
handle page's layout area via an extension of DocumentRenderer
Calling Canvas#ShowTextAligned to fill the reserved box.
As you said, you are exploring different .NET PDF libraries. So I would advise PDFFlow library, which does exactly what you need.
If you have a footer, main document flow will take the rest of page area and will be automatically continued at the next page without overlaying footer.
DocumentBuilder.New()
.AddSection()
.AddParagraph("long text")
.ToSection()
.AddFooterToBothPages(40)
.AddParagraph("this a footer set for each page of this section")
.ToDocument()
.Build("result.pdf");
Here is a tutorial with code examples of using headers, footers, left/right repeating areas: AddingRepeatingArea tutorial.
Hope, this will help you :)
I'm trying to have Selenium take a screenshot of the current page in the webdriver. I'd also like to set the browser's dimensions before this occurs so that the screenshot can capture an image of a specific size.
I use this to change the window size:
webDrv.Manage().Window.Size = new Size(w, h);
And this to take the screenshot:
Screenshot ss = ((ITakesScreenshot)webDrv).GetScreenshot();
ss.SaveAsFile(Path.Combine(m_path, m_filename), ScreenshotImageFormat.Png);
The problem is that on some pages, the screenshot will be taken before the browser has finished redrawing the page.
I cannot use the usual methods of checking (such as using JS to get the document.readyState) because the page is already loaded at this point, so any checks like this return true.
This is only a problem on pages that use Javascript to resize elements based on window size. Pages that use CSS don't have this problem.
I can get around this by taking the entire HTML Body element before and comparing it to after the resize is completed:
webDrv.Manage().Window.Size = new Size(w, h);
int oldBodyHash = webDrv.FindElement(By.TagName("body")).Text.GetHashCode(); //get a hash of the current html body
DateTime nextthink = DateTime.Now.AddSeconds(10); //hard time out incase there is no javascript resizing
while (webDrv.FindElement(By.TagName("body")).Text.GetHashCode() == oldBodyHash && DateTime.Now < nextthink) //wait until hash changes or timeout occurs
{
Thread.Sleep(500);
}
Screenshot ss = ((ITakesScreenshot)webDrv).GetScreenshot();
ss.SaveAsFile(Path.Combine(m_path, m_filename), ScreenshotImageFormat.Png);
But then on pages using CSS to control changing elements, there is no change in the HTML Body.
It seems like it is one or the other, but it's not possible to cover for both possibilities?
I have the same question question JeffC, but to directly fix you problem try adding a
browser.refresh()
in between the window resize and the screenshot-taking.
Looks like there is no actual solution to this other than changing the order in which we perform the operations; essentially the solution is to change the browser dimensions far enough ahead of time to ensure that JS resize activities complete before the screenshot is taken.
I have an ASP.NET page using a leaflet map. I have a filter being applied to some map icons.
When I apply the filter, which is an ASPX control. when the result of the filter comes back, since ASP resends the entire page back to the client, i loose the current zoomed in region I was looking at.
I have saved off the values of the last bound coordinates the user was looking at but exclude the possibility of the most zoomed out case since that's what i'm trying to avoid. I'm trying something like
string temp = "<script language=\"Javascript\">
myMAP.fitBounds([[RA[0],RA[1}][RA[2],RA[3]]);
</script>";
Page.ClientScript.RegisterStartupScript(this.GetType(), "resetZoom", temp);
but I'm still seeing the map get reset like when the page gets sent back. am I calling the wrong leaflet method or is there a better way to implement what I'm trying to do? Please advise...
.fitBounds() method is having a coma between points, so I will be something like this:
.fitBounds([
[RA[0], RA[1]],
[RA[2], RA[3]]
]);
(source)
Is it fixing your problem?
hi i am applying css to one of my list elements which is inside a tag which is in a master page. so when i click this link the style is getting applied but the page reloads and then the applied style is again reset to default this is my code can somebody help me with this? please?
function SelectThis(ctrl) {
debugger;
var list = document.getElementById("myslidemenu").getElementsByTagName('a');
for (i = 0; i < list.length; i++) {
list[i].style.color = "white";
list[i].style.background = "#414141";
}
ctrl.style.background = "black";
ctrl.style.color = 'yellow';
}
but since i am clicking on a hyper link. the master page reloads and the selected styles are lost
Since it is a hyper link is residing inside the <li> use
e.preventDefault(); will stop the default action of the <a> tag
Update:
list[i].addEventListener('click',preventReload);
function preventReload(e){
e.preventDefault();
}
Add this code inside the for loop, which will stop the default functionality of the hyperlink i.e., stops the page from reloading.
If you need the page to reload, because it's a menu to sub pages then the way I do this is to:
Define a class for the style
Compare the current page url to the a href url (various ways to do this and various levels of matching)
If they match apply the class to that element
I would do this server side, not with javascript.
Another option is to use a cookie/session variable, not sure on the C# syntax, I did this recently in PHP and used AJAX to set a session variable after filtering some data to remember the current state when clicking down to the next level.
For the last two weeks I have been kind of stuck on a problem.
I am developing some web scrapers using C# and I am using a WinForms WebBrowser control in my application. I am able to fill up the web form which is opened in my browser and submit it automatically by using the following code:
HtmlElement submitButton = document.GetElementById("Element_ID″);
submitButton.InvokeMember(“click”);
So far everything is fine, but the problem is that there is one another element in the web form that I want to click too, but this element does not have any id or name so I don't know how to click this one.
Please help me as soon as possible I need it for my master thesis.
(I want to click the next page arrow button in the give website:
http://www.gelbeseiten.de/yp/11//subscriberlist_pageAction.yp?sessionDataString=H4sIAAAAAAAAAI2PQU8CMRCFfw0XSEmns9128k5KongwGjFeSZftIqILbhcVf70NSgg3X-pbyXjLfvCFpqsbbIMpwbVRRuaBELKm6iew5T4gLFUpdmKpewJAGD8xV7JaxalfpdZX6mP31bH4WQfZblJehXcd2tGvr0WwbunVIKbYIZjjKmoa3atct4RSh-pA/S912oY4qhWzyjJkLvPZV4P4JetNFHYWOG2OoCH4pZlyU-pjWdhjS/LY2sp7-p1lLCLOGXwTLqpT1XSqOiXcpE3Xzw-pncUtGSDNp0ZZwR0we92TxSHjIX0x-pIQM-p0AZuciLl7M/kGE-pmcGjIOsvEpTB-pADJS0suGAQAA&page=0&filterTrade=-&filterFunction=-&sortBy=sort_trade&availableLetters=ABCDEFGHIJKLMNOPQRSTUVW )
I've written many web-scrapers in the past using embedded WebBrowsers, so you've come to the right place.
When the element does not have a name you need to find it by either content, or another associated element that is named.
In the first instance we wrote helper methods to iterate the hierachy looking for a specific piece of content within an element.
For the second option you get the named element and use a specific index for the desired child.
A combination of both (find a specific parent then look for a child with the right content)
In your specific example webpage, the next page anchor has a class type of "arrow next" you can search for.
You could do
HtmlElement next_arrow = document.GetElementsByTagName("a")
.Cast<HtmlElement>()
.Where(e => e.GetAttribute("class") == "arrow next")
.FirstOrDefault();
if (next_arrow != null)
{
next_arrow.InvokeMember("click");
}
Here's a trick, not by InvokeMember("click") rather just "simulating the click" -
this is the link for the first page:
gelbeseiten.de/yp/11//subscriberlist_pageAction.yp?sessionDataString=H4sIAAAAAAAAAI2PQU8CMRCFfw0XSEmns9128k5KongwGjFeSZftIqILbhcVf70NSgg3X-pbyXjLfvCFpqsbbIMpwbVRRuaBELKm6iew5T4gLFUpdmKpewJAGD8xV7JaxalfpdZX6mP31bH4WQfZblJehXcd2tGvr0WwbunVIKbYIZjjKmoa3atct4RSh-pA/S912oY4qhWzyjJkLvPZV4P4JetNFHYWOG2OoCH4pZlyU-pjWdhjS/LY2sp7-p1lLCLOGXwTLqpT1XSqOiXcpE3Xzw-pncUtGSDNp0ZZwR0we92TxSHjIX0x-pIQM-p0AZuciLl7M/kGE-pmcGjIOsvEpTB-pADJS0suGAQAA&page=0&filterTrade=-&filterFunction=-&sortBy=sort_trade&availableLetters=ABCDEFGHIJKLMNOPQRSTUVW
as you see page=0; clicking next, gives the link -
gelbeseiten.de/yp/11//subscriberlist_pageAction.yp?sessionDataString=H4sIAAAAAAAAAI2PQU/DMAyFf00vmzLFdprE8gkmwTggEENcp3RNxxh0o-pmA8euJBlO1G0-p-pvCf58zNwUzW-pDKyQalSmckExl6DqJpKnPCEuVbDaYFUvBcEIFXgVu1Ws2nV6Xac-pZn89X5xFwoed2MvQbmI73rf1eL4L3SakFFsJOBpnzcJbte9W4hSI-pQ/S912oY4qhWz5LDSC992Dl/QR60ahPki2OZKeNfCgiba18oicmLV8lTcoS8t6BJ8zsHMo3yEU1VE1D1ZmWm7Tt-psXxtNwCMmjS4BhJ7oDAy72WR5CH/MT0l1HQEVa46QDK2Z/JsTyhcdIAWrZeGy8/k7LJ5YQBAAA-e&page=1&filterTrade=-&filterFunction=-&sortBy=sort_trade&availableLetters=ABCDEFGHIJKLMNOPQRSTUVW
now page=1
and so on... in general clicking next means page=(x+1) clicking prev means page=(x-1). so build a string according the requirements. this addresses ur problem, however there are some other data also sent with querystring, that u have to append to the string as well.