How to hide URL ID?

Question

17/11/2016

I have an application that is mounting the following URL

www.meusite.com.br/controller/action/id

However, I need the ID not displayed in the URL, but let it live on back-end, because it’s a request screen, and I wouldn’t want to leave the id of the request displayed in the URL.

Each order is tied to a store, and I have a validation so that only the store logins xpto access the store’s orders xpto, and not ordered from other shops.

I just need to disappear with the URL ID and leave it alive in the system, but it’s a bit complicated to find a solution. I’ve read several articles, but nothing clarifying.

Anyone who can help, I really appreciate.

18/11/2016

Marllon Nasser, I followed your idea and did it this way:

@this.Hidden("IdPedido").Value(item.Id)

<a class="btn btn-primary btn-xs btn-visualizar" target="_blank" data-toggle="tooltip" title="Visualizar">
<i class="fa fa-eye">< /i>
</a>

$(function() {
  $(".btn-visualizar").click(function() {
    var pedido = $("#IdPedido").val();
    $.post("@(Url.Action(MVC.Painel.Pedidos.Visualizar()))", {
      id: pedido
    })
  });
});

It goes to the controller by passing the request id, only on my controller I need to open another view called "requests".

[HttpPost]
public virtual ActionResult Visualizar(int id)
{
    var user = TUser.FindByUserName(this.User.Identity.Name);
    var pedido = TOrder.Load(id);
    var xpto = pedido.Franchise.Name;
    if (user.Franchise == null || user.Franchise.Id == pedido.Franchise.Id)
    {
        //return View(pedido);
        return RedirectToAction("Visualizar", pedido);
    }
    else
    {
        TempData["Error"] = "Pedido não pertence a esta loja";
        return RedirectToAction("Index");
    }
}

Just don’t open it. How can I please make any suggestions?

Answer 1

I made a comment but I decided to put as a response. Just use the protocol POST instead of GET.

Speaking for MVC itself, you cannot make the direct modification on your ActionLink. The ActionLink in itself only makes the rendering of hyperlink.

But if you are using MVC 3+, you can make use of Ajax.ActionLink(), that would look something like:

@Ajax.ActionLink("Clique Aqui", "Action", "Controller", new { id = SeuId }, new AjaxOptions {HttpMethod = "POST"})

Remembering that for this to work, you need to include a jquery library called jquery.unobtrusive-ajax.min.js. The advantage in itself of this approach is that you can inform which protocol you want.

Or if you prefer, you can make use with jQuery:

<a id="teste_post" href="javascript:void(0);">Clique Aqui</a>

$("#teste_post").click(function() {
    $.ajax({
        type: "POST",
        url: '@Url.Action("Action", "Controller")',
        data: { id: SeuId },
        success: function (d) {
            //TODO
        },
        error: function (xhr, textStatus, errorThrown) {
            //TODO
        }
    });
});

And of course, for any of the options presented, your action must be recorded as [HttpPost]:

[HttpPost]
public ActionResult Action(int id)
{
   //TODO
}

EDIT

Following its implementation, I suggest you return a Partialview in the method Visualizar.

Your ajax implementation also needs treatment, getting more or less like this:

$(".btn-visualizar").click(function() {
  var pedido = $("#IdPedido").val();
  $.post("@(Url.Action(MVC.Painel.Pedidos.Visualizar()))", {
    id: pedido
  }).done(function(data) {
    // aqui é o retorno da controller
    var error = '@TempData["Error"]';
    if (error == null || error == "") {
      //sucesso
      $("#aDivOndeVoceVaiExibir").html(data);
    } else {
      //erro
      alert(error);
      location.href = '@Url.Action("Index", "SuaController")';
    }
  });
});

And its controller sort of like this:

[HttpPost]
public virtual ActionResult Visualizar(int id)
{
    var user = TUser.FindByUserName(this.User.Identity.Name);
    var pedido = TOrder.Load(id);
    var xpto = pedido.Franchise.Name;
    if (user.Franchise == null || user.Franchise.Id == pedido.Franchise.Id)
    {
        return PartialView("_Visualizar", pedido);
    }
    TempData["Error"] = "Pedido não pertence a esta loja";
    return null;
}

See also:

• What are the advantages of using the right HTTP methods?
• What is Partial View?

Answer 2

The best way to perform the procedure would be by POST. You can leave the id inside the form in a Hidden type input.

Answer 3

The problem is that you are making this request using a "get" method instead of "post"

Here a good explanation!