Getting jQuery's functions to run when page is loaded in a div
<p>I have a site where users can log in and check on outstanding support issues they have raised with us, on this site is a page to manage per company contacts. Whilst updating the site i have started using jQuery to load sub pages so that the user doesn't get a page refresh everytime. I've started to run into problems loading my JavaScript when that subpage is loaded into a div.</p>

<p><strong>The process is as follows:</strong><br />
User clicks the settings link, which loads settings.php (whole page refresh)<br />
User clicks the 'Manage Contacts' option, which loads managecontacts.php into div#settingsph<br />
From a select box, the user chooses the contact they wish to update, this loads that users data into div#contact_info (underneath the select box), using the option's value as a contact id to pass through to editcontact.php, which queries the db and renders it into a form for making changes to.<br /></p>

<p>Once this page is loaded, i intended on using jQuery validation and an ajax function to submit the form without page refresh again. However, i can't seem to get the Javascript to load at this point. I've tried referencing the Javascript as a file in the main page <code>&lt;head&gt;</code> tag, as script in the <code>&lt;head&gt;</code> tag, as a file in editcontact.php and as script in editcontact.php, but none of these seem to load the script to hide my error labels, or submit the update.</p>

<p>Code: editcontact.php</p>

<pre><code>&lt;?php
session_start();

require  '../dbsettings.php';

header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header ("Cache-Control: no-cache, must-revalidate");
header ("Pragma: no-cache");
header("content-type: application/x-javascript; charset=tis-620");
?&gt;
&lt;?php
$id = $_GET['id'];
if($id!=''){
    if($id!='NewContact'){ //if valid id has been supplied for db retrieval
        try
        {
            $db = new PDO('mssql:host=' . DBHOST . ';dbname=' . DBDATA, DBUSER, DBPASS);
        }
        catch(PDOException $error)
        {
            echo "&lt;h2&gt;Error!  " . $error-&gt;getmessage()."&lt;/h2&gt;";
            die();
        }

        $query = "  SELECT ContactID, Surname, Forename, Phone, Email, JobTitle, MobileNumber, LeaveDate 
                    FROM Contact 
                    WHERE CompanyID ='" . $_SESSION['companyid'] . "' AND ContactID='" . $id . "'
                    ORDER BY Forename ASC";

        foreach($db-&gt;query($query) as $contact)
        {
?&gt;
            &lt;!--Have tried putting the script between &lt;script&gt; tags here--&gt;
            &lt;div id="contact_update"&gt;
                &lt;form&gt;
                    &lt;h3&gt;Personal Information&lt;/h3&gt;
                    &lt;label for="forename"&gt;Forename(s):&lt;/label&gt;
                    &lt;input name="forename" id="forename" value="&lt;?php echo $contact['Forename']; ?&gt;" class="text-input" /&gt;
                    &lt;label class="error" for="forename" id="forename_error"&gt;Forename is required.&lt;/label&gt;
                    &lt;br /&gt;
                    &lt;label for="surname"&gt;Surname:&lt;/label&gt;
                    &lt;input name="surname" id="surname" value="&lt;?php echo $contact['Surname']; ?&gt;" class="text-input" /&gt;
                    &lt;label class="error" for="surname" id="surname_error"&gt;Surname is required.&lt;/label&gt;
                    &lt;br /&gt;
                    &lt;label for="jobtitle"&gt;Job Title:&lt;/label&gt;
                    &lt;input name="jobtitle" id="jobtitle" value="&lt;?php echo $contact['JobTitle']; ?&gt;" class="text-input" /&gt;

                    &lt;br /&gt;
                    &lt;h3&gt;Contact Information&lt;/h3&gt;
                    &lt;label for="phone"&gt;Telephone: &lt;/label&gt;
                    &lt;input name="phone" id="phone" value="&lt;?php echo $contact['Phone']; ?&gt;" class="text-input" /&gt;
                    &lt;label class="error" for="phone" id="phone_error"&gt;Telephone is required.&lt;/label&gt;
                    &lt;br /&gt;
                    &lt;label for="mob"&gt;Mobile: &lt;/label&gt;
                    &lt;input name="mob" id="mob" value="&lt;?php echo $contact['MobileNumber']; ?&gt;" class="text-input" /&gt;

                    &lt;br /&gt;
                    &lt;label for="email"&gt;Email:&lt;/label&gt;
                    &lt;input name="email" id="email" value="&lt;?php echo $contact['Email']; ?&gt;" class="text-input" /&gt;
                    &lt;label class="error" for="email" id="email_error"&gt;Email is required.&lt;/label&gt;
                    &lt;br /&gt;
                    &lt;h3&gt;Misc Information&lt;/h3&gt;
                    &lt;label for="ldate"&gt;Leave Date:&lt;/label&gt;
                    &lt;input name="ldate" id="ldate" value="&lt;?php echo $contact['LeaveDate']; ?&gt;" class="text-input" /&gt;
                    &lt;label for="ldate" class="hint"&gt;* Leave blank if still an active user&lt;/label&gt;

                    &lt;br /&gt;
                    &lt;input type="submit" name="submit" value="Update" class="button" id="update_button" /&gt;
                &lt;/form&gt;
            &lt;/div&gt;
&lt;?php
        } //end of foreach

    }else{ //else a new contact is being added
?&gt;      
            &lt;div id="contact_add"&gt;
                &lt;form&gt;
                    &lt;h3&gt;Personal Information&lt;/h3&gt;
                    &lt;label for="forename"&gt;Forename(s):&lt;/label&gt;&lt;input name="forename" id="forename" /&gt;&lt;br /&gt;
                    &lt;label for="surname"&gt;Surname:&lt;/label&gt;&lt;input name="surname" id="surname" /&gt;&lt;br /&gt;
                    &lt;label for="jobtitle"&gt;Job Title:&lt;/label&gt;&lt;input name="jobtitle" id="jobtitle" /&gt;&lt;br /&gt;
                    &lt;h3&gt;Contact Information&lt;/h3&gt;
                    &lt;label for="phone"&gt;Telephone: &lt;/label&gt;&lt;input name="phone" id="phone" /&gt;&lt;br /&gt;
                    &lt;label for="mob"&gt;Mobile: &lt;/label&gt;&lt;input name="mob" id="mob" /&gt;&lt;br /&gt;
                    &lt;label for="email"&gt;Email:&lt;/label&gt;&lt;input name="email" id="email" /&gt;&lt;br /&gt;
                    &lt;input type="submit" value="Update" /&gt;
                &lt;/form&gt;
            &lt;/div&gt;
&lt;?php
    }
}else{ //else page was not generated with id, possibly not using javascript - die, without allowing access
    echo 'ERROR 403 - FORBIDDEN';
    die();
}
?&gt;
</code></pre>

