8

Estou desenvolvendo uma aplicação onde um formulário com uma série de <select> enviam informações para um gráfico carregado via AJAX.

Gostaria que esses filtros refletissem na url do navegador, para facilitar ao usuário favoritar o filtro mais usado.

<script type="text/javascript">

    // MyChart("tipo do gráfico", "nome interno grafico", "widht", "heigth", "transparência")   
    var chart = new MyChart("Charts/tipo_do_grafico.swf", "MyChart", "100%", "700", "0");

    var refreshChart = function(){
        var urlParam = $("#filterForm").serialize();
        location.href = "#?" + urlParam;                    
        chart.setDataURL("rota/aplicacao/condicao1/condicao2?" + urlParam);
    };

    refreshChart();
    chart.render("divChart");

    $('#filterForm').change(refreshChart);

</script>

Com esse código consegui passar os valores que são enviadas via query string (GET) do formulário na url, passando um # para não atualizar a página (retirado dessa resposta).

location.href = "#?" + urlParam; 

Porém como utilizo um sistema de rotas na minha aplicação, (rota/condicao1/condicao2) algumas condições ficam na URL e alterando elas no location.href minha página é atualizada.


Existe alguma forma de alterar somente a URL da barra de endereços via javascript, sem atualizar a página?

Se possível algo que funcione no Internet Explorer.

1 Resposta 1

10

Com HTML5 pode-se usar

window.history.pushState("object or string", "Title", "/new-url");

Leia esse artigo para mais detalhes: HTML5: Changing the browser-URL without refreshing page

4
  • Sabe se o IE suporta esse recurso ?
    – gmsantos
    Commented 11/09/2014 às 14:12
  • De acordo com o CanIUse a partir do 10 é suportado.
    – Franchesco
    Commented 11/09/2014 às 14:25
  • E sem HTML5, apenas com JQuery é possível? Commented 9/06/2015 às 12:13
  • 1
    @JedaiasRodrigues Aí seria mais interessante usar o plugin history.js
    – Franchesco
    Commented 9/06/2015 às 14:20

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .