Trent Trent - 18 days ago 8
Javascript Question

Node JS Server Requests using buttons

I'm currently working on creating a menu for my Node JS application and I haven't figured out how to make server requests without using the browsers navigation bar.

My directory structure is as follows.

/application/nodeserver.js

/screens/index.js
/screens/other.js
/screens/notfound.js


My nodeserver.js is as follows

// main

var gv_http = null;
var gv_filestream = null;
var gv_server = null;

// screens

var gv_index = null;
var gv_other = null;
var gv_notfound = null;

// set variables

gv_http = require('http');
gv_filestream = require('fs');
gv_server = gv_http.createServer();

gv_index = require('./screens/index');
gv_other = require('./screens/other');
gv_notfound = require('./screens/notfound');

// server

gv_server.on('request', function(request, response) {

switch(request.url) {

case '/':
case '/index':
gv_index.gui(response);
break;

case '/other':
gv_other.gui(response);
break;

default:
gv_notfound.gui(response);
break;

}

});

gv_server.listen(90);


This bit all works fine but the only way I can trigger my case statement is by typing into the browser which brings up my javascript screens.

One of the screens index.js

var gv_mainmenu = null;

gv_mainmenu = require('./elements/mainmenu');

var gui = function(response) {

response.writeHead(200, {'Content-Type':'text/html'});

response.write(
'<html>' +
'<body>'
);

response.write(
'<button id="butt_index">' +
' index' +
'</button>' +
'<button id="butt_other">' +
' other' +
'</button>'
);

response.write(
'<h4>index</h4>'
);

response.write(
'</body>' +
'</html>'
);

response.end();

}

function sendrequest() {

console.log("request sent");

}

module.exports.gui = gui;


Is it possible to simulate this using one of the html buttons? I've only seen this happen with frameworks like Express but I don't want to use one of these while still learning.

PS

I know my code may look weird to JavaScript experts but I follow the coding standards of the people I work with and we code primarily with Genero so I try to keep it familiar to them and myself.

Answer

Easiest solution is to add an anchor tab to your buttons so they link to your new page.

'<a href="/index"><button id="butt_index">' +
  '   index' +
  '</button></a>'
Comments