Update contents of a. load()

Asked

Viewed 127 times

0

I wonder if it is possible to update the contents of a load. Example:

I have a form on the page "html submit."

<form action="submeter" method="post">
<input type="text" name="nome" value="" />
<input type="submit" value="Enviar" />
</form>

I load this form in another page...

<div id="conteudoFixo">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vel neque eu magna vestibulum tincidunt. Duis a lobortis felis, id pulvinar nulla. Pellentesque fermentum sollicitudin nisl, at molestie felis pretium vel. Donec tellus mauris, imperdiet sed sagittis in, consectetur quis ex.
</div>
<div id="conteudoMuda">
<button id="botaoForm">Mostrar Form</button>
</div>

And I use the jquery to load:

jQuery('#botaoForm').click(function(){ 
    jQuery('#conteudoMuda').load('/enviar_formulário.html');
});

The problem is, when I give Submit the form, it redirects me (action="submit"). I would like to send the data without being redirected.

Note: I cannot use ajax to submit the form.

Ajax code:

/* submeter form trocar nick */
jQuery('form[name="post"]').submit( function(){
    event.preventDefault();
    jQuery.ajax({
     dataType:'html',
        type     : 'POST',
        data     : ({username_edit: jQuery("#username_edit").val(), user_rank : jQuery("#rankusren").val(), signature : jQuery("#assinaturaa").val(), profile_field_10_5 : jQuery("#profile_field_10_5").val(), user_status : jQuery("#user_status_yes").val(), user_allowpm : jQuery("#user_allowpm_yes").val(), user_allowavatar : jQuery("#user_allowavatar_yes").val(), mode : jQuery("[name='mode']").val(), agreed : jQuery("[name='agreed']").val(), id : jQuery("#idusrpnl").val()}),
        success  : function( resultado ){
            alert('Nome trocado!');
        }
    });
});
/* fim do form trocar nick */

Video showing that the form is not submestic with ajax. But with ajax, it is normally submitted

https://www.youtube.com/watch?v=JESNg-w2HUw&feature=youtu.be

jquery html

  • Give me a valid reason not to use ajax.

  • I am working on a forum platform, and ajax with POST does not work, just GET

  • I even tried to do it, but it submits the forum without sending the values, and returns the Success. Even using error or fail(), I keep getting Success

  • You can do it with GET and send the data as query string as well.

  • Could you give an example? I will add the code I tried in the question

  • Do you want to make an asynchronous POST request without being asynchronous? I don’t get it.

  • Actually, I asked the question because I couldn’t do it with ajax. So I thought of ways to do the system without. I thought about using iframe, but I don’t think it’s a good solution.

  • Why does it say that this POST is not asynchronous @Andersoncarloswoss?

  • @Lucascostat the standard form submission is a synchronous request, as the browser is redirected to the page and should wait for the server response.

  • The Submit is synchronous, the post with Ajax is asynchronous @Andersoncarloswoss, which was his example. You can use this way to serialize the form for example.

  • That’s what I’m saying: he said he can’t use AJAX but wants the request to be asynchronous.

Show 6 more comments

1 answer

2

In the GET and POST security category, the difference is that GET exposes the data in the URL and POST, among some other peculiarities of semantics and structure.

You could pass the information via GET and recover (the way it will recover the data may depend on who will be on the other side) using query string:

jQuery('form[name="post"]').submit( function(){
    event.preventDefault();
    jQuery.ajax({
     dataType:'html',
        type     : 'GET',
        url: 'minharl.com' + $.param($(this).serializeArray()),
        success  : function( resultado ){
            alert('Nome trocado!');
        }
    });
});

$.stop represents an object to use in query string or ajax requests. The result will be something like:

minharl.com?a%5Bone%5D=1&a%5Btwo%5D=2&

Other sources

What are the HTTP request methods, and what is the difference between them?

When to use GET function and when to use POST function?

  • Remembering that the server needs to be able to properly respond to a GET request such as the POST request.

  • I didn’t understand what I meant @Andersoncarloswoss

  • Thanks for the reply. But the platform used does not allow me to make this request.

  • The file on the server side may only be waiting for a POST request and not properly handle a GET. It has not been commented on the server side, but in PHP, for example, if there is if($_SERVER["REQUEST_METHOD"] == "POST"), GET request will be ignored.

  • I am working on a forum platform, and ajax with POST does not work, just GET, I gave the alternative with GET due to your comment @VME

  • @Ansersoncarloswoss, that answers to what scored?

  • I am not allowed to send/take parameters by url. I also don’t understand how I’m going to do this. I don’t know why I can send data through the form normally but I can’t send through ajax

  • Ajax may be blocked by CORS @VME.

  • When using ajax it shows CORS error on the console? Because I get no error. And everything happens within the same site.

  • Show yes @VME. If it is not CORS, you will need to learn the settings of the forum that will receive the data. If you don’t have any autonomy about it and/or don’t detail better for us what this source looks like, there won’t be any miracles to be done to communicate with the server.

  • Thank you for the information. I will try my best here

  • nothing @VME, when you have news update the question =]

Show 7 more comments

Browser other questions tagged jquery html

You are not signed in. Login or sign up in order to post.