Sharepoint application page and javascript

Question

Dear members

I had the following problem

I declared this jascript block on a application page as follows

<script  language="javascript">
    function Valida()
    {
     var panel = document.getElementById('pnlWorkflowInfraEstruturaOrgaoRH');

     if(panel.style.visibility = 'visible')
    {
         alert('panel visible');
         return false;
    }
    else
    {
         alert('panel not visible');
         return false;
     }

  
     return true;
    }
</script>

<asp:ImageButton ID="btnEnviar" OnClientClick="return Valida();" OnClick="btnEnviar_Click" CssClass="mt10 fr" runat="server" ImageUrl="/_layouts/images/Redecard/btn_enviar.gif" />


The function is not working and the error shows that the variable "panel" declared in the function is not and it´s not picking the panel ID. I would like to know why??

Regards

Rodolfo

---

rsoares

Answer 1

Can you include the markup for the panel?

---

My SharePoint Blog - http://www.davehunter.co.uk/blog

Answer 2

Here´s the markup for the panel

<asp:Panel ID="pnlWorkflowInfraEstruturaOrgaoRH" runat="server">
        <div class="box_padrao box02 bx_not mt10">
            <div class="head_out"><div class="head_in"></div></div>
            <div class="bod_out">
                <div class="bod_in overflow">
                <h5 class="ca">Aprovações:</h5>             
                    <div>
                        <table cellpadding="0" cellspacing="10" class="destinatario">
                            <tr>
                                <td class="bb0 tl"><b>Gestor responsável (alçada mínima gerente):</b></td>
                            </tr>
                            <tr>
                                <td class="bb0">
                                <tesla:ListSelector runat="server" ID="lselGestorAprovacao" CssClass="ListSelector1" ResultColumnCodeText="Funcional" ResultColumnValueText="Nome" earchBoxFieldText="Nome:" SearchBoxTitle="Selecione um funcionário" />
                                </td>
                            </tr>
                        </table>
                    </div>                   
                </div>
            </div>
            <div class="fot_out"><div class="fot_in"></div></div>
        </div>
        </asp:Panel>

---

rsoares

Answer 3

Hi,

After rendering the control's client ID might be different, hence the Javascript is not able to find it.

In the page that you have the panel, open in the browser and do a "View Source". Get to know the ID of the panel element now. Give this id in the Javascript

var panel = document.getElementById('ID from the view source');


Place the debugger in the javascript / put alerts to check if the javascript is able to find the panel

hope this helps

---

Raghavan

Answer 4

Hi,

See after rendering server side control's id has changed so you will not get such way.

try like this:

option1:  

var panel = document.getElementById("<%= pnlWorkflowInfraEstruturaOrgaoRH.ClientID %>");  //recommended and best way

or 

option2:

go to view source of that page and find this panel and copy the id value and 

var panel = document.getElementById("hard coded id value");   //not recommended

feel free to ask more...

---

--- Arup R(MCTS) Success does not Matter.

Answer 5

Good morning Arup

I did this

var panel = document.getElementById('<% pnlWorkflowInfraEstruturaOrgaoRH.ClientID %>');
       
        if(panel != null)
        {
            alert('pegou ID');
            return false;
        }
        else
        {
            alert('Não pegou ID');
            return false;
        }

then I build my project and I deployed the solution

I get this error

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\template\layouts\RedecardAppPages\Intranet\SolicitacaoToken.aspx(34): error BC30545: Property access must assign to the property or use its value.   at System.Web.Compilation.AssemblyBuilder.Compile()    at System.Web.Compilation.BuildProvidersCompiler.PerformBuild()    at System.Web.Compilation.BuildManager.CompileWebFile(VirtualPath virtualPath)    at System.Web.Compilation.BuildManager.GetVPathBuildResultInternal(VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile)    at System.Web.Compilation.BuildManager.GetVPathBuildResultWithNoAssert(HttpContext context, VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile)    at System.Web.Compilation.BuildManager.GetVirtualPathObjectFactory(VirtualPath virtualPath, HttpContext context, Boolean allowCrossApp, Boolean noAssert)    at System.Web.Compilation.BuildManager.CreateInstanceFromVirtualPath(VirtualPath virtualPath, Type requiredBaseType, HttpContext context, Boolean allowCrossApp, Boolean noAssert)    at System.Web.UI.PageHandlerFactory.GetHandlerHelper(HttpContext context, String requestType, VirtualPath virtualPath, String physicalPath)    at System.Web.UI.PageHandlerFactory.System.Web.IHttpHandlerFactory2.GetHandler(HttpContext context, String requestType, VirtualPath virtualPath, String physicalPath)    at System.Web.HttpApplication.MapHttpHandler(HttpContext context, String requestType, VirtualPath path, String pathTranslated, Boolean useAppConfig)    at System.Web.HttpApplication.MapHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute

Once I remove the javascript declarion. My application page works as normal..any thoughts

Regards

Rodolfo

---

rsoares

Answer 6

Hi Arup

I eventually found out the problem

using option 2 because all controls are inside the content place holder "PlaceHolderMain"

var panel = document.getElementById('ctl00_PlaceHolderMain_pnlWorkflowInfraEstruturaOrgaoRH');

Is there any workaround to use option 1 in this scenario

Regards

Rodolfo

---

rsoares

Answer 7

Hi,
I can explain it better if you let me know the details about what are you tryin to do?

If you place panel directly inside sharepoint page by designer then you can not use option 1. if you develop your own webpart or user control then positively you can use option 1 and then it will work also.

---

--- Arup R(MCTS) Success does not Matter.