(batches issue) take this course button loading issue with js code

Last updated on by

Home › Forums › Legacy Support › Support queries › Setup issues › (batches issue) take this course button loading issue with js code

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 29, 2021 at 4:30 pm #373818
    EduMEE2
    Participant
    when single course page loaded then the take this course button loads after sometime. my custom code does not work because take this course button is loading by react codes: http://somup.com/cr6UDv3GD6 what i need is- "if there is batches in the course and user is not enrolled in any of batch then the take this course button should be hidden." my code- 
    add_action('wp_footer',function(){
if(is_singular('course') || is_singular('course-layout')){
?>
<script>
jQuery(document).load(function($){
let enrollNowButton = document.querySelector(".single-course .wplms_batches_wrapper.block a.enrol_in_batch.button.is-primary.small");
let takeThisCourse = document.querySelector(".single-course div#take-this-course-button-wrapper a.course_button.button.full");
if(enrollNowButton && enrollNowButton.innerText == 'ENROLL NOW' && takeThisCourse && takeThisCourse.innerText.includes("Take this course") && document.querySelector("body").classList.contains("logged-in")){
takeThisCourse.style.display="none";
jQuery('.single-course .course_pricing>strong').append("<a href='#batches-area' id='append-batches-button'>Click the Enroll Now button to subscribe in this course.</a>");}
});
</script>
<?php
}
},9999);
    October 30, 2021 at 3:15 am #373829
    MrVibe
    Keymaster
    Ideally, you can simply paste a small CSS code in single course page to hide the Take this course button. I am converting your jquery code into native js code. We execute your code when the user logs into WPLMS as WPLMS is a session less cookie less login system. document.addEventListener('userLoaded',function(){ let enrollNowButton = document.querySelector(".single-course .wplms_batches_wrapper.block a.enrol_in_batch.button.is-primary.small"); let takeThisCourse = document.querySelector(".single-course div#take-this-course-button-wrapper a.course_button.button.full"); if(enrollNowButton && enrollNowButton.innerText == 'ENROLL NOW' && takeThisCourse && takeThisCourse.innerText.includes("Take this course") && document.querySelector("body").classList.contains("logged-in")){ takeThisCourse.style.display="none"; let aTag = document.createElement('a'); aTag.setAttribute('href','#batches-area'); aTag.setAttribute('href','append-batches-button'); aTag.innerHTML = 'Click the Enroll Now button to subscribe in this course.'; document.querySelector('.single-course .course_pricing>strong').appendChild(aTag); } });
    October 30, 2021 at 3:17 am #373830
    MrVibe
    Keymaster
    Another alternate is to create another Course layout for Batches and Assign that course layout to the courses which have batches. In that layout do not add the course button.
    October 30, 2021 at 11:10 am #373847
    EduMEE2
    Participant
    This reply has been marked as private.
    November 1, 2021 at 6:05 am #373900
    MrVibe
    Keymaster
    Did you try adding the above code, replacing your javascript code with the above ? 1. currently you can apply a course layout on a category of courses as well. 2. replace the one you added. 3. turning opacity zero, the enroll button in batch will trigger click on the course button. --- "my code checks if user is logged in" For that you were using wrong Event in javascript, the code i shared uses the correct event userLoaded.
  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘(batches issue) take this course button loading issue with js code’ is closed to new replies.