JEditorPane/HTMLEditorKit displays weird html-table-borders

Hi there,
I am currently fighting with JEditorPane and its HTML functionality.
I would like to create a table with padding:2 and border:1 - every browser displays that correctly (even HotJava the father of HTMLEditorKit's functionality), however JEditorPane paints the border really ugly adding a 1993-style 3D effect to my table :-/
Any ideas how I could tell JEditorPane to just draw a single 1px line as table border?
Thank you in advance, lg Clemens

I guess you need to use a CSS file binded to you HTML doc,
JEditorPane view = new JEditorPane("text/html","<p>empty</p>");
StringBuffer l_sb = new StringBuffer();
sb.append("<head>" +
"<link rel=stylesheet href='mystyle.css'>" +
</head>");
view.setText(sb.toString());
then you can control the border using :
body {
background-color: #f0fff0;
font-family: Arial;
font-size: 12pt;
table {
border-width: 1px;
border-style: solid;
border-color: #000000;
and NOT as the standard way (doesnt work)
border: 1px solid #000000;
Hope this help.

Similar Messages

Table borders for html Page

HEllo ABAPERS,
KINDLY HELP .
I have developed a report which displays a html page in a custom control .But while printing it not displaying table borders . I have used method display_document ffor printing .Can anyone tell me the reason why is it not printing borders ?
Following code is the code for subroutine and PBO : -
MODULE status_0322 OUTPUT.
SET PF-STATUS 'xxxxxxxx'.
SET TITLEBAR 'xxx'.
IF first_display EQ 'X'.
    SET PF-STATUS 'PMENU'.
create document
    CREATE OBJECT do.
fill document
    PERFORM display_data USING do t_no.
merge document
    CALL METHOD do->merge_document.
display the document inside the container named 'mmscr
    CALL METHOD do->display_document
      EXPORTING
        container          = 'MMSCR'
      EXCEPTIONS
        html_display_error = 1.
    " do some exception handling ...
    CLEAR first_display.
ENDIF.
ENDMODULE.                 " STATUS_0322 OUTPUT
*&      Form display_data
FORM display_data USING p_do TYPE REF TO cl_dd_document P_no type n.
DATA ta1 TYPE REF TO cl_dd_table_element.
DATA col11 TYPE REF TO cl_dd_area.
DATA col12 TYPE REF TO cl_dd_area.
DATA col13 TYPE REF TO cl_dd_area.
DATA col14 TYPE REF TO cl_dd_area.
DATA col15 TYPE REF TO cl_dd_area.
DATA head1 TYPE sdydo_text_element.
DATA head2 TYPE sdydo_text_element.
DATA head3 TYPE sdydo_text_element.
DATA head4 TYPE sdydo_text_element.
DATA text TYPE sdydo_text_element.
CALL METHOD p_do->new_line.
      CALL METHOD p_do->add_table
        EXPORTING
          no_of_columns               = 5
          cell_background_transparent = space
          with_heading                = 'X'
          border                      = '5'
          width                       = '50%'
        IMPORTING
          table                       = ta1.
set columns
      CALL METHOD ta1->add_column EXPORTING heading = head1
                                            width   = '10%'
                                  IMPORTING column = col11.
      CALL METHOD ta1->set_column_style EXPORTING col_no    = 1
          sap_color = cl_dd_area=>list_background_int.
      CALL METHOD ta1->add_column EXPORTING heading = head2
                                            width   = '15%'
                                  IMPORTING column = col12.
      CALL METHOD ta1->add_column EXPORTING heading = head3
                                            width   = '15%'
                                  IMPORTING column = col13.
      CALL METHOD ta1->add_column EXPORTING heading = head4
                                  width   = '15%'
                                  IMPORTING column = col14.
      CALL METHOD ta1->add_column EXPORTING heading = head4
                                            width   = '15%'
                                  IMPORTING column = col15.
fill columns
      text = ' '.
      CALL METHOD col11->add_text
        EXPORTING
          text = text.
      text = 'Init'.
      CALL METHOD col12->add_text
        EXPORTING
          text = text.
      text = 'Supv No'.
      CALL METHOD col13->add_text
        EXPORTING
          text = text.
      text = 'Date'.
      CALL METHOD col14->add_text
        EXPORTING
          text = text.
      text = 'Discrepancy Report Notation'.
      CALL METHOD col15->add_text
        EXPORTING
          text = text.
      CALL METHOD ta1->new_row
        EXPORTING
          sap_color = cl_dd_area=>list_background.
      text = 'Q/C by'.
      CALL METHOD col11->add_text
        EXPORTING
          text = text.
      text = ' '.
      CALL METHOD col12->add_text
        EXPORTING
          text = text.
      CALL METHOD col13->add_text
        EXPORTING
          text = text.
      CALL METHOD col14->add_text
        EXPORTING
          text = text.
      CALL METHOD col15->add_text
        EXPORTING
          text = text.
      CALL METHOD ta1->new_row.
      text = 'Received by'.
      CALL METHOD col11->add_text
        EXPORTING
          text = text.
      text = ' '.
      CALL METHOD col12->add_text
        EXPORTING
          text = text.
      CALL METHOD col13->add_text
        EXPORTING
          text = text.
      CALL METHOD col14->add_text
        EXPORTING
          text = text.
      CALL METHOD col15->add_text
        EXPORTING
          text = text.
      CALL METHOD ta1->new_row.
      text = 'Sign Off'.
      CALL METHOD col11->add_text
        EXPORTING
          text = text.
      text = ' '.
      CALL METHOD col12->add_text
        EXPORTING
          text = text.
      CALL METHOD col13->add_text
        EXPORTING
          text = text.
      CALL METHOD col14->add_text
        EXPORTING
          text = text.
      CALL METHOD col15->add_text
        EXPORTING
          text = text.
      CALL METHOD do->new_line
        EXPORTING
          repeat = 1.
ENDFORM.
MSK

You can use HTTP Receiver to pass the data to the servlet that runs on the HTTP Server. The servlet has already screen design logic written in HTML or jsp to display in HTML Table or so. PI requires to just post data on the servlet of HTTP Server using HTTP Receiver. PI will not create screen look and feel logic while posting data.
If you want HTML table coding logic refer this link
http://www.w3schools.com/html/html_tables.asp

JEditorPane, html, tables and images

I am trying to use jEditorPane to display an HTML document. If images are included into cells of a table, the width and height of the cells do not adjust to the size of the images (as it happens with common web browsers), no matter what parameters I use for TD and IMG tags.
Do you experience the same problem? Is there a solution?
Thanks.
Ruben Razquin

Hi Ruben,
you will have to implement adjustment of table cells yourself to achieve this. With the existing way JEditorPane et. al. render tables table cells always are sized either in default sizes or by attributes explicitly giving the size (such as attribute WIDTH).
Ulrich

How to populate a html table in a JSF page

Hi, I need help on the following issue:
My code calls an business layer API which returns me a string in html format which produces a html table. I have a JSF page with a bunch of other JSF components and I want to insert this html table at the bottom of this page. Is there a way to do it?

OK
Here is an example
Drag an outputText component on to the Page. Check the properties of outputText and uncheck the escape property. Write this some where in the code when you want to display the HTML table on the page.
String s = "<HTML><BODY><TABLE BORDER=2><TR><TD>No</TD><TD>Name</TD><TD>Age</TD></TR><TR><TD>1</TD><TD>John</TD><TD>30</TD></TR><TR><TD>2</TD><TD>Michael</TD><TD>20</TD></TR></TABLE></BODY></HTML>";
outputText1.setValue(s);
I am using the hardcoded value for String but in your case you get the string from some API.
Hope this helps
Thanks
Creator Team

HTML table containing SQL output in cells

Hello,
This might be a built-in function, but I haven't figured out how to do this: I want to display an HTML table (2x3 table) and in each cell, I want to display the output from different SQL statements. Some of the SQL statements return multiple rows, some just one. The cell data comes from unjoined tables, that is there is no join condition between each one of the cell SQL statements, it's a bit random.

After much head-banging, I have worked this out and it came down to just changing 2 style definitions in the page template. I'm not really a Web developer so that wasn't obvious to me (or easy, I've read quite a bit on Google about stylesheets while working this).
Basically I wanted to display a 3x3 "grid", similar to a table, but the data coming out from the 3x3 regions (all SQL query regions) returned different numbers of rows, which meant my page "rows" didn't align horizontally, they were just rendered wherever the last region stopped (vertically they were rendered properly because I put the regions in Colums 1, 2 and 3, standard page functionality).
Eventually I started looking at the HTML page source and noticed the regions were using style defintions coming from my theme (standard APEX theme #12). I made a copy of the page template this page was using, and modified the header block of the new page template to "rewrite" the driving styles
<title>#TITLE#</title>
<link rel="stylesheet" href="#IMAGE_PREFIX#themes/theme_12/theme_V3.css" type="text/css" />
<style type="text/css">
a.plain { font-family:arial; text-decoration:none}
td.t12Header {height=12px;font: italic small-caps 900 12px arial}
td.t12Body {background-image: url(#APP_IMAGES#lock.png);background-repeat: no-repeat;background-position: left top;vertical-align= middle;height= 250px}
</style>
...So I re-wrote the td (or table TD style) for t12Header and t12Body, by adding my own style definitions into the header after the call to the main css sheet. I also played around with putting a background image into each cell, I'll probably remove that but it was fun to explore.
This rendered my individual table cells (via td.t12Body) @ 250px (which as I've found out is otherwise not supported, there's no built-in TABLE spec for "height") -- exactly what I wanted, now all the regions render vertically and horizontally.
I did not test this with any browser other than IE7.
If you know an easier way to do this, please do post a follow-up.

My html table is not showing on the 2nd tab panel (muse widget)

The same table works just fine on the first tab however when I try to click on the second table in browser mode or preview page on browser, my table does not show up. Any tips for fixing this issue?

If I get this right, you're using the Tabbed panel widget to display a HTML table in each of the tabs. If that is the case, please make sure you insert the HTML content on each the tab's content area respectively. In order to verify this, switch between the tabs in Design mode to check your content.
Thanks,
Vinayak

Stretching of HTML table in JLabel

Hi all,
I am trying to display an HTML table in a JLabel. The table uses width="100%", but the html table doesn't resize according to the size of the JLabel. Is this a know issue or am I doing something wrong?
String html = "<html> <head> </head> <body> <table border=\"2\" width=100%> <tr> <td> test </td> <td> test </td> <td> test </td> </tr> </table> </body> </html>";
JLabel label = new JLabel(html);
getContentPane().add(label, BorderLayout.CENTER);kind regards,
Christiaan

The JTable uses a cell renderer to draw the JLabel.
The cell renderer figures out the size of the table cell without reading the html. Which means it ignores the width=100% when it calculates the size of the table cell. If you want the cell to resize properly, you have to implement a table cell renderer, and make that renderer set the column size or row height accordingly. That means you have to calculate the cell size yourself.
In my opnion, i would say this is a bug, as I've had numerous problems with it too.

Display HTML Tables In JEditorPane

Hi all,
I am Editing an HTML Document in a JEditorPane.I've Noticed that The HTMLEditorKit has many flaws.
I tried to fill them by registering my own tag actions for some tags. Now the new problem that I am facing is how an html table is displayed : The cellborders ares not visible. So i can see the content of the table, but not its borders. What should I do to make them show out ?
thanx

I had some problems with using HTML Tables with JEditorPane (it's really flaky). What I found was you have to be very specific when you create the table. Meaning, the cells have to be set using exact pixel sizes, not relative sizes or percentages. This is a pain, but if you do that then it should work.
<table width=400 border=1 cellspacing=0 cellpadding=1> etc.......m

HTML Printing with JEditorPane table borders is missing...

Hi,
My application prints HTML reports that was rendered on a JEditorPane,
actually the printing is working fine (almost)...
After reading a lot of posts and the Printing API i've found a very god aproach to print HTML documents... the DocumentRenderer:
http://www.fawcette.com/javapro/2002_12/online/print_kgauthier_12_10_02/
I'm having a strange problem that I was unable to figure out by myself...
Table borders and table background images never get printed...
ex: <TABLE BORDER=1 ...
<td background="image.gif" ...
On the JEditorPane it shows just fine but, when the page is printed there's no border or table background pictures...
Everything else is printed ok including images, small fonts, etc...
Does anyone else had the same problem ?
Thanks for any help

The borders present an interesting problem created by the way the DocumentRenderer class finds for printable Views in the HTML. DocumentRenderer searches recursively down the tree of Views starting with the Document's root view looking for leaf views, those with no children. The DocumentRenderer only paints these smallest chunks of text to the printer graphics context. This usually works because leaf views do not usually contain anything paintable.
The problem with borders is that they represent paintable areas of branch views, those with children. When we only print leaf views, these areas get ignored.
I see two logical solotions to the problem:
I. Change the code of the recursive printView method of Document Renderer to print any border that intersects with the current printable clip rectangle.
II. A much more elegant solution would be to print any view, branch or leaf, that fits within the current printable area, and cease the recursion there. This would include the borders.
It would also increase efficiency by terminating the recursive method earlier by painting larger chunks of the HTML. A strange problem pops up when I try this, however. When the size of the chunk to be printed gets too big, nothing is printed at all. In the article this is mentioned in the area of large images. "Lastly, large icons do not print. Java simply refuses to render them on the page. Small icons work quite well, however." The same holds true for any large View.
I have not been able to quantify the exact size where this failure occurs, nor what is causing it. If anyone can tell me what causes this problem, it should be fairly easy, depenging on the cause of the problem, to rewrite the class to print borders and also does lots of other good stuff. I have already coded the new and improved printView method, but this size limitation has made it unworkable.
Simply stated, if I can figure out why the class does not print large icons, the rest should be easy.
Any suggestions would be appreciated.
Thanks,
Kei Gauthier

Help: JEditorPane displays all HTML content centered

I'm using a JEditorPane to display the contents of a simple help file written in HTML.
The problem is that the help file is displayed with all elements centered! That is, every element is displayed as if it had the <CENTER></CENTER> tags around it. The page is not written this way, and displays normally in regular web browsers.
It's a really simple help page, and was written by hand. I have checked, and all of the tags used in the page conform to HTML 3.2. Does anyone know what might be causing this problem?
   private JEditorPane createEditorPane()
      JEditorPane editorPane = new JEditorPane();
      editorPane.setEditable(false);
      editorPane.addHyperlinkListener(new Hyperactive());
      if (theHelpFile != null)
         try
            editorPane.setPage(theHelpFile); //This is a string, the URL to the file
         } //end try
         catch (Exception e)
            System.out.println(e.getMessage());
            System.err.println("Bad URL: " + theHelpFile);
         } //end catch
      } //end if
      else
         System.err.println("Couldn't find file: "+theHelpFile);
      } //end else
      return editorPane;
   } //end createEditorPane

If you are using the standard HTMLEditorKit that comes along with JEditorPane, you should note that it only supports HTML 3.2. This may be the problem. Check page source if div's and similar are used or if the page has "HTML 3.2"-old elements like table's or similar to control layout/display.

How can i display collection of records in HTML Table using DWR framework

Dear All,
Just i start using the Direct Web Remoting framework.I am worrying to get the list of records to display html table using this concept.I did the same like.
index.js
var cellFuncs = [
function(data) { return data; },
function(data) { return data.toUpperCase(); },
function(data) { return "<input type='button' value='Test' onclick='alert(\"Hi\");'/>"; },
function(data) { return count++; }
function update() {
var name = dwr.util.getValue("demoName");
Demo.sayHello(name, function(data) {    dwr.util.setValue("demoReply", data);   } );
var count = 1;
dwr.util.addRows( "tabs",[ 'Africa', 'America', 'Asia', 'Australasia', 'Europe' ], cellFuncs);
alert("hai");
index.jsp
<!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>
<script type='text/javascript' src='dwr/engine.js'> </script>
<script type='text/javascript' src='dwr/util.js'> </script>
<script type='text/javascript' src='dwr/interface/Demo.js'> </script>
<script type="text/javascript" src='index.js'> </script>
</head>
<body>
<div id="tabContents">
<div id="demoDiv">
<p>
Name:
<input type="text" id="demoName" value="Joe"/>
<input value="Send" type="button" onclick="update()"/>
Reply: <span id="demoReply" style="background:#eeffdd; padding-left:4px; padding-right:4px;"></span>
     <table id="tabl1">
     <tbody id="tabs">
     <tr>
     <td>name</td>
     <td>name1</td>
     <td>name2</td>
     <td>name3sdf</td>
     </tr>
     <tbody>
     </table>
</p>
</div>
</div>
</body>
</html>
dwr.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>

<create creator="new" javascript="Demo">
<param name="class" value="org.getahead.dwrdemo.simpletext.Demo"/>
</create>
</allow>
</dwr>
web.xml
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE web-app PUBLIC
"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app id="dwr">
<display-name>DWR (Direct Web Remoting)</display-name>
<description>A Simple Demo DWR</description>
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<display-name>DWR Servlet</display-name>
<description>Direct Web Remoter Servlet</description>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>activeReverseAjaxEnabled</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>initApplicationScopeCreatorsAtStartup</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>maxWaitAfterWrite</param-name>
<param-value>500</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
</web-app>
Demo.java
package org.getahead.dwrdemo.simpletext;
import java.io.IOException;
import javax.servlet.ServletException;
import org.directwebremoting.WebContext;
import org.directwebremoting.WebContextFactory;
public class Demo
public String sayHello(String name)
return "Hello, " + name;
the sayHello() is printing the display.But the table rows not updating.But its object expected.So can you tell me where i need to change and how to add the pagination for the table like 10 by 10 records to display.
Please help me.
Saravanan

Hi Brian,
OAF supports the master-detail based design. You can very well implement your model. You can use 2 VO for your 2 objects and link them using a ViewLink. Check OAF Dev guide for more details.
--Shiv

HTML table display issues in Safari and Firefox

Hey,
A few days ago, in both firefox and safari, i noticed that whenever i go to certain sites with (i'm assuming) what are HTML tables, they aren't displaying properly. The tables are going way bigger than they should.
ex. When i go to craigslist.org and click on any link, each item on the page has way more space between lines than it should. To see what i mean check out these screen capture.
http://www.killtheteleprompter.com/picture1.png
http://www.killtheteleprompter.com/picture2.png
Also, perhaps a related issue, in Firefox, the page scrolling isn't smooth anymore when i use my trackpad.
I tried trashing the preferences for each browser in my library, to no avail. Any help would be awesome. thanks

hey thanks. The links in the orgininal post are fixed. To view the difference, look at the captures, then type in the url that appears in the captures to see what it should look like.
http://www.killtheteleprompter.com/picture1.png
http://www.killtheteleprompter.com/picture2.png

Use JEditorPane to display HTML and RTF ?

Hello,
Is it possible to use JEditorPane to open a HTML file and then save it as RTF?
And open a RTF file and save it as HTML ???
Eric

bump...
has anyone a solution to this?
I have a form that allows users to add raw HTML code. Now I want to display the formatted version in a report but the tags show in the report instead...any suggestions?
regards
Paul P

JEditorPane extra blank when display "image inside table"

Hi,
I try to use the JEditorPane to view the html file. Everythings work fine except
shows the following
<table border="1">
<tr><td><img src="http://somewhere/a.jpg"></td></tr>
<tr><td><img src="http://somewhere/b.jpg"></td></tr>
</table>It can shows out the image inside the table cell.
But there is an "extra blank line" follow the images. This "extra blank line" is inside the table cell.
It likes following
[image]
[image]
But it supposes to be like this
[image]
[image]
I try some sample code in web. It also shows the same problem. Any one have ideas and solutions?
Thanks a lot.
kfchu

Worked fine for me. Here is my test program:
import java.awt.*;
import java.io.*;
import javax.swing.*;
public class EditorPaneLoad extends JFrame
     public EditorPaneLoad()
          throws Exception
          FileReader reader = new FileReader("blank.html");
          JEditorPane editor = new JEditorPane();
          editor.setContentType( "text/html" );
//          editor.setEditable( false );
          editor.read(reader, null);
          JScrollPane scrollPane = new JScrollPane( editor );
          scrollPane.setPreferredSize( new Dimension(300, 200) );
          getContentPane().add( scrollPane );
     public static void main(String[] args)
          throws Exception
          EditorPaneLoad frame = new EditorPaneLoad();
          frame.setDefaultCloseOperation( EXIT_ON_CLOSE );
          frame.pack();
          frame.setLocationRelativeTo( null );
          frame.setVisible(true);
}

Query in Servlet not displaying results in html table

Hi,
I am aware that putting html in a servlet is not good practice. In my case, it is just for testing purposes.
Environment: WLS 12c on Windows, DB 11.2.0.3
I created an html form and a servlet in a Dynamic Web Project. The form parameters are sent to the servlet,
but the results are not being displayed.
HTML form:
<input text name="p_1"
Servlet:
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.SQLException;
import java.sql.Statement;
import java.sql.DriverManager;
import java.sql.ResultSet;
* Servlet implementation class QueryServlet
@WebServlet("/QueryServlet")
public class QueryServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
     * @see HttpServlet#HttpServlet()
    public QueryServlet() {
        super();
        // TODO Auto-generated constructor stub
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
        Connection conn = null;
        Statement stmt = null;
        try {
            conn = DriverManager.getConnection("jdbc:oracle:thin:@home-server:1521:val01", "USER", "PW");
            stmt = conn.createStatement();
String sqlStr = "SELECT....
... WHERE p_1 =
+ "'" + request.getParameter("p_1") + "'"
out.println("<html><head><title>Query Results</title></head><body>");
            out.println("<p>Your query is: " + sqlStr + "</p>");
            out.println("<p>Your are connected to: " + conn + "</p>");
--> OUTPUT ONLY UNTIL HERE <--
            // Get data
            ResultSet rset = stmt.executeQuery(sqlStr);
            int count = 0;
            while(rset.next()){
                int cid = rset.getInt("CID");
// Display data in html table
out.println("<table>");
                out.println("<tr>");
                out.println("<td>" + cid + "</td>");
rset.close();
            out.println("<p>====== " + count + " records found =======</p>");
            out.println("</body></html>");
             catch (SQLException ex) {
                ex.printStackTrace();
                finally {
                    out.close();
                    try {
                        if (stmt != null) stmt.close();
                        if (conn != null) conn.close();
                    } catch (SQLException ex) {
                        ex.printStackTrace();
Help greatly appreciated. Thanks!

Possibly, the js file is not being detected by the javascript runtime.It would be better if you tried something like :
("<script src="<%=request.getContextPath()%>/WEB-INF/classes/ua.js"></script>

JEditorPane/HTMLEditorKit displays weird html-table-borders

Similar Messages

Maybe you are looking for