I'm trying to use a jQuery dialog to submit a form via ajax to my struts2 action. On success, I'm redirecting to a different page. This is working great. The issue I'm having is handling non-success result types from my action. What I'd like to happen is for my action/field errors to somehow get populated into my dialog so that the user can make the necessary changes and resubmit the form. Any thoughts would be greatly appreciated.
You should return any errors fromthe action wrapped as a json or formatted HTML whch van then be displayed in the dialog.
JQuery supports error handler method for the Ajax calls make sure you set the http response code properly ans you should be able handle errors differently from success cases.
Related
I have a form where the user should be able to save even if there are validation errors.
These errors should be displayed once the user get into the form again.
So, i would like to invoke the validation of the entire form just after the form is displayed.
Currently, the validation is handled thru AJAX with several custom validators by using <f:validator/> and <p:ajax/> only when the user edits the field
Any suggestion is welcome!
Thanks!
An option would be to submit the form after it loads directly.
To achieve this you can use p:remoteCommand and something like jQuery('document').ready(function(){remoteCommandName()})
So I'm able to successfully integrate AJAX requests with Spring MVC. However, I have a problem- if I click the "submit" button of my form, my #Controller class detects the url and returns a ModelAndView. However, what I want is that there be an AJAX check first, and if the form submission is not successful (e.g., blank fields), return an AJAX response. Otherwise, proceed as per normal and display a ModelAndView. However, I have no clue how to integrate both at the same time.
Any ideas or tutorials are appreciated.
Thanks!
You have several choices:
submit the form to a specific, different URL, when using AJAX
add a specific parameter to the request when posting using AJAX, and use this specific parameter to check if the request is n AJAX request
test if the X-Requested-With request header is present and contains XMLHttpRequest
I would go the PJAX route or what's also known as HiJax.
Basically you return a subset of the page if it's an AJAX request using headers. Most people than just use conditions in their view/template to decide to include the full or chrome-less HTML.
I am an average newbie to CakePHP. While reading cookbook found Ajax form and its submission. But it lacks more details.
What are the main difference between ajax form and a normal form or What are the more specific cases we need to use Ajax form over normal form?
An example will be appreciated
Thanks....
A properly implemented Ajax form is exactly the same as a regular form, except that if JavaScript is enabled a submit handler will be bound to it that will prevent the normal submission of the form and send the data using the XMLHttpRequest object. The response will then be processed by JavaScript in the current page instead of by loading an entirely new page.
This isn't necessarily a CakePHP question, it's understanding what AJAX is.
AJAX in layman's terms is basically submitting data to a website without reloading the current page. If this is the sort of feature you want, you'll need to look into the RequestHandler component and the JsHelper in the CakePHP book for the version you are using.
I am a beginner using ajax and I always thought that it is completely asynchronous. But I discovered that a call can be interrupted by a page reload or a page change (like clicking on a hyperlink). I was under the impression that when an ajax call is started, it is carried out no matter what the browser does afterwards. Is that wrong?
Now to the specific problem I am having: think of an online test where users answer questions (by typing into textboxes). When a textbox loses focus, an ajax call is triggered which persists the value of the textbox to a DB. That works well when changing between textboxes. However, I also have a submit button which triggeres a post action to another page (it is the submit button). When I enter something into a textbox and click on the button afterwards, the call is not carried out. Moreover, when I type into a textbox, click somewhere else (also triggering the call) and swiftly click on the submit button, the call is also not made. Is that expected behaviour?
The reason I am using ajax in the first place is to persist the values so when something unforseeable happens, like a browser crash, the already typed in text is already saved.
Is my way of thinking wrong? How would you go about solving this problem?
Thank you for your time!
AJAX is asynchronous.
When you send an AJAX request the javascript engine sends it off and sets up a handler for the response.
However, if you send an AJAX request to the server and then navigate away from the page before it is received, nothing will happen. Why? Because with each page load the entire Javascript environment is tore down and reinitialized, it has no idea what happened on the last page.
For your problem I would intercept the form submit action and do whatever you need to do with the data, and then submit the form.
Edit: In response to your comment. You are correct. If the ajax request is sent, and you're not depending on it's return value, then it should not matter.
I'd suggest debugging your problem with Firebug to see if the AJAX call is really being sent properly, and to confirm your server is properly processing it.
Unless you do something special with persistent local storage, all javascript and ajax calls are blown away when a new page is loaded over the current page. Also when a submit is done on a form.
To save things intra-page, save the data asap. Eg, perhaps save on key-up, perhaps periodically with a timer, not just on lose-focus.
Re submitting the page: change the on-click behavior to first store, then to go to a new page.
All of the effects that you are seeing are normal.
Also, be sure to test on both slow (ie 6 or 7) and fast browsers (chrome)
I have many forms that use AJAX (w/ jQuery) for validation and data submission. When a form is filled out correctly, I use window.location to redirect the page after I get an acceptable response from the PHP script. On the new page, I use a session variable (set after the AJAX calls) to display the appropriate content. Please tell me if this is standard practice or please give me some suggestions.
Thanks!
Is there a reason you would use a $_SESSION variable to store the post-submission content? Standard practice would be to validate the form via AJAX but submit it in the standard way (i.e. via $_GET or $_POST) after validation. This way you don't need to store anything to a session and you'll likely have less to debug as you'll be submitting the form and displaying its results in the most widely-accepted way.
The benefit of AJAX is typically so that you can submit the form without actually having to do the redirect/refresh. You could get the same functionality by simply having your form POST to the destination URL, redirect to the appropriate place from there or send them back to the form displaying any errors that may have occurred. You could use AJAX to validate the form before the submission to save your users a redirection back to the form to fix their errors, but this is really just a convenience for them. Also, you will have to validate any user data on the server side once it has been submitted, as you can't rely on client-side validation, so you might as well forget the AJAX validation.