Chamando a função JS no formulário Enviar

Question

Eu criei uma função JS que executa bem quando inclui uma ação 'OnClick' da tag HTML padrão da seguinte forma:

<a href="#" onclick="return fb_CheckPermission('publish_stream');">test</a>

No entanto, onde eu realmente quero usar essa função está na ação 'Onsubmit' de um formulário, mas quando eu a incluo da seguinte forma, a função não parece mais executar:

<form action="page.pl" id="disable-submit" name="status-form" method="POST" onsubmit="return fb_CheckPermission('publish_stream');">

O que a função 'fb_checkpermission ()' JS basicamente faz é usar o Facebook Connect para verificar para garantir que o usuário nos conceda uma permissão específica e, se não, ele informa ao Facebook Connect para solicitar ao usuário que conceda a permissão. Aqui está o código da função JS:

1. function fb_checkPermission(permission) {
2.  FB.ensureInit(function() {
3.      FB.Facebook.apiClient.users_hasAppPermission(permission, function (hasPermissions) {
4.          if(!hasPermissions){
5.              FB.Connect.showPermissionDialog(permission,function (status){
6.                  if(!status) {
7.                      if(permission == 'offline_access') {
8.                          // save session
9.                      }                       
10.                 }
11.             });
12.         }
13.     });
14. });
15.}

O que este código faz é o seguinte:

Line 2: Make sure Facebook Connect JS library is loaded
Line 3: Checks to see if the current Facebook Connect user has granted a specific permission
Line 5: If the permission hasn't been granted then prompt the user with the permission dialog
Line 7: In the case of the 'offline_access' permission save the session key once granted

A experiência do usuário que estou tentando alcançar é que, quando um usuário enviar o formulário, verificarei se eles concederam uma permissão específica e, se não for, solicitar a permissão antes de enviar o formulário. Se o usuário já concedeu a permissão, o formulário deve apenas enviar. Para os usuários que são solicitados, o formulário deve enviar depois de optar por conceder a permissão ou se negar a solicitação que eu acredito que a função JS fb_checkPermission () está lidando corretamente agora. O que não tenho certeza é se há algum tipo de problema de JavaScript com a forma como isso funciona no envio do formulário.

Como mencionei, essa função JS funciona perfeitamente como uma ação ONCLICK, mas falha como uma ação submetida, por isso tenho certeza de que isso tem algo a ver com a maneira como o JavaScript trata as ações submissíveis.

Estou preso, então eu realmente aprecio sua ajuda para descobrir como alterar a função JS para produzir minha experiência desejada do usuário. Agradeço antecipadamente por sua ajuda!

Answer 1

O motivo pelo qual o seu "clique em âncora" funciona é porque ele não altera sua página (localização) enquanto todas as chamadas assíncronas do Facebook terminam.

Quando você anexa a mesma função ao manipulador de envio, a função retorna antes que as coisas do Facebook sejam realmente executadas e, sem retornar "false", fazendo com que o formulário prossiga com o envio mais cedo do que você deseja.

O que você precisa fazer é retornar "falso" no final de sua função Onsubmit para evitar o envio e dar tempo às coisas do Facebook para terminar e depois enviar manualmente o formulário em lugares que você deseja que seja enviado ligando:

document.getElementById('disable-submit').submit();

(O manipulador não será chamado se o envio for acionado do script.)

Infelizmente, não tenho SDK no Facebook em mãos, então não posso escrever o código que tenho certeza de que funciona 100%, mas é algo nesse sentido:

function onSubmit () {
    doStuffAsynchronously(function () {
        if (everythingIsOK) {
            // proceed with submission
            document.getElementById('formId').submit();
        }
    });

    return false;
}

Answer 2

Tente colocar a chamada JavaScript na entrada que você está usando para iniciar o envio.

Answer 3

Penso basicamente que seu navegador tende a usar o formulário de validação padrão (página.pl / post do método) em vez de fazer o que você acha que ele tenta isso

<form action="page.pl" id="disable-submit" name="status-form"
      method="POST" onsubmit="returnFbChPermissionAndPreventDefaultAction();">
    <script type="text/javascript">
        var returnFbChPermissionAndPreventDefaultAction = function(){ 
           //prevent default
           if (event.preventDefault) { 
               event.preventDefault(); 
           } 

           //specific for IE
           valueOfreturn = fb_CheckPermission('publish_stream');
           event.returnValue = valueOfreturn;
           return event.returnValue ; 
        }
    </script>