Click here to Skip to main content
15,867,308 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I want to use google image search in my web application, i have used javascript to use google image search API..I am getting all images in HTML format in my DIV tag but my images are not clickable..I am not able to click any of the images so i can select and use it in my web application.Please help! its urgent.
here is my code
XML
<script src="https://www.google.com/jsapi?key=ABQIAAAASMLUGzERz2DOV0VrYYaLdBSGENBPbEzqouqYd8gGP4C4HYGvShQekkxD9rz_3ovZBRTPr_wrRrVGog"></script>
    <script type="text/javascript">

      google.load('search', '1');

      var imageSearch;

      function addPaginationLinks() {

        // To paginate search results, use the cursor function.
        var cursor = imageSearch.cursor;
        var curPage = cursor.currentPageIndex; // check what page the app is on
        var pagesDiv = document.createElement('div');
        for (var i = 0; i < cursor.pages.length; i++) {
          var page = cursor.pages[i];
          if (curPage == i) {

          // If we are on the current page, then don't make a link.
            var label = document.createTextNode(' ' + page.label + ' ');
            pagesDiv.appendChild(label);
          } else {

            // Create links to other pages using gotoPage() on the searcher.
            var link = document.createElement('a');
            link.href = 'javascript:imageSearch.gotoPage('+i+');';
            link.innerHTML = page.label;
            link.style.marginRight = '2px';
            pagesDiv.appendChild(link);
          }
        }

        var contentDiv = document.getElementById('content');
        contentDiv.appendChild(pagesDiv);
      }

      function searchComplete() {

        // Check that we got results
        if (imageSearch.results && imageSearch.results.length > 0) {

          // Grab our content div, clear it.
          var contentDiv = document.getElementById('content');
          contentDiv.innerHTML = '';

          // Loop through our results, printing them to the page.
          var results = imageSearch.results;
          for (var i = 0; i < results.length; i++) {
            // For each result write it's title and image to the screen
            var result = results[i];

            var imgContainer = document.createElement('div');

            var title = document.createElement('div');

            // We use titleNoFormatting so that no HTML tags are left in the
            // title
            title.innerHTML = result.titleNoFormatting;
            var newImg = document.createElement('img');

            // There is also a result.url property which has the escaped version
            newImg.src = result.tbUrl;


            imgContainer.appendChild(title);
            imgContainer.appendChild(newImg);

            // Put our title + image in the content
            contentDiv.appendChild(imgContainer);
          }

          // Now add links to additional pages of search results.
         addPaginationLinks(imageSearch);
        }
      }

      function OnLoad() {

        // Create an Image Search instance.
        imageSearch = new google.search.ImageSearch();

        // Set searchComplete as the callback function when a search is
        // complete.  The imageSearch object will have results in it.
        imageSearch.setSearchCompleteCallback(this, searchComplete, null);

        // Find me a beautiful car.
        imageSearch.execute("cake");

        // Include the required Google branding
        google.search.Search.getBranding('branding');
      }
      google.setOnLoadCallback(OnLoad);

    </script>

  </head>
  <body style="font-family: Arial;border: 0 none;">
  <input type="hidden" id="txtHidden" runat="server" />
  <input type ="text" id="TxtSearch" runat ="server" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <form id="Form1" runat="server"><asp:Button ID="btnsearch" Text="search" runat="server" /></form>
    <div id="branding"  style="float: left;"></div><br />

    <div id="content">Loading...

    </div>

  </body>
</html>
Posted
Updated 12-Jun-11 19:37pm
v2
Comments
Dave Kreskowiak 10-Jun-11 9:29am    
I fail to see how this is a VB.NET question.
Sergey Alexandrovich Kryukov 10-Jun-11 13:59pm    
Change the tag! Tag correctly.
--SA

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900