Basic FBJS in an FBML Facebook application - facebook

I have tried just about every suggestion known to man to get the basic FBJS working in my FBML app.
Here is my code
<script>
<!--
function areyousure(description,id,opt) {
debugger;
var dialog = new Dialog(Dialog.DIALOG_POP).showChoice('Are you sure?','Are you sure you want to delete "' + description + '"? This action cannot be undone!','Yes','No');
dialog.onconfirm = function() {
document.setLocation("http://apps.facebook.com/myapp/delete.php?rec
ord=" + id + opt);
}
}
//-->
</script>
<a href="#" onclick="areyousure(arg1,arg2,arg3);" >click me</a>
When I click the link, I get a a1234543_areyousure not found.
Help Please.
Thanks

I think you are messing a ";" in a href :
<a href="#" onclick="areyousure(arg1,arg2,arg3);" >click me</a>

The parameters didn't exist. This works:
<script>
<!--
function areyousure() {
var dialog = new Dialog(Dialog.DIALOG_POP)
dialog.showMessage('test','foo');
}
//-->
</script>
<a href="#" onclick="areyousure();" >click me</a>

Related

Use code captcha in two forms

I have two forms on a page containing Google captcha code, but only one code works. Does anyone know if you can use the same code with the same key on two forms on the same page?,
Thks,
Yes, you can. But you have to explicitly render the widget as mentioned on the developer guide
you should use something like this on your front end(taken from the developer guide):
<html>
<head>
<title>reCAPTCHA demo: Explicit render for multiple widgets</title>
<script type="text/javascript">
var verifyCallback = function(response) {
alert(response);
};
var widgetId1;
var widgetId2;
var onloadCallback = function() {
// Renders the HTML element with id 'example1' as a reCAPTCHA widget.
// The id of the reCAPTCHA widget is assigned to 'widgetId1'.
widgetId1 = grecaptcha.render('example1', {
'sitekey' : 'your_site_key',
'theme' : 'light'
});
widgetId2 = grecaptcha.render(document.getElementById('example2'), {
'sitekey' : 'your_site_key'
});
grecaptcha.render('example3', {
'sitekey' : 'your_site_key',
'callback' : verifyCallback,
'theme' : 'dark'
});
};
</script>
</head>
<body>
<!-- The g-recaptcha-response string displays in an alert message upon submit. -->
<form action="javascript:alert(grecaptcha.getResponse(widgetId1));">
<div id="example1"></div>
<br>
<input type="submit" value="getResponse">
</form>
<br>
<!-- Resets reCAPTCHA widgetId2 upon submit. -->
<form action="javascript:grecaptcha.reset(widgetId2);">
<div id="example2"></div>
<br>
<input type="submit" value="reset">
</form>
<br>
<!-- POSTs back to the page's URL upon submit with a g-recaptcha-response POST parameter. -->
<form action="?" method="POST">
<div id="example3"></div>
<br>
<input type="submit" value="Submit">
</form>
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer>
</script>
</body>
</html>
I just wanted a HTML snipped which I can insert multiple times, each time displaying another captcha. Also, I did not want to take care for specific IDs assigned to the containers, which would be very annoying when multiple formulars still appearing on one page will be designed and rendered independently. Here is my solution.
<div class="g-recaptcha"></div>
<script type="text/javascript"><![CDATA[
function renderCaptchas() {
var captchaNodes = document.getElementsByClassName('g-recaptcha');
for (var i = 0; i < captchaNodes.length; i++) {
var captchaNode = captchaNodes[i];
if (!captchaNode.captchaRendered) {
captchaNode.captchaRendered = true;
grecaptcha.render(captchaNode, {"sitekey": "YOUR_SITE_KEY"});
}
}
}
]]></script>
<script src="https://www.google.com/recaptcha/api.js?onload=renderCaptchas&render=explicit" async="async" defer="defer"></script>

For some reason this PHP doesn't take place after submitting a form

I have the following HTML +javascript form:
<script>
window.addEventListener("load", function() {
var form = document.getElementById("myform");
var link = document.getElementById("submit-link");
link.addEventListener("click", function(event) {
event.preventDefault();
form.submit();
}, false);
}, false);
</script>
<form action="" method="post" id="myform">
<a id="submit-link" href="http://www.google.com">Submit</a>
</form>
The following CSS code for design:
.ssd {
border: none;
background-color: transparent;
padding: 0;
cursor: pointer;
font-size:89%;
display:inline;
text-decoration: underline;
color: #00c;
}
And this PHP code:
if(isset($_POST['myform'])){
$xmla = new SimpleXMLElement('passwords/' . views . '.xml', 0, true);
$plus = $xmla->goodx;
$result = $plus + 1;
$xmla->goodx = $result;
$xmla->asXML('passwords/' . views . '.xml');
}
Now, Every time that the user clicks on the value "Click", the XML file is supposed to be updated with data, and then redirect to google.com. It works, but when the user places his mouse over the link, he sees the URL of my site, and not google's. any ideas how to solve it?
Use action="" and redirect to the right google.com page.
Look at the google.com URL to know how it works.
Edit:
To see the link in each browser, you will need to use a link and post the form with JavaScript:
<script>
window.addEventListener("load", function() {
var form = document.getElementById("myform");
var link = document.getElementById("submit-link");
link.addEventListener("click", function(event) {
event.preventDefault();
form.submit();
}, false);
}, false);
</script>
<form action="" method="post" id="myform">
<a id="submit-link" href="http://www.google.com">Submit</a>
</form>
This way, the user will see the google link and it will post to your PHP script.

Dojo Dialog error in Zend Framework

I'm trying to create a Dojo dialog in Zend Framework but I've run into some problems. My view code looks something like this:
<script type="text/javascript" src="<?= $this->baseUrl('/js/dojo-release-1.7.2/dojo/dojo.js')?>"
data-dojo-config="async: true" dojoConfig = "parseOnLoad: true">
</script>
<script>
require(["dijit/registry", "dojo/ready", "dojo/dom", "dijit/Dialog", "dijit/form/Form"],
function(registry, ready, dom, Dialog){
ready(function() {
createDialog = function(titleText, contentText) {
var node = dojo.byId("foobar");
var myDialog = new Dialog({ title:"From Source Node" }, node);
myDialog.show();
};
});
});
</script>
<body class="claro">
<div data-dojo-type="dijit/Dialog" id="foobar" title="Foo!" style="display: none">
<p>I am some content</p>
</div>
</body>
The button code that loads the dialog looks as follows:
<button name="btnDialog" id="dialogbtn" type="button" onclick='createDialog();'>Open</button>
The first time the button is clicked the dialog opens as expected, but once the dialog is closed and the button is clicked again, the dialog doesn't open and I get the following error in the console.
Tried to register widget with id==foobar but that id is already registered.
What am I doing wrong?
Thanks
Figured it out. I think the form wasn't parsing correctly because the dojo-config was incorrect. Changed the javascript code as follows:
<script type="text/javascript" src="<?= $this->baseUrl('/js/dojo-release-1.7.2/dojo/dojo.js')?>"
data-dojo-config="async: true, parseOnLoad:true">
</script>
<script>
require(["dijit/registry", "dijit/Dialog"], function (registry)
{
createDialog = function createDialog()
{
registry.byId("foobar").show();
}
});
</script>
and the div as follows:
<body class="claro">
<div class="dijitHidden">
<div data-dojo-type="dijit.Dialog" data-dojo-props="title:'Foo!'" id="foobar">
<p>I am some content</p>
</div>
</div>
</body>
and now the dialog dijit is saved to the registry and it's working as expected

Facebook Share Button on Main Page in Wordpress

I have this as my facebook share button on my "single.php" template in Wordpress:
<script>
function fbs_click() {
u=location.href;
t=document.title;
window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;
}
</script>
<style> html .fb_share_link { padding:0px;background:url(http://www.mydomain.com/images/compartir-fb.png) no-repeat top left; }</style>
I tried adding the same code to my "index.php" but it doesn't seem to work, when i click on the button, it instead shares my main website "www.mydomain.com" but I want it to share each individual article. So itried replacing:
"u=location.href;" to "u=<?php the_permalink() ?>"
but all it does it opens a new tab with www.mydomain.com
I am really trying to figure out where to place <?php the_permalink() ?>?
So itried replacing:
"u=location.href;" to "u=<?php the_permalink() ?>"
That should only give an error in your browser’s JavaScript console, since it is not valid JS syntax, because you neglected to put a text literal in string delimiters.
try to convert it as below ...
wp_reset_query();
if(is_home()){
$url = site_url();
}else{
$url = get_permalink();
}
<script>
function fbs_click() {
u='<?php echo $url;?>';
t=document.title;
window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;
}
</script>

JQTouch/PHP problem - function isn't firing

I'm very new to web development so forgive me for any obvious questions. I'm having trouble getting this function to work. I've been racking my brain for a while now.
I placed the php code in the url window and it displays the appropriate output so I know the php code is ok. I just can't get this function to display the query results into the "wine_categories" . Thanks in advance for all your help. Here's the code:
<script type="text/javascript">
var jQT = new $.jQTouch();
function showtype(type)
{
$('wine_categories').children().remove();
$.ajax({
type:"POST",
url:"get_winebot_type.php",
success:function(html){
$('#wine_categories').append(html);
jQT.goTo('#wine_list', 'slide');
}
});
return false;
}
</script>
Here's the <div>:
<div id="wine_list">
<div class="toolbar">
<h1>Categories</h1>
<a class="button back" href="#">Back</a>
</div>
<div id="wine_categories">
</div>
The most obvious mistake I can see is this line:
$('wine_categories').children().remove();
You missed a hash in front of the ID:
$('#wine_categories').children().remove();