Dropdown with shortcode as option

Hello Guys. How can I link different global block for each option of a dropdown select?

I am looking for to create a dropdown menu based on blobal block instead page menu.

The idea is:
#1. Create a dropdown menu with options: 1, 2, 3, 4 and 5
#2. Each option will call a different shortcode (global block)

Please advise,

Best,

Robert B.

Hey There,

Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your email. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks.

Hello Thai. You can see what I am try to do here: www.southlandservices.net/sand-box/

Pretty much its the same idea as BOOK NOW as the last option of the top menu.

The menu in the SECTION had 5 option, when you choose option 1: Sheetrock - a especific off canvas will be call

I have the following jQuery Call:
$( document).on(‘click’, ‘#menu-item-1148 > a’, function(e) {
e.preventDefault();
$(’#bookSheetrock-anchor-toggle’).click();
});

It’s the same as I have in the top menu - the only difference is the menu-item and the ID

Please advise

Best,

Robert B.

Hi Robert,

That code is just a click function, a proxy for the toggle and it’s not related to an ajax. This is only possible with custom development and I recommend contacting a developer. But I’ll provide the idea,

  1. Create an ajax call within that click function and integrate it with admin ajax. Like from here
  1. Execute your global block shortcode by calling do_shortcode() and return the result (through ajax)

As you can see, it’s a complex one to create an entire process.

Thanks!

Hey Sir. Thanks for your explanation. Would you PLEASE clarify why it’s working just fine with the same function when you press the BOOK NOW in the tops menu?

What you just said just don’t make sense considering I haven’t done anything you suggested but just using the given script - This script was given to me a long time ago from another X Team Support.

Let me clarify again what we are trying to archive!

For each option from the menu (Select your Service) I am looking for to call a different (Global Block with a different ID). It’s the same idea as in the top menu but different option!

I thought if I just add another function anchor in another ID would be enough like:

jQuery(function($){
$( document).on(‘click’, ‘#menu-item-119 > a’, function(e) {
e.preventDefault();
$(’#bookNOW-anchor-toggle’).click();
});

$( document).on(‘click’, ‘#menu-item-1148 > a’, function(e) {
e.preventDefault();
$(’#bookSheetrock-anchor-toggle’).click();
});
});

URL: www.southlandservices.net/sand-box/

#One more thing is calling my attention#
I have two Global Block #1 ID="bookNOW #2 ID=“bookSheetrock”

The weird part is - just by switch ID’s the bookNOW stop working like below!
jQuery(function($){
$( document).on(‘click’, ‘#menu-item-119 > a’, function(e) {
e.preventDefault();
$(’#bookSheetrock-anchor-toggle’).click();
});

$( document).on(‘click’, ‘#menu-item-1148 > a’, function(e) {
e.preventDefault();
$(’#bookNOW-anchor-toggle’).click();
});
});

Hi,

Book Now in the dropdown has a different id, it’s 1164

You can try this code

jQuery(function($){
$( document).on('click', '#menu-item-119 > a', function(e) {
e.preventDefault();
$('#bookSheetrock-anchor-toggle').click();
});

$( document).on('click', '#menu-item-1148 > a', function(e) {
e.preventDefault();
$('#bookNOW-anchor-toggle').click();
});

$( document).on('click', '#menu-item-1164 > a', function(e) {
e.preventDefault();
$('#bookNOW-anchor-toggle').click();
});
});

Please note that you can also add a unique class to your menu items and use that instead of the id which is not that reliable as it is randomly generated.

Thanks

I am wondering if the code I had is any different from your suggestion which wasn’t work anyway! Well, It does as long I add the Global Block related with the call!

Thank you for your attention but @Rad answer is the one that I should look for.

Best.

Hello @RCBarros,

I am another staff checking in. Your code and the way you have done it, is close enough to what you have wanted. @Rad’s suggestion can only be possible with custom development. He gave suggestions to get you started with something and would serve as your guide in doing your customization. Please understand this coding it is already beyond the scope of our support.

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third party developer.

Thank you for your understanding.

Definily undestood. Thanks.

Best

You’re welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.