<div class="free-sample" id="free-sample-component" data-bind="scope:'free_Sample_Component'">
    <button id="get-free-sample" data-bind="click:getFreeSample">Get Free Sample</button>

Above work in fine when click on free sample button but i want to use onload event. when page loaded then 'getFreeSample' should trigger.

  • 1
    did you tried data-bind="event: {change: getFreeSample()}" ? Nov 20, 2023 at 12:28
  • @Harishkuril I need to load free sample on page load so change event might be not work.
    – Mital Shah
    Nov 21, 2023 at 4:01
  • change event trigger on page load Nov 21, 2023 at 6:08
  • @Harishkuril Can you give example please.
    – Mital Shah
    Nov 22, 2023 at 3:56
  • I am using change event in the form tag and its trigger on page load, You can also try to add change event in the hidden field to trigger getFreeSample function on page load. Nov 22, 2023 at 6:19

2 Answers 2


You can use method call in if statement. But don't forget to make add return true in method.

<!-- ko if: isFreeShipping() -->
//My Code goes here
  • It will fire knockout template load.
    – Alkos
    Nov 20, 2023 at 13:42

Replace button with span and try below way

<span class="testprice" data-bind="click: getTestCodeContent"><span data-bind="i18n: 'Add Test Code'"></span></span>

and on the JS file create a function like below.

getTestCodeContent: function () {

Hope it will help.

  • It will trigger on click. i want to replace on page load event but i don't have idea how to use on load event.
    – Mital Shah
    Nov 22, 2023 at 3:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.