Question

I have an IFrame embedding a youtube video. I want to create a textbox where user (admins) can paste a new src (URL) of video and the IFrame take the new source. Here is what I have so far:

protected void Edited_Click(object sender, EventArgs e)
    {
       // HtmlControl frame1 = (HtmlControl)this.FindControl("frame1");
        string url = TextBox1.Text;
        frame1.Attributes["src"] = url;

    }

And in the html code is the Iframe:

<div id="video">
    <iframe title="YouTube video player" runat="server" width="420" 
            frameborder="1" style="height: 265px; float: left; 
            text-align: center;" id="frame1" 
        name="frame1" align="middle"></iframe>
       <br />
       </div>

I don’t set any src in the beginning but when I paste a URL in the textbox and hit the button, the Iframe doesn’t displays anything.

Answer 1

You need to do this on the client browser, not server-side. I would suggest something like:

// (Add inside script element in head of page html)

window.onload = function() {
    document.getElementById('<id of input>').onchange = function() {
        changeFrameUrl();
    }
};

function changeFrameUrl() {
        var inputVal = document.getElementById('<id of input>').value;
        document.getElementById('<id of iframe>').src = inputVal;
}

Hope this helps – it’s off the top of my head though, so don’t diss me if it doesn’t work first time!