How to link HTML page to JavaScript file in Framework7

Question

How to link HTML page to JavaScript file in Framework7

63 Views Asked by Mr Chefane At 10 June 2023 at 10:19

I am new in framework7 I want to link my html page with Javascript file

this is how my html file looks like:

 <div class="page-content" id="details-form">
      <div class="block-title">Utility Details</div>
      <div class="list no-hairlines-md">
        <ul>
          <li>
            <div class="item-content item-input">
              <div class="item-inner">
                <div class="item-title item-label"> Meter Number</div>
                <div class="item-input-wrap">
                  <input type="number" name="meterNumber" placeholder="meterNumber" required="required" />
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="item-content item-input">
              <div class="item-inner">
                <div class="item-title item-label">Amount</div>
                <div class="item-input-wrap">
                  <input type="number" name="amount" placeholder="Amount" required="required" />
                </div>
              </div>
            </div>
          </li>
        </ul>
      </div>
      <!-- <div class="block block-strong"> -->
        <p class="row">
          <a href="#" class="col button button-fill" id="paymentbtn">Purchase</a>
        </p>
      <!-- </div> -->
    </div>

it is just a simple form that captures data, I want the javascript file to be executed when purchase button is clicked.

below is my simple javascript file:

$$(document).on('page:init', '.page[data-name="utilityForm"]', function (e) {
   
    $$('#paymentbtn').on('click', function (e) {

        console.log ("purchase eletricity buttton clicked");
      });

  });

Original Q&A

There are 2 best solutions below

Pobarul islam On 10 June 2023 at 10:31

You put this JavaScript <script src="./yourfilename.js"> </script> link in the head tag or above the body close tag and give the name of your JavaScript file here in src="" . You can use dots (.) and slashes (/) if necessary.

<!DOCTYPE html>
<html>
<head>
  <title>My App</title>

  <script src="path/to/script.js"></script>

  <!-- Framework7 initialization script -->

  <script src="your file name put here"></script>

  <!-- Other script tags or stylesheets -->
</head>
<body>
  <!-- Your HTML content -->
</body>
</html>

**moaz ahmad** · Accepted Answer · 2023-06-10T13:36:31.800000

Your code is completely perfect and there are no bugs in it. You just need to add your javascript code in html file by providing a path to it: Make a new javascript file such as function.js and paste your javascript code in it. Afterwards use script tag in HTML code to link this file with HTML:

Hope this answers your question. Feel free to ask something else.

How to link HTML page to JavaScript file in Framework7

There are 2 best solutions below

Related Questions in JAVASCRIPT

Related Questions in HTML-FRAMEWORK-7

Trending Questions

Popular # Hahtags

Popular Questions