CODEWITHSUNDEEP
javascriptjqueryhtml
Ask
Ask

Reputation: 257

Need to be refreshed only div not the whole page

I have an div and inside that div I have a link as 

<a href="#" onclick="Edit_popup();" >edit</a>

When I click on this link the whole page is getting refreshed. But I need only this div to be refreshed not whole page. I am calling this as :

function Edit_popup(){
var criteria=prompt("Please enter id");
if (id=="Login" || id=="login")
   {
   $("#criteria").load("page2.html");
}

Upvotes: 1

Views: 694

Answers (3)

ebram khalil
ebram khalil

Reputation: 8321

You can try using e.preventDefault(); inside your function so that you can do whatever you want then use e.preventDefault(); that 'll prevent the browser from performing the default action for that link.

kindly check this link to understand the difference between return false; and e.preventDefault(); return-false-and-prevent-default

Upvotes: 0

Derek Henderson
Derek Henderson

Reputation: 9706

The reason the whole page is getting refreshed is because you have clicked on a link and the link's default behavior is to send you to it's href. (If you look at your browser's address line, you'll notice the URL ends in /#.)

The correct way to prevent this is to pass the event to the function

onclick="Edit_popup(e);"

and then stop the event's (in this case, the click's) default behavior:

function Edit_popup (e) {
    var criteria=prompt("Please enter id");

    e.preventDefault(); // this line cancels the link

    if (id=="Login" || id=="login") {
        $("#criteria").load("page2.html");
    }
}

Upvotes: 2

Vaibhav Jain
Vaibhav Jain

Reputation: 3755

Try with

    <a href="#" onclick="Edit_popup(); return false;" >edit</a>

Upvotes: 3

Related Questions