OK, I have a Form in my web application used to fill out some shipping details. Certain orders require printing this form, to accomplish this I have a Div on the page with the display style set to none. It contains our company logo, shipping information and a table that is dynamically populated with information from the form once the Print button is selected. I am using the InnerHTML of the Div to print with a JavaScript function to print the form.
My problem is I also need to optionally email this as a file attachment.
The only way I can see this working would be to save this Div to a file in my application and then attach it to the email.
I have had no success trying save the HTML in to a file though.
I am not stuck to this approach, I am looking for a direction to go in.
My only requirements are that the information is sent as an attachment and is visually appealing - including our logo etc.
Thanks for any help - I didn't include any code, didn't seem relevant.. let me know if you want my print function of anything else from the project.
You need to improve the design of your application. First, it should be the server side not the client sending the email or processing the order. So forget about JavaScript here unless you are using node.js on the server side. Your server side serves the HTML for the client to display, ideally it is dynamically generated from bits and pieces or using some sort of template. As soon as you have that you can use the same code that generates the HTML served to the client to generate HTML send via email. It may have differences but most building blocks can be reused. Having done that just use whatever email library is available, set the content type to HTML, provide the dynamically generated HTML as the body and off it goes. None of that is done in the client JavaScript.
Related
I am trying to build a user input (contentEditable div) for a chat where someone can write something and tag someone like hello #user32. In that case, I want the #user32 to be replaced by a link and formatted.
I am trying to understand what would be the best approach for the client and the server.
Should the client (javascript) remove the <a src="xxx">User32</a> tags before sending the message to the server #user32 in the message? And each client receiving the message would process it to display it?
Should the client send the complete message including the link to the server and the servers cleans it before inserting in the DB?
Should I insert in the DB the complete message including the link without pre/post-processing on the server or client ?
I would think option 1 would be the best to keep clean data so it is not client-dependent, but I am concerned about having a visible formatted message in the contentEditable div and maintaining hidden data to be sent to the server or is there an easy way to do this? Or should I still go with option 1 and clean the message before sending? i.e. replacing all links with a specific tag/class the raw #user32?
I did have used this library in the past and worked out pretty well for me, even that in the time didnt used a content editable div, but a larger input.
I suggest that you tried it out and check if it fit your needs.
I have just started out working with JS and I've managed to post data from a MySQL db to the website using node.js, jade and plain JS.
Now I'm trying to do the other way around, i.e. getting data from the website, to the JS code and then inserting it into the db.
What I'm thinking is simply making a textfield with a button. When I fill the textfield and press the button it is collected by the JS script and the inserted to the DB.
I am however having problems with Jade and the listener and I'm unable to even do a console.log using the listener.
This is what I've got so far in my .jade file.
extends layout
script.
var something = function() {
console.log('something')
}
block content
button(onclick='something()') Click
The website renders nicely, but nothing is printed when I click the button.
If someone could give a hint on how to fetch the data in my .js file that would also be appreciated.
In the context of the WWW there are two places that JavaScript can run.
On the server, e.g. with node.js
On the browser, embedded in a <script> element
Since you want to put the data into a database on the server, you want to go with option 1. So don't use a <script> element.
Use a <form> (you could use client side JS to read the data from the form and send it to the server (Ajax) but that seems overcomplicated for your needs and should be layered on top of a plain HTML solution if you were to go down that route).
form(action="/myendpoint" method="post")
label
| Data
textarea(name="foo")
button Submit
Then you just need to write server side code to retrieve that. The specifics of that will depend on how you are implementing the HTTP server in Node.
The question How do you extract POST data in Node.js? provides some starting points.
Currently I'm working on a project where a user enters a lot of data constantly for a hour long window. I'm looking to have one user control all the data via some control panel and then have a link they can distribute to other users that will allow them to view that data without the ability to edit it.
Right now I'm doing some extremely weird methods. I have an XHR request on the control page that fires whenever a field is finished being edited. From there the data is sent to a php file that converts the data into a simple text file. Then the distributed link file will load that file one time and translate it into the necessary format.
Some potential problems I've run into are it seems odd that I'm sending starting as javascript data then going to a php file then to a text file then translating the data all the way back into javascript data again. Another problem I've come into is I'm not sure of a way to force users to reload the page when a field is edited in the control panel after the user has opened the view page.
Have I totally gone overboard here? What are some better concepts I could employ to accomplish this task?
If i understand what you want to do this is how i will do this:
First the data entry
if you have lot of fields you better use a form wizard, i don't have a particular one in mind right now but there is lot of them just search jQuery Form wizard
Here is an example:
http://i.stack.imgur.com/Luk2b.jpg
The concept of the form wizard is to guide user via multiple page and also validate the data. And click save when and the end.
Then save date in database.
Display content
All you need to do is to create a global separate page to display your content.
Let see something like: http://yourserver.com/view/{id}
where id is the identifier of the particular row in your database.
i'm not sure if i totally understand what u about to do. i'm trying to make your work description shorter here:
want to build a website that one person can edit a single page's content in 1 hour, and others can view the content change in that 1 hour.
if this is what u want to build, here's the module:
teacher: the one who can edit the page
student: the one who can only view the page
server: information center
teacher client edits page -> teacher client sends update data to server -> server saves data -> server sends update notice to student client -> student client receives update notice -> student fetches update data from server
to make this module work well, i suggest try socket instead of http reqeust, just like online games or IMs do.
well, try socket.io
I want to create an HTML form on the Server. When the client completes the form and clicks submit, I want to be able to save HTML form and data in a single HTML file on the server.
The best suggestion I have seen is using JavaScript. Use a client side script that on click will save the document.InnerHTML to a var that can then be submitted back to the server.
Is this the best approach, or is there an easier way?
Even though I have no idea why you want to save the whole html code because I'm sure there will be parts that are the same for every user and you will be wasting memory, but ok.
So there are two ways to do this:
1. is javascript as you said
2. would be to put all the generated html code into a hidden form input (already on server side)
the first one seems more comprehensive and this is what I would do but the second one would also work for users with js disabled.
I wouldn't really recommend this way, because I'm still a huge fan of saving data in a database, but here's a general outline of what to do:
User fills out the form and submits.
Server-side code executes a method:
a. String holding the template for your HTML page with placeholders for the fields.
b. Use String.Format to put all the user input into the correct places.
c. Create a file, write the string to the file, and save.
d. Return file name to user.
HTML files are not that large, but still you risk using up your hard drive space. Also, you need write permissions which introduces security risks.
Going the database route:
1. User fills out the form and submits.
2. Server-side code saves the data to a database, and returns a link (with querystring string of ID and possibly a user id to help with security) to the user.
3. Whenever the user goes to the link, the server-side code repopulates the form with the ID passed.
I've got a web application (php/symfony2 - but it doesn't matter here) with heavy AJAX usage and quite a lot of javascript in the client side layer. The interface enables the user to filter the data he wants to display (periods, checkboxes, selects, etc.) and basing on those choice, a POST request goes to the server side for data and JSON is returned through AJAX.
Now, I want to add a functionality to download the data file basing on the criterias/filters that reside in the javascript layer - and I'm not sure how should I do it.
Let's say I've got a <a href="some_action_url"> tag that - if I click - it downloads the file. I know how to do all the server-side stuff. But I don't know how to pass the criteria parameters from javascript to the server-side controller a using the <a> tag.