I have several DIVs with z-indexes (like: z-index: 999991;). In Safari, this results that the Requests Dialog I have created appears behind some DIV's.
Is their a way to give the Requests Dialog a z-index or something so it will always appear on top of every DIV?
My Requests Dialog code:
<script src="http://connect.facebook.net/en_US/all.js"></script>
<p>
<input type="button"
onclick="sendRequestViaMultiFriendSelector(); return false;"
value="Send Request to Many Users with MFS"
/>
</p>
<script>
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'Join me on Mahjong Solitaire!',
exclude_ids: '<?php echo $friends_array; ?>'
}, requestCallback);
}
function requestCallback(response) {
// Handle callback here
}
</script>
Hope this is possible!
Made the z-index smaller and this indeed worked!
Related
Searched and browsed the forum and tried many examples of ajax and form submission but can't get anything close to work for what I am trying to achieve. I must admit I've been going in circles for days with this and need someone with a fresh pair of eyes.
I have 2 pages:
page1.php
page2.php
Using Google jquery/1.9.0/jquery.js and developing this locally.
page1.php is as follows (I've omitted the head script and body/html tags for clarity)
$(document).ready(function() {
$('#theForm').submit(function(){
$.ajax({
type: "POST",
url: "page2.php",
data: 'html',
success: function(html){
if(html == 'success'){
$('#address').fadeOut('slow');
$('#done').fadeIn('slow');
}else if(html == 'fail'){
alert('fail');
}
}
});
return false;
});
});
<div id="address">
<form action="page2.php" method="post" name="theForm">
<input name="checkname" type="text" id="checkname">
<input name="Proceed" type="submit" id="submit" value="Next Page" />
</form>
</div>
<div id="done">
That Worked!
</div>
Page2.php
Has a mysql query that checks the database for the checkname and echoes 'success' or ' fail' depending upon the result. The query runs fine and is not showing any error.
When the form is submitted page2.php loads and just shows 'success' in the browser.
Firebug also shows success under both response and html. There are no errors within firebug.
I basically want page1.php to stay and for the #address div to hide and the #done div to show when success is passed from page2.php
Hope someone can help.
Update
I tried this test page:
ajaxone.php
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#theForm').submit(function(){
$.ajax({
type: "POST",
url: "ajaxtwo.php",
data: 'html',
success: function(html){
if(html == 'success'){
$('#address').fadeOut('slow');
$('#payment').fadeIn('slow');
alert('ok');
}else if(html == 'fail'){
alert('fail');
}
}
});
return false;
});
});
</script>
<style type="text/css">
#payment{
visibility:hidden;
}
</style>
<div id="address">
<form action="ajaxtwo.php" method="post" name="theForm" id="theForm">
<p>
<input name="name" type="text" id="name">
</p>
<p>
<input type="submit" name="submit" value="submit">
</p>
</form></div>
<div id="payment">Name is correct</div>
ajaxtwo.php
print_r($_POST);
if($_POST['name'] == 'rob'){
echo 'success';
}else{
echo 'fail';
}
Using the above firebug shows the following error:
Array ( )
Undefined index: name
fail
However, when I remove the ajax call the submit works and the data is passed.
So, am I right to assume that if you do not specify the form variables within the ajax call nothing is posted to the next page?
Update 2
Sorry I'm answering myself here.
It does appear that you need to specify the form data to send within the ajax call.
I've just added:
$('#theForm').serialize();
within the ajax call and now the form submits without an error.
However, this still goes to ajaxtwo.php and does not show the success or fail on the ajaxone.php page.
So my next stage is to get the success or fail to show on ajaxone.php
You need to add id="theForm" in the form tag itself.
Example:
<form action="page2.php" method="post" id="theForm" name="theForm">
I would say, add a and then make jq read the output and then redirect accordingly, or use php to redict based on $success_fail result.
I want to send my Application invites to multiple random people in my friends list just as its done in majority of application.
For Instance
As soon as i Accept the application this pop up appears.What i cannot understand is how to get the ID's of these users ? On the Client Side ?
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<title>Request Example</title>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<p>
<input type="button"
onclick="sendRequestToRecipients(); return false;"
value="Send Request to Users Directly"
/>
<input type="text" value="User ID" name="user_ids" />
</p>
<p>
<input type="button"
onclick="sendRequestViaMultiFriendSelector(); return false;"
value="Send Request to Many Users with MFS"
/>
</p>
<script>
FB.init({
appId : '423165827708510',
frictionlessRequests: true,
});
function sendRequestToRecipients() {
var user_ids = document.getElementsByName("user_ids")[0].value;
FB.ui({method: 'apprequests',
message: 'My Great Request',
to: user_ids, /// How to Fill the ID's HERE ?
}, requestCallback);
}
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'My Great Request'
}, requestCallback);
}
function requestCallback(response) {
// Handle callback here
}
</script>
</body>
</html>
Why would you want to send to random users?
That doesn't make any sense - surely you'd invite the people you think will like the game?!
Confusion aside, to answer your question, the 'to' parameter is either an array, or a comma seperated list of user IDs.
Here's an example of CSV, taken from the documentation:
function sendRequestToRecipients() {
FB.ui({method: 'apprequests',
message: 'My Great Request',
to: '499802820,499802852'
}, requestCallback);
}
I'm trying to implement adaptive payments as embedded payment with lightbox.
It works fine until a user makes a payment, but after user completes the payment
page specified by return url gets loaded within the iframe.
I'm expecting it to be loaded in the window NOT in the iframe.
Following is the code that I have. Am I missing something?
Environment
Java(play framework)
PayPal_Platform_Java_SDK_N
Expected Page Transfer Scenario
PageA - ("pay with paypal" button click)
→ paypal dialog - ("close" button click)
→ PageB
PageA.html
<form action="https://www.sandbox.paypal.com/webapps/adaptivepayment/flow/pay" target="PPDGFrame">
<dl>
<dt></dt>
<dd>
<input id="type" type="hidden" name="expType" value="light">
<input id="paykey" type="hidden" name="paykey" value="AP-KEY">
<input type="submit" id="paypalSubmitBtn" value="Pay with paypal" />
</dd>
</dl>
</form>
<script type="text/javascript">
var dgFlow;
$(function(){
dgFlow = new PAYPAL.apps.DGFlow({ trigger: 'paypalSubmitBtn' });
});
</script>
PageB.html
<p>Thank you for your payment!</p>
<script type="text/javascript">
function handleEmbeddedFlow() {
if (top && top.opener && top.opener.top) {
top.opener.top.dgFlow.closeFlow();
}
else{
top.dgFlow.closeFlow();
}
top.close();
}
jQuery.event.add(window, "load", function(){
alert("window.load");
handleEmbeddedFlow();
});
</script>
I also noticed that dgFlow can not be resolved in else case's top.dgFlow.closeFlow(); in PageB.html.
You can try to detect if the page is running in an iframe, and if so redirect to the page directly.
How to detect:
How to identify if a webpage is being loaded inside an iframe or directly into the browser window?
How to redirect:
Redirect the parent page from IFrame
I would like to encourage my facebook app users to invite more friends to join the app. Therefore, I will let them freely use my app after they invite more than 50 friends (no matter their friends join the app or not is also ok).
But the problem is: how can I check the number of invitation sent by that users?
Thanks.
Rgds
there is no built in option in facebook for this.
I'm using the FB request dialog and whenever we send request facebook will return a set of request id's (in case of multiple simultaneous requests) .
And then just have your own table say 'tbl_requests' where you can update the current user_id with the request_id returned by the facebook dialog.. The advantage is that you can then backtrack these request_ids when the invited person accepts his invitation.
the sample code could be,
function invite(){
var receiverUserIds = FB.ui({
method : 'apprequests',
message: 'just a invite msg'
title: 'Select your friends to join the app',
},
function(receiverUserIds) {
if(receiverUserIds){
$.ajax({
type: "POST",
url: "your_file.php",
req_ids="+receiverUserIds.request_ids,
});
}
}
);
}
In your_file.php process your request_ids and store them on db and then whenever you want to count the no of request sent you can just query with the current user_id
just change your app id
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<title>Request Example</title>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<p>
<input type="button"
onclick="sendRequestToRecipients(); return false;"
value="Send Request to Users Directly"
/>
<input type="text" value="User ID" name="user_ids" />
</p>
<p>
<input type="button"
onclick="sendRequestViaMultiFriendSelector(); return false;"
value="Send Request to Many Users with MFS"
/>
</p>
<script>
FB.init({
appId : 'YOUR_APP_ID',
frictionlessRequests: true,
});
function sendRequestToRecipients() {
var user_ids = document.getElementsByName("user_ids")[0].value;
FB.ui({method: 'apprequests',
message: 'My Great Request',
to: user_ids,
}, requestCallback);
}
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'My Great Request'
}, requestCallback);
}
function requestCallback(response) {
console.log(response);
for (var i = 0; i < response.to.length; ++i)
{
alert(response.to[i]);
}
}
</script>
</body>
</html>
Hi Guys just wondering if you could help, I have a page in C# that should when a button is clicked show the friends dialog to send an information out to them to start using an application.
However I'm having a problem with FB.UI trying to get a modal iframe displaying of the friends list.
Basically it attempts to open the modal iframe it shows the blue facebook frame but no data then after 5 seconds it closes.
can any one help
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPages/Main.master" AutoEventWireup="true" CodeFile="CompetitionPanel.aspx.cs" Inherits="CompetitionPanel" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId: '123',
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true, // parse XFBML
session: '<%=CurrentSession.AccessToken %>'
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="body" Runat="Server">
<script>
function test() {
FB.ui({method: 'apprequests',
message: 'You should learn more about this awesome game.',
data: 'tracking information for the user',
display: 'iframe'
},
function (response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
return false;
}
</script>
<div id="fb-root"></div>
<div class="container">
<div class="left">
<h2>WANT TO WIN FREE KIT?</h2>
<p>
Suggest your friends. At the end of the week, you'll be entered into a prize draw to win free kit. The competition resets every week.
Simple.
</p>
<asp:Button runat="server" ID="btntest" OnClientClick="Javascript:test();"/>
</div>
<div class="right"></div>
</div>
</asp:Content>
Thanks in advance.
When I tested this code it looks like your button is doing a postback. so I changed
<asp:Button runat="server" ID="btntest" OnClientClick="Javascript:test();"/>
to
<asp:Button runat="server" ID="btntest" OnClientClick="return test();"/>
This stoped the postback from happening but the Dialog never populated just like you mentioned in your post.
I am not sure why but it looks like Facebook does not like the return false in your test function so I tried this
<asp:Button runat="server" ID="btntest" OnClientClick="Javascript:test();return false;"/>
and in the test function I commented out the retrun false.
//return false;
This worked but it was very slow to populate. After some testing it looks like the slowness was dew to the Script section that the function test was in was inside the asp form and on this page I had a script manager so I moved that script section outside the form and it populated a bit faster.
Hope this helps
Cheers