CODEWITHSUNDEEP
javascriptjqueryhtmlcssstring
Briz
Briz

Reputation: 536

Checking if first letter of a string = char

I'm having a short 2 character string being sent from C++ to my Javascript (using Awesomium). I know for a fact that the string will either be "L1", "G1", "P1", or "D1". These are initials.

What I am trying to do is having a text div display the full name of the initial sent in, for example, if "L1" is sent, then "Limes" would appear on the screen, or if "G1" was sent in, "Grapes" would appear.

I've tried to remove the last character from the string, then check with if statements that the letter matches with one of the four. I then set the div's text using $('#div').html("text to be inserted");

For some reason, the code automatically displays the last if statement's contents, whether or not that is the correct string.

JS:

function showStats(job)
{
   $('#jobHat').css("hat-image", "url(images/"+job+"Hat.png)");

   var jobInitial = job.slice(0, -1); 
   if(jobInitial = "L")
   {
        $('#playerJobText').html("Landman");
   }
   if(jobInitial = "G")
   {
        $('#playerJobText').html("Geologist");
   }
   if(jobInitial = "P")
   {
        $('#playerJobText').html("Petroleum Engineer");
   }
   if(jobInitial = "D")
   {
        $('#playerJobText').html("Drilling Engineer");
   }

HTML: 

<div id ="playerJobText"></div>

CSS:

#playerJobText
{
   width: 200px;
   height: 50px;
   position: absolute;
   font-weight: bold;
   text-align:center;
   top: 32.5%;
   left: 19%;
   font-size: 100%;
   font-style: normal;
   color: black;
   z-index: 50;
}

I include the jobHat segment in the JS code to show an area where the "L1", "G1", etc. string works as it should. The image file name is replaced by the string, which shows different images I have, as those images are named L1Hat.png, G1Hat.png, etc.

So what is wrong with the way I'm trying to check the first letter of the string to replace a div's text?

EDIT I had tried the double == and then the triple === but there was still no results. I put the single = in for this example as it's what I'm most familiar with, but I'm glad I did so I could get the reminder from you all that == or === is better for this occasion.

Upvotes: 2

Views: 1952

Answers (4)

Pacerier
Pacerier

Reputation: 89643

Firstly, using slice here is a bad choice. use charAt instead.

Secondly, that 4 if statements is an eyesore. use switch instead.

function showStats(job){
    $('#jobHat').css("hat-image", "url(images/"+job+"Hat.png)");

    var full_name;
    switch(job.charAt(0)){
        case "L":
            full_name="Landman";
            break;
        case "G":
            full_name="Geologist";
            break;
        case "P":
            full_name="Petroleum Engineer";
            break;
        case "D":
            full_name="Drilling Engineer";
            break;
        default:
            throw "invalid input: "+input;
    }
    $('#playerJobText').html(full_name);
}

Upvotes: 3

Bj&#246;rn
Bj&#246;rn

Reputation: 2648

Your if statements are not comparing, but assigning. Use double == or triple ===

Upvotes: 1

wanovak
wanovak

Reputation: 6127

You're using an assignment operator

if(jobInitial = "L")

should be

if(jobInitial === "L")

and so on.

Upvotes: 1

Alnitak
Alnitak

Reputation: 339816

As others have mentioned, you were assigning rather than testing for equality.

In any event, this code below is simpler and avoids a lot of repetition:

function showStats(job)
{
   $('#jobHat').css("hat-image", "url(images/"+job+"Hat.png)");

   var initial = job[0];  // or job.substring(0, 1);
   var title = ({
       L: 'Landman',
       G: 'Geologist',
       P: 'Petroleum Engineer',
       D: 'Drilling Engineer'
   })[initial];

   $('#playerJobText').text(title);
}

Upvotes: 5

Related Questions