CODEWITHSUNDEEP
jqueryhtml
Abhishek Jain
Abhishek Jain

Reputation: 493

how to link a button to a page using jquery provided that onclick triggers some other function too

I want that the showAll button click should open another page and the showAll function gets executed there so that the results are printed on the new page.Secondly how can i modify the console.log statement to some other so that it prints the result on this(new)page and not on console.

HTML

<ul class="nav">
    <li id="add" ><p>Add</p></li>
    <li id="show"><p>Show</p></li>
    <li id="showAll"><p>Show All</p></li>

</ul>

JS file

$(document).ready(function(){

   function showAll()
    {
        var objectStore = db.transaction(storeName).objectStore(storeName);

        objectStore.openCursor().onsuccess = function(event)
        {
            var cursor = event.target.result;
            if (cursor) 
            {
            console.log(" Post: " + cursor.value.post);
                cursor.continue();
            }
            else
            {
                alert("No more entries!");
            }
        };

    }


          $("#showAll").click(function()
      {

            console.log("eventlistner called for showAll...");

            showAll();

      });

});

Upvotes: 0

Views: 259

Answers (2)

David Colwell
David Colwell

Reputation: 2590

I will make the following assumptions:

  • You have a page set up which is seperate to the original page. This page will be called Popup.html
  • Your original page does not contain the LoadAll() function
  • The ShowAll() code is independently executable

Add the following code to the popup.html file

$(document).ready(function(){
    var objectStore = db.transaction(storeName).objectStore(storeName);

    objectStore.openCursor().onsuccess = function(event)
    {
        var cursor = event.target.result;
        if (cursor) 
        {
        console.log(" Post: " + cursor.value.post);
            cursor.continue();
        }
        else
        {
            alert("No more entries!");
        }
    };

}

now on your original page, put the following code:

$(document).ready(function(){
$("#showAll").click(function()
{
    window.open("popup.html");
};
});

Upvotes: 0

Eric
Eric

Reputation: 18922

You have to be more specific what you mean by "the new page". To pass data between two different pages, you can either:

  • Make a POST/GET request, along with the data
  • Store the data in a session variable, by a AJAX-call to some back-end script
  • Store it in a temporarily cookie
  • Use HTML5 with the LocalStorage API

Upvotes: 1

Related Questions