New to HTML javascript programming and have an issue with implementation of my page.
I have created multipage HTML form layout(using div) which runs 4 pages with approximately 140 input values(most are optional values) all together. I need to implement a preview page before actually submit where in only filled input values along with their labels are displayed within a section of the page.I am able to collect the filled input values and the label values to an array using javascript. However the issue is, I am not able to figure out how I can pass these values to the actual in html summary page? I cannot implement .innerHTML as my labels need to be dynamically generated based on input values. Can this even be done just by javascript or HTML or do I need a server side script to implement the preview page? Does learning DHTML or AJAX help to implement a solution to this problem? I appreciate all the help. Let me know if I need to explain better.
The BEST way would be a session variable in a server-side language. If security is not an issue though, you can save the variables into a cookie though javascript.
See here.
Related
I am not great with java script. I have a number of web pages that are all almost identical. As a result I can use the same help page for all. All I want to do is pass the title of the current page to the help page.
The web pages might be called
Fiction eBooks, Non-Fiction eBooks, Classic Fiction eBooks... You get the picture. Every page looks pretty much the same, only the topic and eBook descriptions change.
Rather than create a help page for each type I want to create one help page and pass the type of eBook to it. For example:
The user is on a page titled, "Fiction eBooks" I want to call the help page like this, http://ebookwebsite.com/help.html?Type=Fiction
When the help page loads it will display "Fiction eBooks Help"
All I can find is information for passing form data from one web page to another. This is far more than I need.
You can just send it as part of the url, if you are using a link.
eg: Help
Depending on how you get the title for each, you can even make that link dynamically generated, i.e if you are using jstl or freemarker or handlebars or any such templating/pre rendering you could add the variable for type to prerender.
I'm building a webpage in web2py.
The effect that I want to achieve is a form that one can submit in the usual way, but where the html page containing the form also features an html canvas which is managed by js code that is able to dynamically see the contents of the form. This enables a sort of preview to be seen live as the user changes the contents of the form and updated continuously prior to the user submitting the form.
It seems there are two challenges to doing this.
1.) web2py likes you to define forms in the controller which generates to form code automatically - I don't see a way to add extra elements in the middle of the form by editing the html page.
2.) I don't see any way to get js code to dynamically read the values entered into the form.
Any suggestions of how to do this would be much appreciated. I'm new to web2py but have spent quite a while trying to figure out how to get this working
Thanks!
1.) web2py likes you to define forms in the controller which generates to form code automatically - I don't see a way to add extra elements in the middle of the form by editing the html page.
Regarding the above, letting web2py generate the form HTML is an optional convenience. If you need custom markup, you can do that as you normally would. There are also ways to add form elements to web2py's server-side DOM representation of the form.
See:
http://web2py.com/books/default/chapter/29/07/forms-and-validators#More-about-manipulation-of-FORMs
http://web2py.com/books/default/chapter/29/07/forms-and-validators#Adding-extra-form-elements-to-SQLFORM
http://web2py.com/books/default/chapter/29/07/forms-and-validators#SQLFORM-in-HTML
http://web2py.com/books/default/chapter/29/07/forms-and-validators#Custom-forms
I want to use ClientSide Javascript for listbox, it should take values from database table when the page is loaded first time OR load the specific table in javascript,
Right Now, all the values are coming from database, if I select "StandardM1(CA)"
it brings all the values from "food_menu" table.
I want to do the the same thing with client-side javascript in order to save time and server requests, so that the application runs faster.
Can some one please guide me?
Faheem use array in it and try to do the coding right on the save button. its the save button that is creating problems
I have a rather long form where a user has to fill in some sections and leave others blank depending on their circumstances and then I will save the sections to a database. To help visitors stay organized I have utilized jQuery UI's Accordion to divide the form into sections.
Now that the form is built I'm trying to find a way to display just the sections they filled in so they can print them off. If I simply bring up the form and they try to print it, it will print the accordion sections.
Right now I'm thinking of getting all the div's that have inputs filled in, combining them, and then sending them off to the DB to be saved so I can call them up later. This seems a little sloppy to me and I would prefer something tidier and that would be considered "best practices." If anyone has a better, neater, more efficient way of doing this I would appreciate your input! Thanks!
I made something similar for my work. I gathered the fields that were actually filled in and created an overview on the same page using jQuery. Rendering this info on the client and on the same page saves you from a server/database call.
We used jQuery serialize() for fetching the filled in input fields and labels and created a JavaScript object with the values so we could render these in an overview. This overview would render in the page when clicking a check form button, then if the user is not satisfied they can go back to the form by cancel or proceed.
You might want to split it up into tasks:
Store relevant form HTML in a variable
Filter out the fields that are empty
If necessary reorder the HTML
Render the HTML for viewing and printing
In my application i want to print payment receipt.If i enter amount and click on save it will print automatically.
The data look like
Thank you for receiving
Text Box value( from payment page) amount .
In the print i don't need any thing like URL except data .
Thank you in advance.
If you are willing to use a java applet, this might work:
http://code.google.com/p/jzebra
Unfortunately for the most part, you will be unable to control this.
You can do a few tricks such as a separate media=print CSS style sheet which will allow you to fully customise the page, however, you will still be at the mercy of whatever web browser your visitor is using - most of which print headers and footers.
The best thing I can suggest if this is very important is to look at integrating a PDF component in to your application - It won't be easy, but, it should work well.
You can then have the confirmation page as normal and a dynamically built PDF document that will be loaded from the same information. You can then fully customise it to your exact needs.
I am currently trying to do something very similar myself - currently looking at this example with PDF Sharp.