wee493 Posted July 13, 2010 Share Posted July 13, 2010 I'm working on a google chrome plugin for my url shortener. It use jquery + ajax to get the url of my api page. For example: site.com/api.php?d=http://google.com It's working fine, but I want users to be able to specify a custom url where the plugin gets user input from a text form, the gets a url like the following site.com/api.php?custom=test&d=http://google.com Here is the code, the function named redo is the one that's giving me trouble. It's running the function, but not querying the ajax call. <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script> window.addEventListener("load", windowLoaded, false); function windowLoaded() { chrome.tabs.getSelected(null, function(tab) { var url = tab.url; $('#result').load('http://twi.im/api/api.php?type=chrome&d=' + replace_multiple(tab.url)); }); } function redo(){ document.getElementById('body').style.backgroundColor = '#CCC'; //document.getElementById('url').innerHTML = 'Custom: ' + document.getElementById('custom-val').value; $('#short').load('http://twi.im/api/api.php?custom=' + document.getElementById('custom-val').value + '&d=' + replace_multiple(tab.url) + short.value); } </script> <style> body { width: 250px; overflow: hidden; } img { vertical-align:middle; } .result { width: 250px; height: 60px; } </style> </head> <body id="body"> <div class="header"> <img src="http://www.bigroncoleman.com/Pages/twitter-logo.gif" width="250px" border="0"> </div> <div id="result" class="result"> <center><strong>Loading...</strong></center> </div> <script> function custom(){ document.getElementById('custom-lable').style.display = 'inline'; document.getElementById('custom-input').style.display = 'inline'; document.getElementById('custom-submit').style.display = 'inline'; document.getElementById('cust').style.display = 'none'; } function replace_multiple(str){ var str = str; str = str.replace(/&/gi, "%26"); str = str.replace("?", "%3F"); return str; } </script> <script type="text/javascript"> function trackButton(name) { _gaq.push(['_trackEvent', name, 'clicked']); }; </script> </body> </html> You should not need this, but Here is the returned page from api.php <table border="0"> <tr> <td width="25%" align="right">URL:</td> <td><input type="text" value="http://twi.im/<?PHP echo $url; ?>" onClick="this.select();" id="short" readonly="readonly" /></td> </tr> <tr> <td colspan="2" align="center" id="cust"><a href="#custom" onClick="custom(); trackButton('Custom');">Custom URL?</a></td> <td id="custom-lable" style="display: none;">Custom:</td> <td id="custom-input" style="display: none;"><input type="text" name="custom" id="custom-val"></td> </tr> <tr> <td colspan="2" id="custom-submit" style="display: none;" align="center"><input type="submit" onclick="redo(); return false;" value="Update" /></td> </tr> </table> <script> var short = document.getElementById('short').select(); document.execCommand('Copy'); window.getSelection().removeAllRanges(); </script> Link to comment https://forums.phpfreaks.com/topic/207655-trouble-with-google-chrome-plugin/ Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.