I am making an application using ASP.NET MVC 3 which contains "form wizard", i.e. there are three forms which are wizards.
First form is for entering user details, second is for selecting product and third is for entering his payment details.
When the user enters his details in first form and goes to second form by clicking next submit button. And in the second form when the user selects the product, then his details from first form and his product choice from second form is sent to admin for approval. My question is that where should I save data from first and second form till users approval. When the user is approved then user data is saved to database. Where should I save form data when going from one form to other.
JavaScript Way
Just because "form1" and "form2" look like two physically different forms doesn't mean they have to be. You can initially display the container for the first set of inputs, then when the user clicks next it hides the first and shows the second.
Once the user is finished with the second set of inputs the page submits both sets of fields to the server using one form. At this point it would need to go in a database or be emailed to someone for persistence.
Traditional Way
If you need to have each form on a different page and submit between each one you could do it like this: (Note: this is a really bad way)
1. Form 1 submits
2. Server responds with form2 and data from form1 (to store in hidden fields on form 2)
3. User submits form2 (along with the hidden form1 data)
Related
I have a form to create a new resource (for example a new user account). When the form is submitted, I want to show a summary of the data which the user has just submitted before actually storing this data. Under this summary, there is a confirmation button. When the button is clicked, the data is actually stored in the database.
What is the naming convention for the routes and controller methods in the following operations?
Displaying initial form
Submitting the form and responding with summary
Pressing the confirmation button and storing the data
When I fill my employee form and performance details and click "to submit" button, I want it to show all the data on the same page and I want the form to become empty so that I can refill the form for the same employee again.
screenshot
Use redirect_to :back in your controller to, what for it, redirect back to the previous page (or more accurately HTTP_REFERER)
To ensure the form data is blank, the model it is rendered on should have blank fields with something like #performance_report = PerformanceReport.new.
If you want to show both the old data and the blank form, you will need your controller to create two instance variables, one showing previous data, and one empty.
I'm using Joomla to develop a user profile management component with AJAX.
The goal is to allow the user to edit his own user information. There is a lot of information so instead of having one massive form, I decided to make "subforms" or sections. And for the whole thing to be user-friendly I want to send the forms and refresh the user information with AJAX.
Here's an example :
There are two sections, "Basic user info" which displays the first name, the last name and the age of the person and "Extended user info" which displays the occupation, the company and the skills of the person. Each section has an "edit" link (or button) which turns the content into a form (AJAX) allowing the user to modify the presented information. You can only edit one section's information at a time. When the user has finished modifying the data, he sends the form with a "send" link (or button) and the section gets back to simply displaying the information of the section (with the updates that were just made).
So I need to know what is the most efficient way to develop such a component. I thought of two approaches :
1) In the "tmpl" directory of the main component view we the following files :
default_basic.php (displays the basic user information),
default_basic_edit.php (displays the form which allows the user to edit the basic information)
default_extended.php (displays the extended user information),
default_extended_edit.php (displays the form which allows the user to edit the extended info)
default.php (loads each of the display subtemplates with calls to JView::loadTemplate($subtemplate))
When the user clicks on an edit link, an AJAX call is made to the following URI index.php?option=com_userinfo&view=userinfo&subview=basic_edit&format=ajax, which causes the view class to call $this->loadTemplate('basic_edit') after assigning the user information to it.
If the user clicks cancel the same process is used to load the 'basic' template again. And if the user modifies the information and clicks the send link, the form is sent and then the 'basic' template is loaded too.
2) There is only a "default.php" file in the "tmpl" directory which holds the edit version and the display version of each section. But all the edit versions are hidden at first. And when the user clicks on the edit link the display version of the section becomes hidden and the edit version is displayed (using display:none and display:block). Then, if the user clicks the cancel button we do the opposite. And if the user clicks the send button we send an AJAX request to update the data in the database and return the updated user info which will be loaded into the display version of the section. And we finally replace the edit version of the section with its display version.
I know there's a lot of text but in the end it goes down to choosing between refreshing full HTML blocks with AJAX, or just sending the updated info and modifying the content of hidden blocks and then make them appear. So what do you think is the most logical approach, knowing that we are in a Joomla 1.5 environment ? How would you procede ? (maybe there are other ways to create such a component ?)
(I tried both ways and I couldn't entirely make it work so I decided to ask to see if it is a matter of conception...)
Thank you for taking the time to read all the text.
My answer is: why even refresh parts when it can be done without it?
For example when we are talking about basic form elements like text fields and check/radio buttons I would prefer the following: on a successful save/send simply display a nice message like "Profile saved" for some seconds and the user is sure that the changes are save and sound.
In case I msissed somthing let me know.
I have tried both solutions and #2 is the only one that worked for me.
I have a joomla site where users can log in. Once logged in, a user can display a list screen -- say, a contact list with a name column and a phone number column. I call it a list screen, but I guess it could be called a list view, grid view, etc.
I'd like to make one of the columns (say, the phone number column) editable in place; meaning, I don't want to force the user to open a contact editing form. Thus, in the phone number column, a text box should be displayed on each line. The textbox contains the existing data for that row. The user can change the phone number in the text box directly in the list screen, and then press some 'save' icon on that row to save only that row (and only if it has changed). It'd be nice if the saving was done with an AJAX request, but it'd be ok to submit a form for now.
Based on the 'list screen' in the book "Learning Joomla Extension Development", I can currently display the correct list of items for the user. Does any one have example/tutorial of how to do the saving of each row individually? It seems like all list screens that I see have a link which must be clicked to open an edit form, as opposed to allowing editing in place.
Thanks
You have to write a component first. Which will basically do the saving part of the individual row. So basically your component URL takes parameter as row_id phone number etc and have a update query updating the database.
Second is you need to write a javascript function which is called on click of every save button. The javascript function reads row details by reading from the DOM. and then fire an ajax request to the above mentioned component. the URL to the above mentioned component should have format=raw.
The result from the component update queries can be returned as true or false. And accordingly read by javascript ajax response. based on which A flag could be shown saying row updated. I can help you with code further if you describe it in more details
What would be the best design layout for a web form with more than 100 fields? Right now I have grouped the fields to tabs.I am having tough time in validating the fields.I should either validate it on 'Submit' of the form or on tab change.Both has its own drawbacks. If I validate on tab change then user cannot view other tabs till they fill all the mandatory fields in the previous tab.Also it is not an good idea to throw so many validation messages to the user when he submits the form.
Please share your thoughts..
You can use a stepwise process. In the first step provide all the most important fields. Then on the click of a 'Next' button you can go to the next step and so on. By validating the fields you can allow the user to go to the next step.