Karl

I really appreciate the responses.  I'm not new to "programming" but I
am very much a noob where javascript is concerned.  What I'm now
looking for is an explicit example of how to do what I'm trying.  The
code in this group helps, but it seems to be either confusing or
slightly off target.  Basically this is what I'm looking to do now:

State 1
<html>
<head>
<script src="js/jquery.js></script>
<script src="js/commonscripts.js></script><!--load some stuff used on
every page, this all works great-->
</head>
<body>
<!--lots of html that doens't really matter-->
<div id="container">Welcome to my App!</div>
<!--#container will change depending on function of page-->
</body>
<html>


State 2
<html>
<head>
<script src="js/jquery.js></script>
<script src="js/commonscripts.js></script><!--load some stuff used on
every page, this all works great-->
</head>
<body>
<!--lots of html that doens't really matter-->
<div id="container">
        <!--form.html loaded-->
        <form id="search">
        <fieldset>
        <legend> Search</legend>
        <table>
        <tr /><td NOWRAP/><lable>First Name: </lable><td /><input type =
"text" name="first_name" val="">
        <tr /><td NOWRAP/><lable>Last Name: </lable><td /><input type =
"text" name="last_name" val="">
        <tr /><td colspan = "2"/><input type="submit" id= "trigger1"
value="Find">
        <!--I can't get the submit to bind to a function on page reload-->
        </table>
        </fieldset>
        <div id="result"><!--results from search loaded here--></div>
        <script>$.getScript('js/external.js', search_rebind);</script>
        <!--form.html loaded-->

</div>
<!--#container will change depending on function of page-->
</body>
<html>

external.js:
<script>
function search_rebind() {

        $('#trigger1').click(function() {
                var temp = $('#search :input').serialize();
            $.ajax({
                                type: "POST",
                                 url: 'controller/search/',
                                 data: temp,
                                 dataType: "html",
                                success: function(html){
                                 $('#result').empty().append(html);
                                }
                        });
           return false;
        });
      };
</script>

I've tried various ways of loading the script and some methods work in
FF, but none have worked so far in IE 6.  Is there a simple, concise
example out there I can look over?  Or is there an obvious way to do
this I'm just not seeing?

Dave

Reply via email to