Call JavaScript function on Button click event in ASP.Net

Last Reply on Jan 05, 2017 05:35 AM By dharmendr

Posted on Jan 04, 2017 04:20 AM

Selecting video on Datalist and displaying it on  Model Pop UP showing Error

 

Server Error in '/' Application.
Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS0123: No overload for 'OpenVideoLink_Click' matches delegate 'System.EventHandler'

Source Error:


Line 460:</asp:PlaceHolder>
Line 461:   
Line 462:        <asp:LinkButton ID="OpenVideoLink" runat="server"  OnClick="OpenVideoLink_Click"  CommandName="Details" 
Line 463:                            CommandArgument='<%#DataBinder.Eval(Container.DataItem,"Id") %>'>
Line 464:             <asp:Panel ID="hidIfVideoNULL" runat="server">

 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script type='text/javascript'>
        function openModal() {
            $('#myModal').modal('show');
        }

        </script>



MODAL
----------

<asp:UpdatePanel ID="UpdatePanel2" runat="server">
                    <ContentTemplate>
                       
                <asp:FormView ID="GETVIDEO" runat="server" CssClass=" table table-bordered table-striped table-hover">
                    <ItemTemplate>
  <div class="  "    >
            <div class=" modal fade" id="myModalvideo" tabindex="-1" role="dialog" aria-labelledby="myModal9tBLabel" aria-hidden="true" style="background-color:#000000">
              <div class="modal-dialog modal-lg" style="background-color: #000000">
                <div class="modal-content" style="background-color: #000000">
                  <div class="modal-header" style="border: 1px solid #000000; background-color: #000000">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" style="color: #DADADA">Playing</h4>
                  </div>

                   
                        <!-- Conversations are loaded here -->
                      <asp:Panel ID="panel1" runat="server">

                           
  <video  controls poster=""   style="width:100%; background-color: #CCCCCC;"    >




      <source src="<%# Eval("Path") %>" type="video/mp4" >





&nbsp;<source src="<%# Eval("Path") %>" type="video/webm">






      <track kind="captions" label="English captions" src="/path/to/captions.vtt" srclang="en" default>





      <!--  <a href="https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.mp4">
                       Download</a>-->













  


                </video>
   
  </asp:Panel>

                                                <h5 class="media-heading">
                                                    <asp:Label ID="Label2" runat="server" Text='<%#Eval("Title")%>' Font-Bold="True " ForeColor="#666666" />
                                                 <asp:ImageButton ID="ImageButton2" runat="server" Height="60px" ImageUrl='<%# Eval("Path") %>' Width="95px"/>
                                                    <asp:TextBox ID="TextBox1" runat="server" Text='<%#Eval("Description")%>' ></asp:TextBox>

                                                    <div class="clearfix">
                                                    </div>
                                                </h5>

                                               
                    




                  <div class="modal-body">
                    <p>One fine body&hellip;</p>
                  </div>
                  <div class="modal-footer">
                      <asp:LinkButton ID="LinkButton11" runat="server" class=" pull-right " data-dismiss="modal">Close</asp:LinkButton>
                   
                   
                  </div>
                </div><!-- /.modal-content -->
              </div><!-- /.modal-dialog -->
            </div><!-- /.modal -->
          </div><!-- /.example-modal -->

</ItemTemplate>
                </asp:FormView>
                </ContentTemplate>
                    <triggers>
                     <asp:PostBackTrigger ControlID="GetMergedAll" />  
                     </triggers>
                </asp:UpdatePanel>


 

protected void Page_Load(object sender, EventArgs e)
    {

        if (!this.IsPostBack)
    {
        if (!this.IsPostBack)
        
            {
                username = this.Page.User.Identity.Name;
             
                DataTable dt = GetProfile();
                               
                        GetMergedAll.DataSource = dt;
                ViewState["DataTable"] = dt;
                GetMergedAll.DataSource = dt;
                GetMergedAll.DataBind();              
              
               // if (dt.Rows.Count > 0)
                {
                    
                }
            }
        }
      
    }
    public DataTable GetProfile()
    {
        SqlConnection constr = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
        SqlDataAdapter adp = new SqlDataAdapter("GetUserPOSTS", constr);
    adp.SelectCommand.CommandType = CommandType.StoredProcedure;
   // adp.SelectCommand.Parameters.AddWithValue("@Email", username);
    adp.SelectCommand.Parameters.AddWithValue("@UserName", username);
    adp.SelectCommand.Parameters.AddWithValue("@Id", Id);
    DataTable dt = new DataTable();
        //
    adp.Fill(dt);
    return dt;

        
    }

        }

        protected void OpenVideoLink_Click(object sender, ImageClickEventArgs e)
    {
        ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "openModal();", true);
    }

    protected void GetMergedAll_RowCommand(object sender, GridViewCommandEventArgs e)
    {
        if (e.CommandName == "Details")
        {

            int index = Convert.ToInt32(e.CommandArgument);
            DataTable dt = (DataTable)ViewState["DataTable"];
            IEnumerable<DataRow> query = from i in dt.AsEnumerable()
                                         where i.Field<int>("Id").Equals(index)
                                         select i;
            DataTable detailTable = query.CopyToDataTable();
            GETVIDEO.DataSource = detailTable;
            GETVIDEO.DataBind();

        }
    }



 

<asp:UpdatePanel ID="updResult" runat="server" UpdateMode="Conditional">
     
                <ContentTemplate>
                 
      
 <asp:DataList ID="GetMergedAll" runat="server" DataKeyName="Id" OnItemCommand="GetMergedAll_ItemCommand"   OnItemDataBound="GetMergedAll_ItemDataBound">        
    <ItemTemplate>

 <asp:LinkButton ID="OpenVideoLink" runat="server"  OnClick="OpenVideoLink_Click"  CommandName="Details" 
                            CommandArgument='<%#DataBinder.Eval(Container.DataItem,"Id") %>'>
             <asp:Panel ID="hidIfVideoNULL" runat="server">
         <video  controls poster=""   style="width:100%; background-color: #CCCCCC;" >

 <source src="<%# Eval("Path") %>" type="video/mp4" >

 <source src="<%# Eval("Path") %>" type="video/webm">
 <track kind="captions" label="English captions" src="/path/to/captions.vtt" srclang="en" default>

             </video>
                  </asp:Panel>
            </asp:LinkButton>
   
     </ItemTemplate></asp:DataList></ContentTemplate></asp:UpdatePanel>
           

 

You are viewing reply posted by: dharmendr on Jan 05, 2017 05:35 AM.
Posted on Jan 05, 2017 05:35 AM

Create different function with different name and call accordinglly in button click.

<script type='text/javascript'>
     function openModal9t() {
        $('#myModal9t').modal('show');
     }
     function openModalVideo() {
        $('#myvideo').modal('show');
     }
</script>

And call in button click like below.

protected void OpenImageLink_Click(object sender, EventArgs e)
{
   ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "openModal9t();", true);
}

protected void OpenVideoLink_Click(object sender, EventArgs e)
{
    ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "openModalVideo();", true);
}