0

Sample code:

<html>
    <head>
        .....
    </head>
    <body>
        <div id="content">
            <form>
                ....
                <input type="submit" onclick="loadAnotherPage()"/>
            </form>
        </div>
    </body>
</html>  

I want to load another page say edit_profile.php in the content div. How can it be achieved without refreshing the page?

I tried to use jQuery load() method. But looks like I missed something. Any help would be highly appreciated.

1
  • Post the code that you tried, and what results did you get (other than "it didn't work")?
    – ahren
    Mar 21, 2013 at 10:57

3 Answers 3

3

When you click submit button it's submit form and page refresh that's why its not working.

Instead of type submit set button and then set function onclick.

function loadAnotherPage(){
    $("#content").load('edit_profile.php');
}
1
  • 1
    Thanx buddy! I guess the issue was with submit type only... :)
    – Hare Kumar
    Mar 21, 2013 at 11:07
0
           $(document).ready(
            function() {
              $('#load_file').click(
            $.post('edit_profile.php',
             {},
             function(data){
                $("#content").html(data);
             },''
            )
               ); 
                }
                    );
0

Try this

<html>
 <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 </head>
    <body>
     <div id="content"></div>
      <button id="loadpage">load new page</button>
<script>
 $(document).ready(function () {
    $("#loadpage").click(function() {
        $.get("edit_profile.php", function(response){
          $("#content").html(response);
        });
    })
 });
</script>
    </body>
</html> 

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.