0

How to show facebook video using javascript ajax ?

I use this code

For test , When load index.php finished. Fill this link into input type text

https://www.facebook.com/cnnmoney/videos/10155036777533067/

Please wait a minute. You will see facebook video.

Then clear value in input type text and fill this link into input text again

https://www.facebook.com/cnn/videos/10157334882996509/

I want to know why not show facevook video on second time ?

index.php

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script>
function updateInput_url_internal(urlvalue) {
    var urlvalue = urlvalue.toLowerCase();
    var urlvalue_val = urlvalue.trim();
    document.getElementById('facebook_post_url').value = urlvalue_val;
    show_post_preview_fn();
}
</script>

<form id="show_post_preview_fid" method="POST" action="" style=" display: none; ">
<input name="facebook_post_url" type="text" id="facebook_post_url">
</form>

<script>
function show_post_preview_fn(){
    $.ajax
    (
        {
            url: 'ajax_do.php',
            type: 'POST',
            data: $('#show_post_preview_fid').serialize(),
            cache: false,
            success: function (data) {
                $('#mySpan_url_internal').show();
                $('#mySpan_url_internal').html(data);
            }
        }
    )
}
</script>

<p style="margin-bottom: 20px;">
<input type="text" onchange="updateInput_url_internal(this.value)">
<br>
<span id="mySpan_url_internal" style=" width: 100%; float: left; margin-left: 12px; ^margin-left: 0px; font-size: 12px; color: red; margin-bottom: 10px; "></span>
</p>

ajax_do.php

<?PHP
session_start();
include("connect.php");
$facebook_post_url_val = mysqli_real_escape_string($db_mysqli,$_POST['facebook_post_url']);

if(stripos($facebook_post_url_val, "facebook.com") !== false AND stripos($facebook_post_url_val, "/videos/") !== false)
{
    $facebook_post_url_val_find_fb_id = rtrim($facebook_post_url_val, '/');
    $facebook_post_url_val_find_fb_id = $facebook_post_url_val_find_fb_id."/";
    $facebook_video_id = array_slice(explode('/',$facebook_post_url_val_find_fb_id),-2,1)[0];
    $facebook_video_id = str_replace("/","",$facebook_video_id);
}
?>

<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId      : '{117368861736328}',
            xfbml      : true,
            version    : 'v2.10'
        });

        // Get Embedded Video Player API Instance
        var my_video_player;
        FB.Event.subscribe('xfbml.ready', function(msg) {
            if (msg.type === 'video') {
                my_video_player = msg.instance;
                my_video_player.unmute();
            }
        });
    };


  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

<div class="fb-video" data-href="https://www.facebook.com/cnn/videos/<?PHP echo $facebook_video_id; ?>/"  data-width="500" data-show-text="true" data-allowfullscreen="true" style=" border: none; overflow:hidden; width: 100%; text-align: center; position: relative; float: left; "></div>

0 Answers0