Sending data to other page onclick event list view F7 [V.2]


I want to sending data to other page template when I click list view, any suggestions?

Use localstorage to pass the values from one page to another.

To set value in First page:'name', 'test');

To get value in Second page:'name')


You can use GET params to send values an other page, look this

For value capture from element, use this.

<div class="fireEvent" data-name="Mi name" data-id="1"></div>

Now create event

$$(document).on("click", ".fireEvent", function(){
        var name  = $$(this).attr("data-name");
        var id = $$(this).attr("data-id");
        app.router.navigate("URL?name=" + name + "&id=" + id);


Ok, so look this post.


Tell me if your question is solved

Hm, what about using global context to keep and retrieve data between pages, views, etc

Hi @rajkaruna,

can you give me one sample onclick event using localstorage

Hi @Yudistira

Please try this

<button @click="formSubmit('rajkaruna')">Submit</button>


      return {
    		methods: {
    		  formSubmit: function (name) {
    			/*name variable contains rajkaruna*/'UserName', name);

Then you can get this name any page or view using below script'UserName');

Thats it :sunglasses:

1 Like

Hi @rajkaruna,

I try your method and put the function on success event, like code below, but the result from console log is undefined

methods: {
      GetListVenue: function (id) {
        var app = this.$app;'id', id);

        console.log('id', id));

output from ajax success

$.each(data, function (index, value) {
            output += '<li>'+
              '<a href="new-vendor-venue-detail/" class="item-link item-content" @click="GetListVenue('+value.VenueId+')">'+ 
                '<div class="item-inner">'+
                    '<div class="item-title-row">'+
                      '<div class="item-title">'+value.VenueActivity+'</div>'+
                      '<div class="item-after" id="'+value.VenueId+'"></div>'+
                  '<div class="item-subtitle">'+value.VenueName+'</div>'+
                  '<div class="item-text">'+value.VenueDescription+'</div>'+

Hi @Yudistira

You should use console.log('id')) to retrieve value

1 Like

hi @rajkaruna,

It works great, thank you :+1::+1::+1:, but I’m changing to normal click event

$$('#ListVenue').on('click','li', function(e){
    var id = $$(this).attr('value');'id', id);

if using your methods it’s always give the same value, anyway your methods is what I need :grin::grin::grin:

thank’s again

This solution does not work in F7 v 3.3.0, it throws an error.

Uncaught TypeError: Cannot read property 'setItem' of undefined