SDL2 (C++) not all .png images render correctly - c++

Question

Note: I am using Legacy OpenGL
So I have encountered a problem where only a few .png images get rendered correctly.
Here is an example screenshot of rendered game (Left: enemyRed.png, Right: (ship.png)):
Here is the code I use to load images:
SpriteImage* SDLOpenGL::loadImage(std::string path) {
SDL_Surface * surface = IMG_Load(path.c_str());
SpriteImage * image = new SpriteImage(&*surface);
return image;
}
Here is the SpriteImage class:
SpriteImage::SpriteImage(SDL_Surface *surface) {
this->surface = surface;
this->TextureID = 0;
}
void SpriteImage::bind() {
glTexImage2D(GL_TEXTURE_2D,
0,
this->mode,
this->surface->w,
this->surface->h,
0,
this->mode,
GL_UNSIGNED_BYTE,
this->surface->pixels
);
glBindTexture(GL_TEXTURE_2D, this->TextureID);
}
int SpriteImage::getWidth() {
return this->surface->w;
}
int SpriteImage::getHeight() {
return this->surface->h;
}
Here is where I render the images:
(note, this->getCurrentImage() returns a "SpriteImage")
void Sprite::draw(float delta) {
this->getCurrentImage()->bind();
glBegin(GL_QUADS);
glTexCoord2f(0, 0);
glVertex2f(0.0f, 0.0f);
glTexCoord2f(0, 1);
glVertex2f(0.0f, this->getHeight());
glTexCoord2f(1, 1);
glVertex2f(this->getWidth(), this->getHeight());
glTexCoord2f(1, 0);
glVertex2f(this->getWidth(), 0.0f);
glEnd();
this->next();
}

Answer 1

The image that doesn't render has a width indivisible by four. You should use glPixelStorei with GL_UNPACK_ALIGNMENT before glTexImage2D to specify alignment of your rows in memory -- which are probably unaligned (OpenGL assumes by default that they are four-byte aligned).
You should first glBindTexture and then upload the data with glTexImage2D.
Do you ever call to glGenTextures? You should initialize the TextureID with glGenTextures.
You should not upload the texture each and every time you bind the texture. Instead upload it in the constructor, then to switch textures you only need to glBindTexture your TextureID.