Passing Variables From Function to Function

[Adamhumbug]

Hi All,

I have been reading about scope and how variables are scoped to functions etc...

I have the following script that creates a context menu and i am trying to set "linkText" to = linkText set in the click function.

$('.custom-lc').click(function() {
  $link = $(this).data('link')
  linkText = $(this).data('link')
})

var contextMenu = $('.custom-lc').contextMenu();
contextMenu.button = mouseButton.LEFT;

contextMenu.menu().addItem("linkTextVarToGoHere", function() {
  contextMenu.onclick = function() {
    window.location.href = $link
  }
});
contextMenu.init();

The issue that i have is that if i put all of the rest of the code inside the click function, it generates another contect menu for each click rather than modifying the first one.

The code that i have posted here works just fine apart from i am not able to set the text value in the addItem function.

Any pointers on the best way to pass a variable into this function would be appreciated as i have managed to pass the $link into the window.location.href and that works.

This is the context menu that i am using for reference - https://www.jqueryscript.net/menu/context-menu-material.html

Edited August 30, 2023 by Adamhumbug

[requinix]

You've skipped past one very particular problem: you want an existing menu item's text to reflect something that can change. Using a variable for the addItem's label doesn't mean that you can change the variable's value later and the label will update. You would have to add and remove these items every time the custom-lc is clicked.

So the truth is actually that no, the code you've posted doesn't work. Not that you're using it wrong but that it can't do what you want. And I don't see anything in the library you're using that lets you edit menu labels.

I'm not sure how you came across that library, but when I search for "jQuery context menu" the very first result is this one, which looks like a much better option given that it's been updated during this year and, you know, it has actual documentation.

[Adamhumbug]

44 minutes ago, requinix said:

You've skipped past one very particular problem: you want an existing menu item's text to reflect something that can change. Using a variable for the addItem's label doesn't mean that you can change the variable's value later and the label will update. You would have to add and remove these items every time the custom-lc is clicked.

So the truth is actually that no, the code you've posted doesn't work. Not that you're using it wrong but that it can't do what you want. And I don't see anything in the library you're using that lets you edit menu labels.

I'm not sure how you came across that library, but when I search for "jQuery context menu" the very first result is this one, which looks like a much better option given that it's been updated during this year and, you know, it has actual documentation.

It is updating the link buttons value which led me to think that i would be able to get somewhere with it.  Think you might be right though - this does look like a better option.

Thanks Again

[Adamhumbug]

It might be me - it is likely me - but i cannot see anything about how to dynamically populate the items in the list.

I think it is my lack of understanding of their terminology.  Ill keep looking but if anyone has used this or similar before and has any pointers that would be really handy.

[kicken]

7 hours ago, Adamhumbug said:

It might be me - it is likely me - but i cannot see anything about how to dynamically populate the items in the list.

If you're talk about the new one linked by Requinix, you'd use the build configuration option.  You provide a function, the script calls that function when it's time to display the menu.  You can dynamically build your items in the function and return them in the items configuration option.

 

[Adamhumbug]

2 hours ago, kicken said:

If you're talk about the new one linked by Requinix, you'd use the build configuration option.  You provide a function, the script calls that function when it's time to display the menu.  You can dynamically build your items in the function and return them in the items configuration option.

 

Ok. Thanks for that. I’ll give it a go. 

[Adamhumbug]

I am really having a hard time with this and im sorry to ask - i know the idea here is not to get other to write your code.

@kicken - i dont suppose you have an example or would have the time to fomulate one - understand if not.

Appreciate you all anyway!

[Adamhumbug]

I got this far:

$(function() {
  $.contextMenu({
    selector: '.context-menu-one',
    build: function($triggerElement, e){
      return {
        callback: function(){},
        items: {
          menuItem: {name: "My on demand menu item"}
        }
      };
    }
  });
});

The above works

$(function() {
  $.contextMenu({
    selector: '.context-menu-one',
    build: function($triggerElement, e){
      return {
        callback: function(){
          $el = "SOMETHING"
        },
        items: {
          menuItem: {name: $el}
        }
      };
    }
  });
});

The above doesnt.

I am assuming that i am making the function wrong.

Edited September 1, 2023 by Adamhumbug

[Adamhumbug]

Hold the phone i think i got it.

$(function() {
  $.contextMenu({
    selector: '.context-menu-one',
    build: function($triggerElement, e){
      $el = $triggerElement.data('stuff')
      return {
        callback: function(){

        },
        items: {
          menuItem: {name: $el}
        }
      };
    }
  });
});

Thanks you all so much for your feedback here and puttiung up with my rambling.

Edited September 1, 2023 by Adamhumbug