CODEWITHSUNDEEP
javascriptnode.jsexpressejs
Arjun Jain
Arjun Jain

Reputation: 59

Make a Button work in an Express.js app

I am trying to add a button to a simple webapp, however i do not know how to make it work. I am using Node,express,ejs. I have two major issues:

There is an auto-generated app.js which of course has all required modules included. The files below are ( index.js , style.css, index.ejs ) respectively.

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', {
    title: 'Welcome to AJ homepage'
  });
});

module.exports = router;
@import url(https://fonts.google.com/specimen/Fjalla+One?selection.family=Fjalla+One);
body {
  padding: 50px;
}

a {
  color: #00B7FF;
}

h1 {
  font-family: cursive;
  position: relative;
  font: ""
}

.btn {
  position: relative;
  bottom: 10px;
  top: 10px;
}

p {
  position: relative;
  top: 30px;
  font-size: 20px
}
<!DOCTYPE html>
<html>

<head>
  <title>
    <%= title %>
  </title>
  <link rel='stylesheet' href='/stylesheets/style.css' />
  <link rel='stylesheet' href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<div class="modal-body row">
  <div class="col-md-6">


    <body>
      <h1>
        <%= title %>
      </h1>
      <button class="btn" type="button">My Applications</button>
      <p>MY INFO </p>
    </body>

  </div>

  <div class="col-md-6">
    <img src="../public/images/arjun.jpg.jpg" alt="My Photo" class="img-responsive">
  </div>
</div>

</html>

Upvotes: 0

Views: 14086

Answers (3)

Wylie Kulik
Wylie Kulik

Reputation: 686

Try using an <a href="/my_applications"> instead of the <button>, you should still be able to style it as a button. Check this answer out: How to create an HTML button that acts like a link? , as it shows other options, like using a <form>. Also, in your express code you will need to define the route you want to serve.

Upvotes: 1

Vikram Barnwal
Vikram Barnwal

Reputation: 47

<a href="/applist"> you can this anchor tag instead of button . this will be redirect to your applist page where you have define the route.

Upvotes: 0

jdlm
jdlm

Reputation: 6664

I'm not sure why you need a button in this scenario. I suggest using an ordinary anchor link:

<a href="/applist" class="btn">My applications</a>

Upvotes: 0

Related Questions