Title: javascript issues
Last modified: February 5, 2021

---

# javascript issues

 *  Resolved [yezzz](https://wordpress.org/support/users/yezzz/)
 * (@yezzz)
 * [5 years, 4 months ago](https://wordpress.org/support/topic/javascript-issues-8/)
 * Hi,
 * I recently updated from v5.9.11.2 and I just realised I didn’t wait due to the
   change to CPT, but actually because prior to that you made some changed in javascript,
   I think the fix in v5.9.12.18.
 * Trouble is, that I’m using ajax, with setting set 1 for linklist and categories
   tables, and setting set2 for a category dropdown, see sidebar at link given.
 * In the old version the dropdown ajax results went into #linklist1, which was 
   a desired side-effect of deficient js code. With the js changes the dropdown 
   results go into #linklist2, which isn’t on the page. I could put it there, but
   I only want to show 1 linklist, meaning I’d have to detect which linklist gets
   changed, do content switching and what not… making things complicated.
 * If you’d be willing to make some minor changes to your code that’ll improve your
   code, and make it simpler for me. I’ll show you how, and I’ll throw in some js
   improvements.
 * First, adding a number to the function name was better, but not really necessary(
   redeclaring using `var` and reassigning function is ok in js). You could have
   used variables inside the function to build the element id.
 * Second, using `document.catselect.catdropdown` is tricky, as there may be more
   than 1 matching elements on the page (eg when using 2 dropdowns). Better use 
   the event target, which is the select element. Also, no need to use selectedIndex
   option, as the selected value will be set on the select element.
 * What I propose is using a data attribute with the linklist id (which I can easily
   modify with js… but an option in the settings set to override the default number
   would be nice 🙂
 * `<select onchange="showcategory()" class="catdropdown" data-linklist-id="1">`
 * Then use this for showcategory. Note that `event` is always passed to the event
   handler. You can also set the function to accept 1 parameter, and replace event
   with your parameter. Re using data-attributes in vanilla js see [this page](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes).
 *     ```
       function showcategory() {
         catidvar = event.target.value; // or yourparam.target.value
         linklistID = event.target.dataset.linklistId; // replaced dash with camelCase
         // or: linklistID = jQuery(event.target).data("linklist-id")
         showLinkCat2(catidvar, linklistID, 1, '');
         return false;
       }
       ```
   
 * Then the ajax handler, for settings set 2. Note that you don’t seem to use ajaxobject
   so I removed it, as well as check if function exists.
 *     ```
       window.showLinkCat2 = function (_incomingID, _settingsID, _pagenumber, _searchll) {
         jQuery('#contentLoading2').toggle();
         jQuery.ajax({
           type: 'POST',
           url: '/wp-admin/admin-ajax.php',
           data: {
             action: 'link_library_ajax_update',
             _ajax_nonce: 'xxxxxxxxxx',
             id: _incomingID,
             settings: _settingsID,
             ajaxupdate: true,
             searchll: _searchll,
             linkresultpage: _pagenumber
           },
           success: function (data) {
             jQuery('#linklist' + _settingsID).html(data);  // Note the mod
             jQuery('#contentLoading2').toggle();
           },
           error: function() {
             jQuery('#contentLoading2').toggle();
             // something went wrong.. reload page?
           }
         });
       }
       ```
   
 * Feel free to test the code on my page, just use your browser dev tool to mod 
   the dropdown to have the data attribute, get the correct ajax nonce, paste it
   into the function above, then paste both functions via the console.
    -  This topic was modified 5 years, 4 months ago by [yezzz](https://wordpress.org/support/users/yezzz/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fjavascript-issues-8%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Plugin Author [Yannick Lefebvre](https://wordpress.org/support/users/jackdewey/)
 * (@jackdewey)
 * [5 years, 4 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14022666)
 * I’ll try to get to this soon. Just busy between day job and evening WordPress
   freelancing at the moment.
 *  Plugin Author [Yannick Lefebvre](https://wordpress.org/support/users/jackdewey/)
 * (@jackdewey)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14081032)
 * Please try updating to version 6.8.5. where you’ll be able to use a new parameter
   for the [link-library-cats] shortcode called targetlibrary. Set that to the value
   of the library to be updated and it should allow you to update to current versions
   of the plugin.
 *  Thread Starter [yezzz](https://wordpress.org/support/users/yezzz/)
 * (@yezzz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14087162)
 * Hi Yannick,
 * Thanks for the update! The shortcode parameter was a welcome addition and outputs
   the ID just fine. However the select outputs a nested function call:
 * `<select onchange="showcategory( showcategory( jQuery(.catdropdown2).val() ) )"`
 * This calls the ajax code twice: first the inner call with the value, then the
   outer one with NULL, pretty much the same as PHP.
 * So I’d recommend either doing the following (rewritten my code above, added var
   to give linklistID local scope):
 * `<select onchange="showcategory()" class="catdropdown catdropdown2" data-linklist-
   id="1">`
 *     ```
       function showcategory() {
         var linklistID = event.target.dataset.linklistId;
         showLinkCat2(event.target.value, linklistID, 1, '');
         return false;
       }
       ```
   
 * I see you now pass the category id to showLinkCat, so if that’s your preference
   you can actually get the select value inline with `this.value` and pass it to
   your function as your have it now:
 * `<select onchange="showcategory(this.value)" class="catdropdown catdropdown2"
   data-linklist-id="1">`
    -  This reply was modified 5 years, 3 months ago by [yezzz](https://wordpress.org/support/users/yezzz/).
      Reason: typo
    -  This reply was modified 5 years, 3 months ago by [yezzz](https://wordpress.org/support/users/yezzz/).
      Reason: clarify last code snippet needs your function taking catidvar as parameter
 *  Plugin Author [Yannick Lefebvre](https://wordpress.org/support/users/jackdewey/)
 * (@jackdewey)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14087787)
 * I could not use the code that you wrote since there are two modes for the drop-
   down list selection method. One instantly goes to target when you use drop-down,
   while the other waits for the user to press a button. Both call showcategory,
   but when it’s the button getting pressed, I don’t have access to the select value
   as event.
 * The nested function call was a copy/paste mistake. It will be removed in update
   I’ll push out later tonight.
 *  Thread Starter [yezzz](https://wordpress.org/support/users/yezzz/)
 * (@yezzz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14090222)
 * Ah ok, that clarifies why you’re hardcoding the target and getting its value.
   So I guess with the button you render that code in the button onclick and not
   in the select onchange.
 * Anyway, thanks for the update!!!
 *  Plugin Author [Yannick Lefebvre](https://wordpress.org/support/users/jackdewey/)
 * (@jackdewey)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14090387)
 * Exactly 🙂

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘javascript issues’ is closed to new replies.

 * ![](https://ps.w.org/link-library/assets/icon-256x256.jpg?rev=971117)
 * [Link Library](https://wordpress.org/plugins/link-library/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/link-library/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/link-library/)
 * [Active Topics](https://wordpress.org/support/plugin/link-library/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/link-library/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/link-library/reviews/)

 * 6 replies
 * 2 participants
 * Last reply from: [Yannick Lefebvre](https://wordpress.org/support/users/jackdewey/)
 * Last activity: [5 years, 3 months ago](https://wordpress.org/support/topic/javascript-issues-8/#post-14090387)
 * Status: resolved