<p>Code: jquery.settings.js</p>

<pre><code>// JavaScript Document

$(function managecontacts() {
  $('.error').hide();
  $('input.text-input').css({backgroundColor:"#ffffe0"});
  $('input.text-input').focus(function(){
    $(this).css({backgroundColor:"#FFFFFF"});
  });
  $('input.text-input').blur(function(){
    $(this).css({backgroundColor:"#ffffe0"});
  });

  $(".button").click(function() {
        // validate and process form
        // first hide any error messages
    $('.error').hide();

        var forename = $("input#forename").val();
        if (forename == "") {
      $("label#forename_error").show();
      $("input#forename").focus();
      return false;
    }

        var surname = $("input#surname").val();
        if (surname == "") {
      $("label#surname_error").show();
      $("input#surname").focus();
      return false;
    }
        var email = $("input#email").val();
        if (email == "") {
      $("label#email_error").show();
      $("input#email").focus();
      return false;
    }
        var phone = $("input#phone").val();
        if (phone == "") {
      $("label#phone_error").show();
      $("input#phone").focus();
      return false;
    }

        var jobtitle = $("input#jobtitle").val();
        var mobile = $("input#mob").val();
        var ldate = $("input#ldate").val();

        var dataString = 'forename=' + forename + '&amp;surname=' + surname + '&amp;jobtitle=' + jobtitle '&amp;email=' + email + '&amp;phone=' + phone + '&amp;mobile=' + mobile + '&amp;ldate=' + ldate;
        //alert (dataString);return false;

        $.ajax({
      type: "POST",
      url: "Includes/stg/contactprocess.php",
      data: dataString,
      success: function() {
        $('#contact_update').html("&lt;div id='message'&gt;&lt;/div&gt;");
        $('#message').html("&lt;h2&gt;Contact Successfully Updated&lt;/h2&gt;")
        .append("&lt;p&gt;Thank you.&lt;/p&gt;")
        .hide()
        .fadeIn(1500, function() {
          $('#message').append("&lt;img id='checkmark' src='images/tick.png' /&gt;");
        });
      }
     });
    return false;
    });
});
</code></pre>

<p>Code: <code>&lt;head&gt;</code> tag for loading pages into divs</p>

<pre><code>&lt;script type="text/javascript"&gt;
    function open_page(name) {
        $("#settingsph").load("Includes/stg/"+name+".php");
    }
    function open_contact(id) {
        $("#contact_info").load("includes/stg/editcontact.php?id="+id);
    }
&lt;/script&gt;
</code></pre>

<p>Any help that can be given with regards to whether this is possible or not, or whether i need to go back to the drawing board will be greatly appreciated.</p>
