Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 201
  • Last Modified:

Drawing complex html tables in wysiwyg editor

I'm working with html documents that are made to look like a paper form, with lots of lines and boxes, where different text is placed (by my application) in the proper locations.
Normally I design these html "paper forms" manually, with traditional html coding, but now some other non-tech people will begin designing the forms instead.

I've tried letting them use MSWord and "save as html", which almost works. Word does quite a good job at handling complex structures. There is lots of "garbage" in the resulting html, but I can quite easily automatically tidy up/filter away such MS stuff.

However, there are limitations. Word kind of "links" different table cells with eachother, and the designing users have difficulties drawing the forms as they would like to.
Also, the Word html result is not static enough. Depending on the text content, the lines and boxes "move around" a little too much.

So... I've been looking for some WYSIWYG editor that generates html, letting the user "paint tables" more or less on free-hand.
All the editors I've tested (including Adobe dreamweaver etc) however are stuck in the idea that a "table is X times Y cells" and only allows more complex structures by having the user painstakingly create tables in tables in tables, etc etc. Much too advanced for the users that I'm working with.

I would like to find something more "free hand"-like, where the user "draws the lines" that is to be printed on the paper form, and the html editor then calculates how a corresponding table should be designed.
Does anybody know of a tool/editor like that? Commercial (expensive) is ok.

Of course it doesn't have to be <tables> - other types of html markup might be ok as well, but I'd really like the user to "draw lines", as much as possible, rather then be thinking of html structures.

In the end, the html is passed to wkhtml2pdf - so I'm limited to the kind of html that this tool (based on webkit) can handle.

Any ideas/experiences?
/Thanks
0
Stefan Lennerbrant
Asked:
Stefan Lennerbrant
  • 4
  • 3
1 Solution
 
Stefan LennerbrantAuthor Commented:
Just an idea...

One alternative would of course be to create a monter page with 1000 x 1000 very small <td> cells.
Then the editor/tool would "only" need to insert colspan and rowspan attributes (and borders) at proper locations.
Possibly, this could even be done using a sed script that worked on the "save as html" result of MSExcel, or similar. Thus, the user would "paint" in Excel, using the very small cells as a grid.

Has anybody done something like this?

As the html (in my case) is only used by wkhtml2pdf to generate a PDF file, it doesn't matter if the html input is a "monster table" - as long as the resulting PDF is ok. I however haven't tested what wkhtml2pdf would do with such a html input.

Just an idea... :-)
I'm open for all suggestions
0
 
Kyle HamiltonData ScientistCommented:
if the resulting document is a pdf, why bother with html at all? in acrobat pro you can design forms, and pro isnt prohibitively expensive
0
 
Kyle HamiltonData ScientistCommented:
in fact, illustrator is the answer to your dilema. totally free form design, then save as pdf
0
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

 
Stefan LennerbrantAuthor Commented:
I need to insert a lot of text (quite complex stuff) into the document, and I cannot do such operations working directly on PDF.
Thus I need to use html as an intermediate format - most of all because all other parts of the application works on html data, and we need to re-use that logic.
0
 
Alexandre SimõesManager / Technology SpecialistCommented:
Have you considered Microsoft Publisher?
If your users are familiar with MS Word,, MS Publisher will give you the same experience but way more power.
0
 
Kyle HamiltonData ScientistCommented:
In that case,  Adobe dreamweaver is actually a really good option. Dreamweaver does allow col spans and row spans. You can change the view in dreamweaver so that you can see the table borders as you are editing. You can also 'combine' cells in a wyswyg fashion. It's not "table is X times Y cells" like you say. You just have to know the features of dreamweaver that you need for your project. Then you can show your designers how to do what they need to do. It's not rocket science. Your designers will only need to learn a very limited number of features. If they are able for Word or Exel, then they should be able for this.
0
 
Stefan LennerbrantAuthor Commented:
Using Dreamwaver proved to be much to limited in document/form layout handling. MSWord is much much more powerful and versatile.
I had to work hard to get around all "tricks" that is the downside of MSWord, but eventually it payed off. I've also looked into several other editors, but none is even close to the functionality/complexity of MSWord. Unfortunately.
0
 
Stefan LennerbrantAuthor Commented:
Unfortunately, there has proven to be nothing like MSWord. One has to cope with the downside of its "stupid intelligence" and the somewhat weird html output that it generates.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now