kaquadu

kaquadu

JavaScript doesn't recognise changes made by live reload

Hello,
I’m currently struggling with a small issue - I made search page using LiveView. The problem is that client wants me to implement the url change as the parameters of the search are varying. I’ve already managed to make a live view renderer with starting params which are taken from URL - I would say that was the easy part.

Currently I’m updating with every live view update a <span> with a data field containing current url, which will redirect to the search with given parameters. In the live view JS hooks I’m calling a function, which is responsible for getting the current url data field from the given span and then setting it as current url.

updated() {
        Map.initialize();
        
        Search.initFilters();
        Search.handleUrl();

        jcf.replaceAll('.main-search');
      },
handleUrl() {
    if (!$('.js-current-url').length) return;

    let newUrl = $('.js-current-url').data("current-url");
    //logged newUrl here - always the url from the firs updated() call
    history.pushState({}, null, newUrl);
  },

The problem is that the function handleUrl() doesn’t recognise the span’s data field changes and is still setting the old url from the first live view update. I will appreciate any advices. I inspected the data field in dev tools - it is changing after every update. The problem is somewhere else.

Greets,
Kaquadu

Most Liked

LostKobrakai

LostKobrakai

LiveView has built in support for the history API and pushstate: Phoenix.LiveView — phoenix_live_view v0.10.0

Where Next?

Popular in Questions Top

marius95
Hello everyone, I try to use an Javascript Event Handler in my root.html.leex file. Therefore I created a function in the app.js file: ...
New
mcarvalho
What is the difference between System.get_env and Application.get_env? For example, what are best practices to use one versus another.
New
gshaw
What is the idiomatic way of matching for not nil in Elixir? E.g., First way: defp halt_if_not_signed_in(conn, signed_in_account) when...
New
JeremM34
Hello, how can I check the Phoenix version ? Thanks !
New
johnnyicon
Hi all, I’ve just started learning Elixir and Phoenix Framework, so please pardon my n00bness at this stage. I’m trying to use Postgres...
New
earth10
Hi, I’m just starting to build a side-project with Elixir and Phoenix and doing some basic test with Elixir alone. What strikes me is th...
New
stefanchrobot
What’s the safe way to decode a JSON string into a struct? I want to avoid calling String.to_atom. Jason.decode can give me a map with st...
New
lucidguppy
I have a super simple question about elixir - how would I take a file like this foo bar baz and output a new file that enumerates th...
New
script
If I have a string “1000 cfu/ml” . I want to remove the characters and / and space . So the string is like this "1000" What is the ...
New
chensan
I have a User schema with a :from_id field set to type :string: defmodule TweetBot.Repo.Migrations.CreateUsers do use Ecto.Migration ...
New

Other popular topics Top

Darmani72
If I have a post route which an argument: post /my_post_route/:my_param1, MyController.my_post_handler How would get the post params ...
New
greenz1
I have a phoenix application from which a user can download multiple(5-6) files of size 1MB. I couldn’t find anything related to sending ...
New
JakeBecker
TL;DR: I’ve just released an implementation of Microsoft’s IDE-independent Language Server Protocol for Elixir. It adds language support ...
1144 53690 245
New
JorisKok
I have a server on AWS, and was running a load test using artillery. When looking at the Phoenix dashboard I see the Ports going to 100% ...
New
grych
Hi folks, Few months ago I have announced the proof-of-concept of the library to manipulate the browsers DOM objects directly from Elixi...
639 52341 488
New
RisingFromAshes
I’ve read in another post that it may be possible with a router helper - but I couldn’t find an appropriate one, and tbh, I’m still just ...
New
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
dblack
I’ve got an issue with an app and I’ve no idea of how to troubleshoot it. I’m hoping someone here might have seen something similar. I p...
New
rms.mrcs
Hi, I need to transform a list of numbers into a map where the keys are the indexes and the values are the original values of the list. ...
New
AstonJ
We’ve put together this wiki for Phoenix LiveView - please feel free to add any info you feel is worth including. What is Phoenix LiveV...
New

We're in Beta

About us Mission Statement