when call user control from from asp.net page it call only csharp not call jquery or java script function?

Question

I work on asp.net project I face issue when call web user control from asp.net page it calling

success but script JavaScript or jQuery not called

so why scripts not called

only from debug page load user control only called on index.asp.net page

so function script jQuery GET_ITO_PROJECTS_DASHBOARD not called or run why

only page load event c# of user control that called but script functions java script not called

index.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/WebPages/main.Master" AutoEventWireup="true" CodeBehind="index.aspx.cs" Inherits="ITO.WebPages.index" EnableEventValidation="false" %>

<%@ Register Src="~/WebUserControls/UC_ProjectsDashboard.ascx" TagPrefix="uc2" TagName="UC_ProjectsDashboard" %>


<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <uc2:UC_ProjectsDashboard runat="server" />
</asp:Content>

user control UC_ProjectsDashboard.ascx

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UC_ProjectsDashboard.ascx.cs" Inherits="ITO.WebUserControls.UC_ProjectsDashboard" %>
<div class="row">
    <div class="col-12">
        <div id="card-main_Index" class="card customCard card-outline-primary">
   
                     <div class="card-header">
                <h4 class="m-b-0 text-white card-title text-center">
                    <label id="lblTitle" runat="server" clientidmode="Static">Project Dashboard</label>
                </h4>
            </div>
             
                        <div class="card-body">

                         
                             
                        
                          
                              
                              
                               <div class="row" style="margin-top:10px;">
                             
                                <div class="col-12 col-lg-1">
                        
                                       </div>
                                   <div class="col-12 col-lg-5 gvResultmeeting-container hide">
                                    <div class="form-group">
                                          <div class="card card-outline-success">
                                            <div class="card-header" style="background-color: #808080; font-size: 18px; padding: .75rem 1.25rem; font-weight: 600; height: 50px; color: #ffffff;">
                                              الاجتماعات التمهيديه
                                            </div>
                                            <div class="card-body">
                                                <table id="gvResultmeeting" class="table table-striped table-hover table-bordered">
                                                    <thead>
                                                    </thead>
                                                    <tbody>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                               
                        
                                <div class="col-12 col-lg-5  gvResultrequests-container hide">
                                    <div class="form-group">
                                        <div class="card card-outline-success">
                                            
                                                  <div class="card-header" style="background-color: #ffcc00; font-size: 18px; padding: .75rem 1.25rem; font-weight: 600; height: 50px; color: #ffffff;">
                                           الرد على الاستفسارات
                                            </div>
                                            <div class="card-body">
                                                <table id="gvResultrequests" class="table table-striped table-hover table-bordered">
                                                    <thead>
                                                    </thead>
                                                    <tbody>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                   <div class="col-12 col-lg-1">
                     
                                       </div>
                            </div>
                              <div class="row" style="margin-top:10px;">
                             
                                
                                   <div class="col-12 col-lg-12">
                                    <div class="form-group">
                                          <div class="card card-outline-success">
                                            <div class="card-header" style="font-size: 18px; padding: .75rem 1.25rem; font-weight: 600;color: #ffffff;">
                                              المشروعات
                                            </div>
                                            <div class="card-body">
                                                <table id="gvResultprojects" class="table table-striped table-hover table-bordered">
                                                    <thead>
                                                    </thead>
                                                    <tbody>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                        
                             
                            </div>

                            </div>

                   
                
                </div>
            </div>
        </div>




<script>
    $(function () {
        debugger
        if ($("#txtP_PERM_ID").val() == "2059") {
            GET_ITO_PROJECTS_DASHBOARD();
        }
       
    });
</script>

Answer 1

Hi @ahmed salah,

The reason it doesn't work is that the ID changes during page compilation.

There are two ways to fix this.

First: add ClientIdMode="Static" to the TextBox.

<asp:TextBox ID="txtP_PERM_ID" runat="server" ClientIDMode="Static"></asp:TextBox>  

Second: use if ($("[id$='txtP_PERM_ID']").val() == "2059") .

<script>
    $(function () {
        debugger        
        if ($("[id$='txtP_PERM_ID']").val() == "2059") {
            GET_ITO_PROJECTS_DASHBOARD();
        }
       
    });
</script>

Best regards,
Lan Huang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.