Create a link with data and go through post

Question

I do not know if it is possible, but I would like to create a link (or simulate one) where I need to pass data to the page of this link, but I would not like to pass this data by get rather than by post, not to keep displaying the data (I know that for an advanced user it will be possible to view this data, but there would be no problem).

Below the link I’m creating:

<a href="pagina_a_ser_chamada" data-usuario="1" data-cliente="3" class="openLink">
    Abrir dados do cliente 3
</a>

<a href="pagina_a_ser_chamada" data-usuario="1" data-cliente="4" class="openLink">
    Abrir dados do cliente 4
</a>

<a href="pagina_a_ser_chamada" data-usuario="1" data-cliente="5" class="openLink">
    Abrir dados do cliente 5
</a>

I tried to do something with jQuery, but I could not pass the data usuario and cliente and nay I want to spend like this pagina_a_ser_chamada?usuario=1&cliente=3

$(document).ready(function() {
    $('.openLink').click(function(event) {
        event.preventDefault();
        window.open($(this).attr('href'), '_blank');
    });
});

Answer 1

This question is very interesting, I recommend making the solution using a form, which can be hidden from the user.

I can’t think of a way to open a new tab using a POST without using a form.

Edit: The use of the attribute target="_blank" makes it possible to open the page in a new window/tab, but misunderstood that it was mandatory, but it is not.

Form for use:

<form action="#" method="post" style="display:none" id="transport">
    <input type="hidden" name="usuario" />
    <input type="hidden" name="cliente" />
</form>

In the form I put two inputs based on the custom attributes of the link, but if you want you can create the inputs as needed, either in HTML or via Javascript.

Link to be clicked:

<a href="pagina_a_ser_chamada" data-usuario="1" data-cliente="3" class="openLink">
    Clique aqui
</a>

Javascript:

function extractData(link) {
    var obj = {},
        attributes = link.attributes,
        count = attributes.length;

    for(var i = 0; i < count; ++i) {
        var prefixLocation = attributes[i].name.search('data-');

        if(prefixLocation != -1) {
            obj[attributes[i].name.substr(prefixLocation + 5)] = attributes[i].value;
        }
    }

    return obj;
}

$(document).ready(function() {
    $('.openLink').click(function(event) {
        event.preventDefault();

        $form = $('#transport');

        // Extrai os dados dos atributos customizados do link tirando o prefixo "data-"
        var data = extractData(this); 

        // Preenche os dados no form
        for(var attr in data) {
            $form.find('input[name="' + attr + '"]').val(data[attr]);
        }

        // Atualiza o action do form com o href do link
        $form.attr('action', this.href);

        // Submete o form
        $form.submit();
    });
});

The example can be seen in this Jsfiddle, however it does not work in this environment because of the security rules and cross-Omain, it is just a place to see the form fill in HTML.

To see the result recommend testing in a more real environment.

Answer 2

It is only possible to send POST through Forms, server-side or xD gambiarra

<form action="pagina_a_ser_chamada" method="post">
    <input type="hidden"  name="usuario" value="1" />
    <input type="hidden"  name="cliente" value="3" />
    <input type="submit" class="openLink" value="Clique aqui" />
</form>

If you are using PHP try session variables

$_SESSION['usuario'] = 1;
$_SESSION['cliente'] = 3;

These variables can be seen in any part of your code, and the user of your site will not candles...

=)

You can use url segments

$_SERVER['REQUEST_URI_PATH'] = parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH);
$segments = explode('/', $_SERVER['REQUEST_URI_PATH']);         

The variable $segments contains for example localhost/site/page

array 
  0 => string 'localhost' 
  1 => string 'site' 
  2 => string 'pagina'

with this method the links would be as follows

<a href="pagina_a_ser_chamada/1/4" class="openLink">
    Abrir dados do cliente 4
</a>