redpill
redpill

Reputation: 87

how to pass javascript variable into liquid markup?

I have a value from JavaScript:

  var customerID = document.getElementById("CustomerID").value;

Now I want query the firstName, lastName from module data, based on that customerID variable.

    {module_data resource="customers" version="v3" fields="id,firstName,lastName,titleType,customerTypeId,ratingTypeId" skip="0" limit="10" order="lastName" collection="selected-data"}  
    {% for item in selected-data.items %}
    {% if item.id == 10393092%}
     document.getElementById("CAT_Custom_15").setAttribute("value","{{item.titleType.label}}") ;
     document.getElementById("CAT_Custom_14").setAttribute("value","{{item.firstName}}");                        
     document.getElementById("CAT_Custom_4").setAttribute("value","{{item.lastName}}");
    {% endif %}
    {% endfor %}

How should I write the where condition? Whne I assign instant value that 10393092 in my code above. It is working fine. but I need assign the variable equal to item.id(like item.id == customerID). Anyone can help? Thank you so much

Upvotes: 2

Views: 3853

Answers (2)

Gaurav Aggarwal
Gaurav Aggarwal

Reputation: 49

Unfortunately you cannot do that. Reason is liquid is processed at server side and you will be fetching the content from the browser DOM using

var customerID = document.getElementById("CustomerID").value;

When the page loads, the content from server (for module_data) have already processed and after that the DOM elements will load resulting in no data passed to liquid if else condition. At the moment there is no way to send javascript data to the server for module_data.

Upvotes: 0

Shadowen
Shadowen

Reputation: 836

What you are asking for is not possible. Liquid generates a static page, which is then stored on your web server. When a user navigates to your site, the pre-generated page is sent to them. Then the JavaScript in it may execute. At this point, it is impossible to do anything in Liquid. You should be looking for a pure JavaScript solution.

Upvotes: 1

Related Questions