Getting OuterWidth of a Div using Jsoup - java

I am working on a project where I need the outer width of a div on the server side. I am using jsoup for it.
How can I get the outerwidth of a div in jsoup, as we have outerWidth() function in jQuery?

You can't get the outerwidth of a div on server side because the server simply doesn't know the width. The real size of a element is depending on how the client renders the HTML and CSS.
Think about style="width: 80%" on the topmost element. The real size is depending on the size of the browser-window.
I don't know nothing about the context of your question but if you really need the size of Elements on serverside and it's your own application you could let the client tell this information to the server.
If the question is just about getting the size of Elements with Java you could start a Browser with Selenium and check the dimension with WebElement.getSize().

Related

Send text to div in Selenium + Java

I want to send a text to a div element in web.whatsapp. I tried several ways ie using XPath, cssSelector, class name etc. but none is working for me.
This textbox comes when we attach an image in web.whatsapp.
Please step into the div and use the div with the class "selectable-text". As this is a contenteditable div you should be able to click into it and call then sendKeys() onto the element.
if this does not help please let me know then I will look in our code how we are filling such divs exactly.
You need to drill down further until you get to a web element that takes an input.

Get div / html element height and width server side

I would like to calculate the height and width of the main content area of a blogpost server side. This is something that needs to be done for many different websites. But mostly Wordpress sites. I need the width and height off the blogpost for an algorithm as parameters.
I could ask the user for this info, but unfortunately the people who are using this website are not technical so they have no idea how to find this information (eg in a developer tool). If the numbers are incorrect the outcome of my algorithm is most likely incorrect.
First I tried if there was a way to do this with PHP, but was not able to find it. Then I thought about using Java and then use PHP to communicate with Java again. Couldn’t find anything either.
Next step could be to let a user “select” a div or area and calculate it from there, but this would not be ideal, because you would need the user input every time you would like to make a calculation. One other problem with this would also be how to find the main content div / element first?
If I am able to find the main content div server side automatically I could load the blogpost in an iframe and calculate the width and height with jquery. But how would you find the main content div?
Anyone who has a way to solve this problem? I am kind of open to any solution without the user input.
Not going to be easy to do this server side, as you're not rendering the page.
I would suggest looking at using JavaScript to retrieve the dimensions of the Div you want, and then sending these server side from your script or from a form.
You could automate the process by triggering your JS function on page load, or trigger it using a button pressed by the user, or whatever.
For reference, you can get div height and width as follows:
var divHeight = document.getElementById('myDiv').clientHeight;
var divWidth = document.getElementById('myDiv').clientWidth;
Hope this helps.

How to Scrolldwon a web page using htmlunit or PanthomJS

I have a web page which continues to loading the contents when ONLY scrolling down the page.
So I want a way to scroll down the page pragmatically using HtmlUnit or PanthomJS.
Can I imitate the scroll down action(lets think using scroll element).
or
Can i imitate it using j script.
if this can do please explain the way.
Thanks.
You can set InnerHeight a large value. like this:
webClient.getCurrentWindow().setInnerHeight(60000);
the webcontrol will load all element,because of the webcontrol enough heigt.

Is it possible to count lines of visible text in HTML formatted file?

We have a form that lets people input html formatted text and that input is then displayed elsewhere on the webpage.
Due to layout constraints the input may not be longer than X lines. There is no preview of the edited text in the webpage. Input upon submit is immediately published. (Short Explanation why I cannot fix the layout: the text in question is displayed as an overlay above an image. The overlay has about the size of the image and that is fixed. The text should be completely visible inside that overlay and should not spill over.)
I am being asked to implement something to keep people from entering too much text.
My first try was going for "maxLength" but goes wrong because of the possibility html formatting of the input.
Besides the obvious two 1. expecting users to be smart and/or 2. implementing a preview method, how else could we possibly solve this?
I am out of ideas, I'll also accept an explanation why it is impossible
Technology used: java, wicket 1.4.x
I'm not a web-development expert so this may not be a precise enough answer.
Using javascript you can get the effective size of an HTML element once it has been rendered in the browser. Thus, one solution could be to render the page server-side, and check whether the result exceeds the size you expect.
This may not guarantee a correct result however because the server may render the page differently than the client. You could also always accept the input, then when the client renders the page, have a snippet of javascript that checks (client-side this time) whether the rendered result is okay. If it isn't, then let javascript redirect the client to an error page so that it can edit his input.
What I'd do however is to change the layout so that nothing breaks if the user enters too much text. Using the CSS overflow property could be a start. You could also implement better solutions in javascript such as dynamically changing the text size until it fits the size you want.

Dragging, Dropping & resizing elements

I have a web page which has three <div> elements:
Right_bar contains several layouts (nothing to do with this question)
Bottom_bar contains several components e.g. calculator, logo, a group of buttons etc. each component uses a <div> and must be resizable and draggable.
And a Working Area, where all the components are dropped & resized. Also a user can resize & change the location of components anywhere in the Working Area. Once a user sets a component then the page must be saved in same style and it shouldn't be changed even after refreshing the page.
My questions are:
Should I use a database to save the location of component.
Which one should I use: JQuery / AJAX / anyother?
If you know of any tutorials please let me know although I am beginner in JavaScript, Basically a Java programmer.
Note: on the server side I am using Servlet.
Whenever the user drops an element, launch a simple Ajax request that will pass the new value to the server.
try {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); // IE
}
catch(e)
{
var xmlhttp = new XMLHttpRequest(); // Other browsers
}
xmlhttp.open('GET', 'yourServerScript.url?param=value', true);
xmlhttp.send(null);
You may want to check if the request succeeded or failed by handling the "readystatechange" event of your http request, but that doesn't seem important in your case.
After that you just have to get the value server-side, store it in a session variable, and then on every page load, check if there is a session variable defined for the parameter before setting it to its default value.
What you can do is save the location of the control in a xml and save it in a table.
2.jquery UI has as build in framework that supports drag and drop div elements, check this link http://jqueryui.com/demos/droppable/
I did the same thing for an application. (but I used PHP, anyway it doesn't matter for what you need)
I used jQuery + jQuery UI drag & drop / resize
I used AJAX with 4 parameters (x,y, z-index and id of the element) for drag & drop on drag stop
I used XML as a database for this, but any database (or any persistance way) will do the trick. As #Thibault Witzig said, take the most pertinent for your project.

Categories