spring form submission in a popup - spring

I have a small problem in my first spring&hibernate application.
In my page, I would like to create a popup window (modal) which gives the possibility to send an email. So, this popup would display a spring form with a fied "subject" and a field "content".
The question is : how can I use the form binding mechanism of spring with this popup form if I don't want my main page (displayed behind the popup form) to be reloaded?
If i am not wrong, the content of the popup is a div present in the main page. So, If I submit the form in the popup, the whole page will be reloaded (through the mvc mechanism of spring) and this is exactly what I don't want.
Of course, I can submit my form via an ajax call to a spring controller, but in this case, how to handle the eventual errors in the form? I cannot use the spring form binding mechanism to display the errors on the popupform. Is it possible?
Do you know if there is a way to open a new window in a modal popup? So that this page and only this page would be reloaded during the submission of the form?
Actually, I am not sure of the best way to combine a popup containing a form and the form submission mechanism of spring. How to display the errors on the form in case of errors? after reload of the page, If there are some errors, I need to open my popup again in javascript and then display the errors on the popup, this is the only mean I see, but maybe there are easier solutions.
If you have, I would be happy to know it.
thanks a lot

Related

What is the best way to place 2 forms on the same page?

What is the best way to place 2 identical forms on the same page, but use the same form action and fields for each form? How can I keep response messages in the respective form area from which the data was submitted?
I'd have one form in the footer of my site, and one form in a popup on the home page of my site. I'm using a hidden div and Magnific to open the popup containing the same code from the form that is located at the footer. Essentially, both form do the same thing, and utilize the same form action.
I do not have access to the form action, or the code in the form action page.
Currently, the forms existing on the same "page" are no problem, but when I submit an email on one form, the errors and success messages show up on both the popup form as well as in the footer form.
I've read that this may be possible to do with ajax, but for completeness sake, I want to make sure that I'm building that I'm doing what I can with the form html, before moving on to studying ajax for this.
Sadly there is no nice html/liquid solution for this.
The only way is to use cookies in order to save information which form was submitted and show the error message only for that form instead of the two ones.
AJAX is not a good solution because of the Google Recaptch-a when you submit the form more than once, which is a real pain in the a** since there is no way to disable it and the form will fail if you try to submit it with ajax.
The easiest solution is to use cookies, other option is to rely on an APP for this, but it may be an overkill for this.
Forms in Shopify are... how to put it nicely... dumb... basic... not developer friendly or just not made to be tweaked in any sort of way ( excluding the front-end ).

Is AJAX only for dynamic content or can it also create buttons, and change css properties?

I was wondering, is Ajax only for dynamic content update or can it also, say, create a few buttons in a given div depending on what action a user chooses in another div? For example, if the login page and first page look very similar by only a few buttons, once proper login credentials are entered, can I use Ajax to make the other three buttons appear once logged in properly, rather than going to a whole another web page that has those buttons hard coded in the html/css? If this is possible, I'll take pointers to any tutorials. Thanks.
AJAX is just for creating HTTP requests using javascript, in order to prevent full page requests.
What you can do is to process the login request using AJAX and then, depending on the response you send, to display an error or update the DOM with the logged in interface.
If you just want to change the DOM, you use javascript directly (jquery would help) but no AJAX is needed.

Validating form using jquery Ajax MVC

Up to this point, I’ve been using Microsoft Ajax for updates in my MVC app. I’m now switching to jQuery Ajax in order to standardize my approach.
However, I just realized that the required field in my model for the form did not fire and the user was able to submit the form even though some required fields were left blank.
What is the standard way to handle required fields if I’m handling my ajax functions using jQuery – i.e. I want the unobtrusive to handle my required fields by highlighting them and not allow the submit button to be clicked.
Also, to mention I am getting data-val attributes through the model.
P.S. I’m now using an event handler to detect click event on submit button for the form. In other words, I’m not using #using.Ajax.BeginForm to define my form.

EditLive! Rich Text Editor - submitting form via ajax

The project I'm working on is using the Java EditLive! rich text editor. I've been trying to make the EditLive form post via ajax, but am having some problems using IE8. Here are the steps we're taking:
Load the main page
The user clicks a link and the EditLive applet is loaded and attached to the page via ajax
The user finishing editing their document and clicks the submit button
The form posts via ajax (we're using jQuery.post())
The EditLive section is reloaded and the EditLive content is correct.
The form immediately posts again
The EditLive content is back to being blank.
Unfortunately (for debugging reasons), this is not happening in FireFox - there is only a single form post and the values are saved correctly.
From what I can tell debugging this in IE8, it looks like the submit event is getting called twice with 2 different forms. My thought is that the applet isn't getting destroyed correctly, though I've tried everything in my power to destroy it.
So I was wondering if anyone has any experience successfully submitting EditLive data via ajax? Or maybe this is just a limitation to the product?
Any help would be greatly appreciated!
I know this is an old issue but you likely want to look at the autoSubmit property of EL:
http://docs.ephox.com/display/EditLive7/AutoSubmit+Property
http://docs.ephox.com/display/EditLive/AutoSubmit+Property
I suspect that by using an AJAXy submit process this is somehow causing you issues with EditLive and its standard behavior. I would try turning off autoSubmit and grabbing the content yourself in your jQuery posting process.

Sending postback to ajax loaded user controls

I have a set of tabs, which all of them together contain alot of data. I am making the tabs load async. I have one button above the tabs used to save changes. I need this button to send a postback to all the loaded user controls (using this). I need the user control to handle this postback so it can save changes.
What do you think? Any suggestions?
Tried doing it, doesn't work. I am going to have to do some magic with updatepanels and a custom postback.

Resources