difference between Html.BeginForm() and ajax.beginform() - asp.net-mvc

what is the difference between Html.BeginForm() and Ajax.Beginform() in MVC3. I just want to know the scenarios where I can use Html.BeginForm() and where I can use Ajax.Beginform().

Ajax
Won't redirect the form even you do a RedirectAction().
Will perform save , update and any modification operations asynchronously.
Validate the Form using FormMethods - OnSubmit. So you are abort the Post
This creates a form that submits its values using an asynchronous ajax request. This allows a portion of the page to be update without requiring that the entire page be refreshed.
Html
Will redirect the form.
Will perform operations both Synchronously and Asynchronously (With some extra code and care).
Html.BeginForm will always use RouteTable to detrmine the action attribute value.
This will create a form on the page that submits its values to the server as a synchronous HTTP request, refreshing the entire page in the process.

Html.BeginForm() will create a form on the page that submits its values to the server as a synchronous HTTP request, refreshing the entire page in the process.
Ajax.BeginForm() creates a form that submits its values using an asynchronous ajax request. This allows a portion of the page to be update without requiring that the entire page be refreshed.

Html.BeginForm() will use simple posting on page, it means your page will be refreshed when you post your form.
when Ajax.BeginForm() will use ajax posting on page, it means your page will not be refreshed when you post your form.

#Html.BeginForm is used to post the data by full page refresh whereas #Ajax.BeginForm performs Post back function and allows some portion of Html to be reloaded rather than overall page refresh.

Related

Cannot submit form drawn by Rails Turbo Frame response

A form inside a turbo_frame is blocked from being submitted a second time.
Both the current page and the form action are the same path.
I see forms now have to redirect to a new location or return an error code: turbo/pull/39.
I have a form on every index view sending a GET request to the index action, which filters the records based on the url query parameters. This works great. Is this no longer possible with latest Rails? Is there a workaround that could be applied here, to avoid creating a new route for the form action?
These are idempotent filter/search requests, hence the GET method. A form is a handy way to collect and send the filter values. Is it correct/intentional that Rails with Hotwire insists on a redirect in this scenario?
Update:
It works if I submit the form as xhr instead of using Turbo. I add local: false and data-turbo: false to the form. Then add index.js.erb with document.getElementByID(<id of turbo frame>) and set its outerHTML to the rendered partial. Not sure if this will stop working due to deprecated ujs features (maybe mrujs can step in then).

ExternalContext.dispatch() not working

On p:ajax call,listener invokes method which contains
FacesContext.getCurrentInstance().getExternalContext().dispatch("/uri.jsf");
doesn't work. Ive set a break point on the line and it remains at the same point on execution.It doesn't move forward, I ve got to restart server to run the application again.
FacesContext.getCurrentInstance().getExternalContext().redirect("/uri.jsf");
redirection works perfectly fine. But i want page forward which is dispatch to navigate to another page.
The ExternalContext#dispatch() does not support ajax requests. It causes JSF to render the HTML output of the given resource which can't be understood by the JavaScript ajax engine. The ajax request has to return a special XML response which can be understood by the JavaScript ajax engine.
The ExternalContext#redirect() supports ajax requests. It will automatically return a special XML response instructing the JavaScript ajax engine to invoke a window.location call on the given URL (you can find an XML example in this answer).
You have 2 options:
Make it a non-ajax request.
Perform a normal JSF navigation.
Making a non-ajax request is most likely not an option for <p:ajax>. In that case, performing a normal navigation is really your only option.
FacesContext context = FacesContext.getCurrentInstance();
context.getApplication().getNavigationHandler().handleNavigation(context, null, "/uri.jsf");
It will in case of ajax requests automatically force an render="#all" with the new content.

Render nothing !

I have a partial that show a form into a page.
As I submit the form, I just want that the controller do its operation and come back to the page without render anything. I just want to show the flash message of success or error and nothing more. But the controller by default try to render a new page. How can I do to avoid this behavior ?
To do what you want, only using asynchronous HTTP request with JavaScript (AJAX).
So you post the values of the form's fields and update the flash area with the result.
You can use jQuery to help in ajax requests:
<Edited>
If you do not have a flash area in your page you can create it putting a div element at the top or your page (or any other place you want).
Then in the button's onclick event you put this:
<input type=button onclick="$.post('/controller/action/update', $('#testform').serialize(), function success(data, textStatus, jqXHR){$.('#flash').html(data)})">
This function sends the form's data to the server and when return the callback function is called (success). Then you need only to update the flash content with the returned data.

rails ajax redirect

Here is my use case
I have a search model with two actions search_set and search_show.
1 - A user loads the home page which contains a search_form, rendered
via a partial (search_form).
2 - User does a search, and the request goes to search_set, the search
is saved and a redirect happens to search_show page which again
renders the search_form with the saved search preferences. This search
form is different than the one if step1, because it's a remote form
being submitted to the same action (search set)
3 - Now the user does another search, and the search form is submitted
via ajax to the search_set action. The search is saved and executed
and now I need to present the result via rjs templates (corresponding
to search_show). I am told that if the request is xhr then I can't
redirect to the search_show action? Is that right? If yes, how do I
handle this?
Here is my controller class
http://pastie.org/993460
Thanks
That's right. Either make the request non-XHR and redirect as normal, or you could try rendering the URL you want to redirect to as text or part of a JSON object which your AJAX request then uses to call document.location.href = [whatever] (but this seems hacky).
Right now what's happening is your XHR request is returning the result of the redirect, and not actually redirecting the page that made the XHR request.

Multiple AntiForgeryTokens on a View with a MasterPage

Has anyone had to deal with multiple AntiForgeryTokens on a child view of a master page? The scenario I am thinking about is as follows:
The view contains a Form with an AntiForgeryToken rendered as a hidden field.
The view is contained by a master page that has another AJAX submitted form.
The issue here is that I need to encapsulate the hidden field in the Form and at the same time, I need to render another token for submission on the AJAX submitted form in the master page. I can't make any assumptions that a token will be rendered in the child page since the child page may not have a form on it.
My first thought would be to render a single global AntiForgeryToken for the entire page that all posts used, but then the forms would not post the token as the hidden input field would be located outside of the form.
Thanks for any advice!
It should be possible to render an Html.AntiForgeryToken() separately within each form. The runtime is designed with this scenario in mind. The first call to AntiForgeryToken() sets a flag saying "I've set the token, any other calls to me for this request should use the same token value."

Resources