[SOLVED] Please help - No error but code not working

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

[SOLVED] Please help - No error but code not working

Post by Bbob »

Hi I have a jQuery thats not working. Its suppose to display a value in the div "error" but nothings showing up.

Content of checklogin.php is just "hello" - just for error checking

Here's the code

Code: Select all



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
    <head>
        <title>HP - Login</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link href="../css/style.css" rel="stylesheet" type="text/css" />
    </head>
        
        <!-- Javascript -->
        <script type = "text/javascript" src="jquery.js"> </script>
        <script type = "text/javascript">
        
        
            function checklogin() {
            $.post( 'checklogin.php', {username: form.username.value},
                function(error) {
                    $('#error').html(error).show()
                
            });
        }
    
        </script>
    <body>
 
        <div id="wrap">
 
            <div id="header">
                <div id="logo">
                    <h1 id="sitename">H<span class="green">P</span></h1>
                    <h2 class="description"></h2>
                </div>
                
                <div id="headercontent"></div>
                
                <div id="sitecption">
                    Welcome
                    <span class="bigger">Guest</span>
                </div>
            </div>
        
            <div id="main">
            
                <div id="menus">
            
                    <div id="mainmenu">
                        <ul>
                            <li class="first"><a href="home.php">Home</a></li>
                            <li id="active"><a href="login.php">Log In</a></li>
                            <li><a href="about.php">About</a></li>
                            <li><a href="services.php">Services</a></li>
                            <li><a href="contact.php">Contact</a></li>
                        </ul>
                    </div>
                
            
                </div>
 
                <div id="content">
 
                    <div id="homeleft">
                        
                        <form name="login">
                            
                            <table width="480" border="0">
                                 
                                  <tr>
                                    <th scope="col"><h2>User<span class="green">name</span></h2></th>
                                    <td scope="col"><input type="text" name="username" /></th>
                                  </tr>
                                  
                                  <tr>
                                    <th><h2>Pass<span class="green">word</span></h2></td>
                                    <td><input type="password" name="password"/></td>
                                  </tr>
                                  
                                  <tr>
                                    <td colspan="2"> <div id = "error" > </div> </td>  -  this is where the error or text from checklogin should show up.
                                  </tr>
                                  
                                  <tr>
                                    <th></td>
                                    
                                    <td>
                                        <p>&nbsp;</p>
                                        <input type="button" value="Submit" onClick="checklogin();"/>
                                    </td>
                                    
                                  </tr>
                           </table>
                         </form> 
                    </div>
 
                    <div id="homeright">
                
                    </div>
                
                    <div class="clear"></div>
 
                </div>
            
            </div>
            
            <div id="footer">
                
            </div>
            
        </div>
 
    </body>
 
</html>

Last edited by Bbob on Sat Sep 04, 2010 10:48 pm, edited 1 time in total.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: Please help - No error but code not working

Post by McInfo »

If you use Firefox, get the Firebug extension.
Firebug Console wrote:form is not defined
$.post( 'checklogin.php', {username: form.username.value},
Also, some of the <td>s and <th>s are mixed up in the table.
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

Re: Please help - No error but code not working

Post by Bbob »

Hi thanks for the reply


Ive changed the code, replace "form" with the "login" form and fixed the th / td mix up but it still doesnt work.

Ive also download and install Firebug...but dont know how to use.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Please help - No error but code not working

Post by califdon »

With Firebug installed in FireFox browser, any time you're looking at a web page, look over at the upper right corner and you should see 3 green checkmarks, but if one of them turns red and has an exclamation point, click on it to reveal CSS and Javascript errors. You can also click Tools -> Firebug -> Open Firebug (or just press F12) to open the analysis panel at the bottom. If you're going to write web pages, you need to learn how to use Firebug.
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

Re: Please help - No error but code not working

Post by Bbob »

Hi

Thanks McInfo & califdon for the replies.

I manage to get it to work but I dont know how :lol:

I think it was because of a corrupt download of jQuery - Ive download this 10 times, 10th time worked :crazy:


BTW

Are there alternative to Firebug? I usually use Chrome. Is there a software similar to Firebug but independent from web browser?
Likewise, do you guys know any software that can debug Javascript/jQuery Code? Like jCreator for Java.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: [SOLVED] Please help - No error but code not working

Post by McInfo »

The Firefox version of Firebug does JavaScript debugging.

There is Firebug Lite for Chrome, but it's not as complete as the Firefox version (according to the website). You might investigate Chrome Developer Tools. I have used neither.

To make better use of jQuery in your script, use this code to get the user name:
$("input[name='username']").first().val()

Note: I would have put the code snippet into syntax blocks, but the square brackets are not compatible.
Post Reply