I have been trying to clear my registration form after successful registration so that it can return the same form empty without reloading the entire page. please am workiing with ajax and still new to it
jQuery:
$("#formID")[0].reset();
or in javasscript
document.getElementById("formID").reset();
you could reset the values of the form as long as you use it within success() or complete() callback function
Related
I have a controller LessonController with an action save(). My route for this action is POST /save LessonController.save(name: String). The code is very simple for this action.
public static Result save(String name){
Lesson lesson = new Lesson();
lesson.setTitle(name);
lesson.save();
return ok(lesson.getLessonId().toString());
}
Here is my ajax call from the view
myJsRoutes.controllers.LessonController.save(name).ajax({
success : function(id){
alert('Success');
}
});
This code does create a lesson but it refreshes the page and does not execute the success block from ajax request. I guess it is because I am returning a Result type back. I tried changing the return type to String but it gave me a compilation error.
So the question is, How can I call an action in a controller with ajax without the page refresh behaviour?
If you get a page refresh from that then it is for some other reason. Like for example triggering the ajax call with a submit button and not consuming the button event so that it leads to a form submit POST or GET
Please check you AJAX call event, may but you are triggering the AJAX call using submit button or may be you are submitting any form in the web page with the same event.
I'm having a website http://1008designs.in/ There in the home page I have built a Enquiry Form, The form usual validation works fine, but I need Jquery & Ajax validation, the form submits to 'enquiry/add', Pls help me on how to use Jquery Ajax in cakephp 2.0, I gone through a video of Andrew Perkins, but It didn't work for me. If I submit the form, then the whole home page is displayed on that Enquiry Div. I'm trying it from a week, but not working, pls help me as soon as possible.
When you submit form with ajax to controller enquiry/add the html returend by ajax request is a view associated with this enquiry/add. If you want to customize this html you have to modify add action in controller:
At the end of the action try this:
if($this->request->is('ajax'))
{
$this->autoRender = false;
$this->render('/elements/enquiry_success');
}
And in app/view/elements/ add enquiry_success.ctp containing some html/php code which will be returned to #succces div (for example <p>Enquiry added!!!</p>).
This code detects if request is ajax and id it is it doesnt render default view for action but some element.
I am submitting and loading a new form via AJAX and want to use the same script that the first form uses to submit and load the new form to submit a comment. I have this script commented out so you cannot see it but when I use it, the commentForm.php loads and does not use the jQuery submission. I have tried it many ways with no luck.
$('#quoteForm').delegate('input:submit', 'submit',function(e) {
Any help would be appreciated.
If your form is getting replaced then you'll need to delegate the event handler to a parent element. And you'll need to bind to the form and not the submit button:
$('body').delegate('form', 'submit', function(e) {
// and you'll need this to prevent
// the form's 'default' action
e.preventDefault();
I have a form and unobtrusive validations are enabled. By default in submit method client side validation gets triggered and (if you have any errors) the form looks like this:
The validation happens even before any data gets sent to the server.
Now this behavior doesn't work if you want to use $.ajax method. Client side validation doesn't work. You have to manually check all the fields in your javascript, losing all the beauty of DataAnnotations.
Is there any better solution? I could've use jquery's submit() but I guess it doesn't have callback like $.ajax.
Oh...
if (form.valid()) // do submit
You must force the form to validate before checking if it is valid. Something like this:
var form = $( "#myform" );
form.validate();
if (form.valid()) {
// ...
}
I did...
$("#form-submit-button").click(function (e) {
e.preventDefault(); // Stops the form automatically submitting
if ($("#my-form").valid()) {
$("#my-form").submit();
}
});
This also seems to be a good solution if you have say textboxes with a plugin to make those textboxes into a calendar control. Only reason I say this is because I used Zebra Datepicker with an MVC form and it would submit an invalid form if focus was on the calendar date picker. Using the below code stops this.
I was having the same issue Yablargo was having in that it was saying that valid is not a function, so I came up with this:
For the onclick handler of the submit button, I put this:
onclick="return $(this).closest('form').checkValidity();"
I have done various tests and I have found that the jQuery validate function works only with the submit button.
Am I right? If yes how can I use the jQuery validate plugins without the submit button?
You can use the method valid() to invoke the validator directly.
It will return bool indicating whether the form is valid or not.
Here is an example, from jQuery documentation:
$("#myform").validate();
$("a.check").click(function() {
alert("Valid: " + $("#myform").valid());
return false;
});
When you call the validate method on the jQuery validate plugin it returns an instance of Validator which you should store. When you need to, you can call the form or showErrors methods on the Validator instance to either validate the form, or validate the form and show the errors respectively.