send a JSON via POST with JavaScript

Question

send a JSON via POST with JavaScript

Navigation

#1 by (3 votes)
#2 by (0 votes)

1

Let's see ... according to the comments I would have to edit the thread, but no matter how much I do it ...

I have to send a json per post, and when sending it I would have to receive one in which I would say if the login is correct or incorrect.

Here the login form:

<form name="login" action="">
    <input type="text" id="email" placeholder="User">
    <input type="password" id="pass" placeholder="Password">
    <button type="submit" id="send" onclick="sendForm()">Enter</button>
    <div class="moreoptions">
        <div class="ico">
            <span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
            <a href="#">I forgot my password</a>
        </div>
        <div class="ico">
            <span class="glyphicon glyphicon-save" aria-hidden="true"></span>
            <a href="#">Register</a>
        </div>
    </div>
</form>

And this is the javascript function that calls when you hit the button #send

function sendForm(){
    var fpU = ROT47(document.forms[0].elements[0].value);
    var fpP = ROT47(document.forms[0].elements[1].value);


var objJSON = {
    pfd: "login",
    fpU: fpU,
    fpP: fpP,
    browserInfo: {
        appCodeName: navigator.appCodeName,
        appName: navigator.appName,
        appVersion: navigator.appVersion,
        cookieEnabled: navigator.cookieEnabled,
        language: navigator.language,
        platform: navigator.platform,
        userAgent: navigator.userAgent
    },
    datasite: {
            "@accountID": "2",
            "@siteID": "3"
    }
};

$('#send').click(function(){
    var data = objJSON;
    $.ajax({
        url : 'https://www.evstest.com/G3v1LastVersion/portal/portal_action.php',
        data : data,
        method : 'post', //en este caso
        dataType : 'json',
        success : function(response){
            alert("funciona bien");
        },
        error: function(error){
            alert("No funciona");
        }
    });
});
}

I have tried to make an alert to see the JSON if it is well built and yes. then the code that supposedly sends it, seems to do nothing, because they do not execute the alert code lines, where it says it has been sent or not.

I hope that this helps you to try to help me. Greetings and thanks again

javascript json post

asked by Rodrypaladin 04.11.2016 в 12:50

source

2 answers

Understanding the queues or tasks someone knows why the json does not print

score 3 · Answer 1

You must give all your html elements a id

<input type="email" id="email" name="user" placeholder="E-mail">
    <input type="password" name="pass" id="pass" placeholder="Password">

To the button of your form also give a id

 <div class="ico" id="registrar"
            <span class="glyphicon glyphicon-save" aria-hidden="true"></span>
            <a href="#">Register</a>
        </div>

In your JS code you must capture the click event of your button

jQuery

$('#registrar').click(function(){
        var data = { email : $('#email').val(), password : $('#pass').val() };
        $.ajax({
                url : 'tu_url'
                data : data, 
                method : 'post', //en este caso
                dataType : 'json',
                success : function(response){
                       //codigo de exito
                },
                error: function(error){
                       //codigo error
                }
        });
});

Javascript

var http = new XMLHttpRequest();
var url = "tu_url";
var email = document.getElementById('email');
var password = document.getElementById('pass');
http.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
http.open("POST", url, true);

http.onreadystatechange = function() {
    if(http.readyState == 4 && http.status == 200) { 
       //aqui obtienes la respuesta de tu peticion
       alert(http.responseText);
    }
}
http.send(JSON.stringify({email:email, password: password}));

score 0 · Answer 2

If you want to send it naturally, you could do this:

Add a hidden field before the submit button: <input type="hidden" name="json">
Modify your delivery function a bit:

function sendForm(e) {
    e.preventDefault();
    var sendJSON = "{...
    sendJSON = JSON.stringify(sendJSON);

    document.getElementsByTagName('json').value = sendJSON;
    document.form[0].submit();
}

Look carefully at passing the JSON to string beforehand and that it is well formed so that no error occurs.