CODEWITHSUNDEEP
phpjquery
programmer
programmer

Reputation: 167

Pass value to dialog modal

I am using multiple buttons (dynamic) that opens a single div:

<div class="dialog" title="Player">
    <p>YouTube Player here</p>
</div>



and at the header I am using: 

<script>
    $(function() {
        $(".dialog").dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "blind",
                duration: 1000
            }
        });

        $(".opener").click(function() {
            $(".dialog").dialog("open");
        });
    });
</script>



I get the buttons use like this: 

foreach ($ytObject->RKT_requestResult->entry as $video) {
    return = $ytObject->parseVideoRow($video);
    $delimiter = "**";
    $VideoContent = explode($delimiter, $return);
    if ($count % 2 == 0) {
        echo "<div class=\"ResultEven\">";
        echo "<button class=\"opener btn\" class=\"btn\">Play</button>&nbsp;";
        echo "<a href = \"" . $VideoContent['0'] . "\" class=\"btn\">Download</a>&nbsp;";
        echo $VideoContent['6'];
        echo "</div>";
    } else {
        echo "<div class=\"ResultOdd\">";
        echo "<button class=\"opener btn\" class=\"btn\">Play</button>&nbsp;";
        echo "<a href = \"" . $VideoContent['0'] . "\" class=\"btn\">Download</a>&nbsp;";
        echo $VideoContent['6'];
        echo "</div>";
    }
    $count++;
}




I want to get the value of $VideoContent['0'] as the pop-up content of <div class="dialog" title="player"> so that I can put the YouTube video directly on the modal.

Upvotes: 1

Views: 1011

Answers (2)

programmer
programmer

Reputation: 167

I have done it. Function that I have used is:

<script>
    $(function() {
        $(".dialog").dialog({
            width: 450,
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "blind",
                duration: 1000
            }
        });
        $(".opener").click(function() {
            var video = $(this).siblings("a").attr("href");
            var VideoId = video.replace('http://www.youtube.com/watch?v=', '');
            var VideoId = VideoId.replace('&feature=youtube_gdata', '');
            var youtube = "<embed width=\"420\" height=\"345\" src=\"http://www.youtube.com/v/" + VideoId + "\" type=\"application/x-shockwave-flash\"> </embed>";
            $(".dialog").dialog("open").html(youtube);
        });
    });
</script>

And the link/button to open it is

<button class="opener btn" class="btn"><img src="img/Play-icon.png" alt="play" />&nbsp;Play</button>

echo "<a href = \"" . $VideoContent['0'] . "\" class=\"\"></a>&nbsp;";

May be a bit silly or tricky :P But working properly! ^_^

Actually the buttons come in a loop. So, I have used the buttons to show the modal and a blank href to get the value. That's it. :)

Upvotes: 1

Code Lღver
Code Lღver

Reputation: 15603

Use the following code to get the value:

 $(".opener").click(function() {
     var video =  $(this).siblings("a").attr("href");
     alert(video); //here video will have the value of $VideoContent['0']
     $(".dialog").dialog("open");
 });

Upvotes: 2

Related Questions