I am going to do my best to describe this. What I am looking to do is populate a form with values based on a single dropdown. I want to take what the user selects in the dropdown, send a request to rails with the value they selected, do some stuff in a controller based on that selection and return an object back to the form with the fields filled in. Ideally I'd like to do this with jquery.
What you're describing on the frontend probably lends itself to and MVC or MVVM framework. I've used knockout.js for that with great success.
Basically you bind the properties of a JS "viewmodel" object to various elements in the markup. When the viewmodel changes, it automatically updates the markup, and vice versa. When you're ready to send it to your backend, use jQuery.post() to send back a serialized version of the viewmodel. The server can then respond with data that can be used to populate various fields in the viewmodel.
Related
I'm trying to build a custom UI control in alfresco to display the associations of an object type that I have.
Basically I have two object types; Code, which is a key value pair, and CodeScheme which contains multiple child associations to codes, it's essentially a mirror of a map structure I have in a different system.
The problem I have is that the codes are automatically generated, so they get the UID names, whereas really I'd like to present them as 'key=value', 'key=value', etc (ideally I'd like to present it as a table).
I've already created a custom control and added it to share-config-custom, and confirmed that the configuration is working correctly. What I'm not really clear on now is:
a) How to attach a javascript to the control so that I can process the association data.
b) How to get hold of the codes in javascript, and read their properties.
I'm just looking for a push in the right direction.
Thanks :)
One idea would be to use a form filter. Your form filter could iterate over the child references, fetch each child node, grab the data you want to display and then add one or more new properties with that data.
Then, your form control is hooked to the fields your form filter dynamically added to the form data. It can then read and display the data as needed.
Without a form filter I think you'd have to use JavaScript to parse the child association refs and use AJAX calls to fetch each child's node data, then format that as needed. The form filter idea would be less traffic from the browser.
I have a form that registers teams of people. Based on a dropdown to select the number of members in the team, the form should show that many model forms, one for each member.
I am not particularly sure what the correct design patter for this is. Here are the solutions that I have come up with:
Use JS to generate the HTML for each member form and then use the Django ModelForm backend to parse each form. However, in this case I cannot use the inbuilt rendering functions of Django and validation notification becomes bothersome.
Send a GET request whenever the user changes the dropdown value, and the GET request specifies the number of members you want to add. But here it would result in any previously entered data being cleared.
Send a POST request via JS whenever the dropdown is updated, and then re-render the form with the appropriate values picked up from the POST request. I am not sure if this is the right way to do this and seems to be easy to get wrong.
Can you please advise on what is the best solution for this scenario?
I am pretty sure this has already been answered somewhere, but I can't seem to find it anywhere. If you have the link to the answer, please go ahead and mark this question as a duplicate.
I'm working on an internal tool using spring-mvc and thymeleaf.
A section of this tool is used to create an entity we save in the database.
This entity is quite complex; it contains many properties and relations. Some of these relations contain list and other properties.
I have 2 constraints:
Single page. No "wizard".
To only save a completed object in the database.
Now, I'm not really asking for a specific issue. I know my way around thymeleaf, spring #ModelAttribute, etc.
My question is mostly which strategy are you choosing or how to deal with really complex object creation.
Now I can see 3 ways to do it :
Rendering page with thymeleaf. Every time a new element need to be added to a list, I use Ajax to add the new element on the server and rerender the specific fragment. So doing back and forth to the server with my #ModelAttribute and only save at the end.
Rendering a basic page with thymeleaf. Using JavaScript to create html elements and instead of submitting to a #ModelAttribute, I'm serializing my form to JSON and submit this JSON to the server. (kind of client side model)
Rendering a basic page with thymeleaf. Create the html element dynamically with JavaScript when I need to add list item (being sure I'm putting proper name="" to fit with my Java form object) and submit the whole thing at the end.
I'm personally unsure between 1 or 2.
I feel dealing with complex object is much more easier using JSON than form submission. Also, the input value/field with sub object and property can be quite nasty. Having this kind of syntax
does not sound great to me...
3 can probably work but the way spring data binding is done with sub property is lacking some detail in my humble opinion (section 7.4.1 - http://docs.spring.io/spring/docs/current/spring-framework-reference/html/validation.html).
What do you think ?
Personally I use Thymeleaf's own dynamic field management to ensure clean addition of objects and fields to object.
So I will recommend option 4: Dynamic Field management by Thymeleaf.
Have a read of http://www.thymeleaf.org/doc/tutorials/2.1/thymeleafspring.html#dynamic-fields.
I use that for both single field additions as well as addition of nested forms. Does the trick no questions asked.
Hope that helps.
I'm working on a Spring MVC app, which should let user alter contents of a list.
The list consists of Book-objects with simple properties like name and author. The view is a JSP page that displays the list of books and lets the user alter the contents.
Altering the list can mean adding books, removing them or changing the order of the books in the list.
Question is, how do I get the altered list back to the server? I can write JavaScript to control the list, but how do I post it to the Spring controller? On the other hand I can write a JSP form for altering the model which would be trivial to submit back to the server, but am I then limited to basic text fields in form input?
EDIT:
In JSP it is very easy to alter a single model's properties using a form like
<form:form action="myaction" method="post" commandName="mybook">
but if your model is a (ordered) list of objects then how do you edit it?
In Javascript I can get the list of objects from the response and change it as needed, but how do I submit it back to the server? Something like
$.post("/modifybook.do",{ name: "Spring in Action", author: "Graig Walls" } );
works, but only for single objects.
Having never used Spring this may well not be appropriate but could you not convert the list into XML and then post that back to Java and then work on it retaining all intricacies and changes?
You should avoid manipulating the whole list, period. I can't see a scenario where populating entire list of items and sending it back to the server is desired, when only one list element is being changed (edited, added or removed).
What I usually do in my app is I create a handler (controller) for returning a whole list of objects in one go and then add another handlers for adding, editing and removing single entries within that list. I also try to stick to REST in such scenarios, so that I have a clean API which represents server resources and the frontend (AJAX + jQuery) makes use of it.
This solution works really well for me so I suggest sticking to it as well.
I am a newbie to writing JSPs.
In my JSP I have dynamically created a form with select boxes
(i.e. these fields are not in html)
In one of the selectboxes, I implemented a onchange method which passes the value as a parameter and re-displays the form. When the form is redisplayed the parameter I've passed, sets the value of another select box according to the parameter's value, using an external XML file.
One Problem is that after the onchange method as the current page is resent and reloaded, selected values of the other fields (around 10 fields) are lost.
Currently I use the following approach using the Session to address this problem
in my JSP; in the onchange method, I use javascript to load selected values and pass them as parameters to a servlet in a GET request. In the servlet, I receive the parameters and set attributes in the session.
In the JSP, I use getAttributes in the session and change the selected values during the dynamic creation of the form.
I wonder if there is a simpler way to do this as I have to create a lots of fields for this to work. Also I didnt make use of a databean in this case.
Since dynamic creation of fields is using java logic, Is it true that ajax can't be used?
Could you please advise me on the quality of my design? Am I staying true to the MVC design pattern?
If I am not wrong, your whole question basically boils (understatement) down to the following:
I have a form with a bunch of dropdowns. I am submitting a form during onchange of a dropdown. How do I retain the selected value of all other dropdows after submit?
Yes?
OK, just set the selected attribute whenever the dropdown option's value matches the submitted request parameter value. The below example assumes that you've a Map<String, String> as ${fooOptions}:
<select name="foo">
<c:forEach items="${fooOptions}" var="fooOption">
<option value="${fooOption.key}" ${fooOption.key == param.foo ? 'selected' : ''}>${fooOption.value}</option>
</c:forEach>
</select>
Do you see? When the form get submitted, the currently selected option of the dropdown with the name "foo" get sent as a request parameter and is in the server side available as request parameter ${param.foo}. While dynamically generating the options, you just check if the option's value equals to the request parameter value and if so, then just set the selected attribute.
Please note that this has nothing to do with sessions and such. They serve a different purpose, generally with regard to the current visitor in person, such as its login, preferences, shopping cart, etc. Do not use it to store form values. It'll only conflict whenever you've multiple browser windows/tabs open in the same session.
JavaScript is only helpful if you would like to do the ajax magic. But I guess that it's only another steep learning curve for you. Perhaps for later. In any way, you can find some kickoff examples in this answer: How to use Servlets and Ajax?