在jquery中，调用用户定义的函数在google chrome中有效，但在mozilla中则无效

I am trying to call a user defined function in jquery after ajax call,

function required to be called : downloadCurrentKey()

My requirement is after click of "generate_billing_key", function downloadCurrentKey() should automatically called, and when I click on label, at that time also function should be called.

It is working well in google chrome, but not in Mozilla Firefox.

Following is js code, Please guide me.

    $(document).on('click', '#generate_billing_key', function(){
    var url = $('#hdGenerateBillingKeyPair').val();


    $.post(url, {


    }, function (data) {

        var obj = JSON.parse(data);
        content="<label id='btn_download_billing_key'>
                      Click here to download key</label>";;

        $("#newKeyDiv").html(content);
        downloadCurrentKey();
    });
});


$(document).on('click', '#btn_download_billing_key', function(){
    downloadCurrentKey();
});

function downloadCurrentKey(){
    var url=$('#hdDownloadBillingKeyPath').val();
        my_form=document.createElement('FORM');
        my_form.name='myForm';
        my_form.method='POST';
        my_form.action=url;
        my_form.submit();
}

The code of url is as below

/**
 * @Route("/downloadBillingKey",name="download_billing_key")
 * @Template()
 */
public function downloadBillingKeyAction(Request $request) {
    $file_name="key";
    $file_content="";

    header("Content-type: plain/text");
    header("Content-Disposition: attachment; filename=$file_name.txt");
    header("Pragma: no-cache");
    header("Expires: 0");
    echo $file_content;
    die;
}

Thank you.

You didn't posted all of your code didn't you?

I'm telling that because I tried to simulate your code here and it only worked when I done this:

In your exemple, the js code you are posting nothing.

Everything after var obj = JSON.parse(data); (like the $("#newKeyDiv").html(content) appear only if exist data to parse.

On this line content="<label id='btn_download_billing_key'>Click here to download key</label>";; there is two ;

And maybe the most important is that maybe you should append the form in the page. Try this:

function downloadCurrentKey(){
    var url=$('#hdDownloadBillingKeyPath').val();

    // Get the element that will recive the form
    my_tag=document.getElementById("someID");

    my_form=document.createElement('FORM');

    // Append the form in the page before you post
    my_tag.appendChild(my_form); 

    my_form.name='myForm';
    my_form.method='POST';
    my_form.action=url;
    my_form.submit();
}

Your page must have something like:

<p id="someID"></p>

I hope it helps you anyway.

In this way, I reached the solution.

-Removed function downloadCurrentKey() from js file

-Added a form in twig file (instead of calling above function, I call submit event of this added function)

-code in controller remains same.

Code for js

 $(document).on('click', '#generate_billing_key', function(){
            var url = $('#hdGenerateBillingKeyPair').val();

            $.post(url, {

            }, function (data) {

            var obj = JSON.parse(data);
           content="<label id='btn_download_billing_key'>
                      Click here to download key</label>";;

                 $("#newKeyDiv").html(content);
                $("#downloadFile").submit();
            });
        });    
    });


$(document).on('click', '#btn_download_billing_key', function(){
    $("#downloadFile").submit();
});

Code for twig

<form method="post" action="{{ path('download_billing_key') }}" id="downloadFile" />
</form>