How do I display the username with the message?

Question

0.00/5 (No votes)

See more:

I've added a prompt box but can't figure out on how to add the username before the text
eg :- ria:hi
can someone help me with a proper code please?

What I have tried:

HTML

<div class="container-fluid">
    <div class="row">
        <ul id="messages"></ul>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="input-group">
                <span class="input-group-btn">
                    Send! 
                </span>
            </div>
        </div>
    </div>
</div>

JavaScript

const room = 'javascript';
const socket = io.connect('/tech');

$('form').submit(()=>{
    let msg= $('#m').val();
    socket.emit('message', {msg, room});
    $('#m').val('');
    return false;
});

socket.on('connect', ()=>{
    socket.emit('join', {room: room});
});

socket.on('message', (msg) =>{
    $('#messages').append($('<li>').text(msg));
});

var username = prompt('');

Posted 4-Mar-20 1:12am

User 14688803

Updated 4-Mar-20 5:04am

Richard Deeming

v2

Add a Solution

Comments

ZurdoDev 4-Mar-20 11:15am

Where are you stuck?

[no name] 4-Mar-20 14:32pm

I've used var username = prompt('Enter your username') to enter the input just not aware how to join the input(username)+message
this is my index.js code : tech.on('connection', (socket) => {

socket.on('join', (data) =>{
socket.join(data.room);
tech.in(data.room).emit('message', `New user joined ${data.room} room!`);
});

console.log('User Connected');

socket.on('message',(data) => {
console.log(`message: ${data.msg}`);
tech.in(data.room).emit('message', data.msg);
});
and the js.html code is as follows: const room = 'javascript';
const socket = io.connect('/tech');

$('form').submit(()=>{
let msg= $('#m').val();
socket.emit('message', {msg, room});
$('#m').val('');
return false;
});

socket.on('connect', ()=>{
socket.emit('join', {room: room});
socket.on('message', (msg) =>{
$('#messages').append($('').text(msg));
});

var username = prompt('Enter your username')

ZurdoDev 4-Mar-20 14:56pm

" not aware how to join the input(username)+message" - What does that mean? Because you join together two strings all you do is
var1 + var2;

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

W∴ Balboos, *GHB* · Answer 1 · 2020-03-04T01:52:00

Solution 1

You're using jquery or some other framework - not how you noted your question, but,

Here, in real javaScript, is a method:

For this example:
First, let the user name be in the variable uid
Let your message be in variable msg

Then the script would display the message as

JavaScript

alert(uid + ': ' + msg);

However - since you couldn't work it out yourself and yet you had code with sophistication at an arguably higher level than appending two strings in javaScript I'd say you just copied the code from somewhere and are quite clueless. I've given you the pieces, but you'll need to assemble them yourself inside your code - trivial if I'm wrong about you.

Posted 4-Mar-20 1:52am

W∴ Balboos, GHB

Comments

Richard MacCutchan 4-Mar-20 11:18am

"you just copied the code from somewhere"
Doesn't everyone?

[no name] 4-Mar-20 14:29pm

right? I looked up some yt videos and this is my first project(which i had to develop) so i think i'm doing okay until i understand what i'm doing :) I've used var username = prompt('Enter your username') to enter the input just not aware how to join the input(username)+message
this is my index.js code : tech.on('connection', (socket) => {

socket.on('join', (data) =>{
socket.join(data.room);
tech.in(data.room).emit('message', `New user joined ${data.room} room!`);
});

console.log('User Connected');

socket.on('message',(data) => {
console.log(`message: ${data.msg}`);
tech.in(data.room).emit('message', data.msg);
});
and the js.html code is as follows: const room = 'javascript';
const socket = io.connect('/tech');

$('form').submit(()=>{
let msg= $('#m').val();
socket.emit('message', {msg, room});
$('#m').val('');
return false;
});

socket.on('connect', ()=>{
socket.emit('join', {room: room});
socket.on('message', (msg) =>{
$('#messages').append($('').text(msg));
});

var username = prompt('Enter your username')

W∴ Balboos, GHB 5-Mar-20 7:53am

Tell me - would you use a youTube video before doing your own dental work? How about fixing an automobile transmission?

Go here: https://www.w3schools.com/js/default.asp and learn the language - it's done in a very relaxed manner with the ability for you to try things out. You didn't even know what language variant you were using in your topic selection