rikky
rikky

Reputation: 331

How can I load .html file in a specified div tag using jquery ajax

I'm trying to load a .html file in a other html file ManageAccount page should load in a div with id main, when manage acount is clicked, but it loading the whole page again in div. enter image description here Result is fethching all the html page insted of new html page can any one suggest me please.

<script type="text/javascript">
    $(document).ready(function(){
      var btn;
      $('button[type="button"]').click(function() { 
        btn = this.id;
        alert(btn);
        $.ajax({
          url: btn.html,
          type: 'GET',
          //async:'false';
          dataType: 'html',
          success: function(result){
            $("#main").html(result);
            alert(result);
          }
       });

      });
    });
</script>

Manage Account Profile Application Status Query

Upvotes: 0

Views: 1438

Answers (2)

brroshan
brroshan

Reputation: 1650

Try using jQuery.load()

 $('button').on("click", function() { 
       $("#main").load("btn.html"); 
 });

Upvotes: 0

kosmos
kosmos

Reputation: 4288

You have to wrap in quotes at least the extension of the file url: btn + '.html'.

Also, you can use jQuery .load() method directly:

$('#main').load(btn + '.html');

Upvotes: 1

Related Questions