3

Hi i have following code where every thing is working fine... but when i try to add <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> </script> this library it is blocking all tabclicking and command button click functionlities...

 <apex:page standardController="case" extensions="RUnclaimedTicket" sidebar="false" tabStyle="case"  recordSetVar="search" >
        <head>
            <apex:includeScript value="{!URLFOR($Resource.jQuery, '/jQuery/js/jquery.js')}"  />
            <apex:includeScript value="{!URLFOR($Resource.jQuery, '/jQuery/js/advancedtable_v2.js')}"  />
            <apex:stylesheet value="{!URLFOR($Resource.jQuery, '/jQuery/css/advancedtable.css')}"  />
          </head>

            <! ----------when i add this jquery functionality all below tabs and command buttons stopped working --- >


        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> </script>

        <script>

        function checkedfield(nm, txt,field){


           if(document.getElementById(nm) != null){
            if(document.getElementById(nm).disabled == true){
                document.getElementById(nm).disabled = false;
                var check = $("input[id$=Checked_Item]").val();
                $("input[id$=Checked_Item]").val(field + check);
                check =  $("input[id$=Checked_Item]").val();

            }else{
                document.getElementById(nm).disabled = true;
                var check = $("input[id$=Checked_Item]").val();
                if(check.indexOf(field) != -1)
                    check = check.replace(field,'');
                $("input[id$=Checked_Item]").val(check); 

            }
           }

           if(document.getElementById(txt) != null){
            if(document.getElementById(txt).disabled == true){
                document.getElementById(txt).disabled = false;
                var check = $("input[id$=Checked_Item]").val();
                $("input[id$=Checked_Item]").val(field + check);
                check =  $("input[id$=Checked_Item]").val();
            }else{
                document.getElementById(txt).disabled = true;
                var check = $("input[id$=Checked_Item]").val();
                if(check.indexOf(field) != -1)
                    check = check.replace(field,'');
                $("input[id$=Checked_Item]").val(check); 
            }
           }

           return true;
        }

        </script> 


            <!----when i remove this above section everyting is working fine------------------->
    <!---But i need above functionality for further extension of my page functionality which will come here.
    <apex:form >
<apex:outputPanel rendered="{!updateselected}">
<apex:pageMessages />
<apex:inputHidden id="Checked_Item" value="{!Checked_Item}"/>
    <apex:pageBlock title="Bulk Change" mode="edit">

        <apex:pageBlockButtons location="both">
            <apex:commandButton value="Save" action="{!save}"/>
            <apex:commandButton value="Cancel" action="{!cancel}"/>

        </apex:pageBlockButtons>

        <apex:pageBlockSection id="mus1" columns="1">

            <apex:pageblocktable columns="3" value="{!$ObjectType.case.FieldSets.Assignto}" var="f">
                <apex:column headerValue="Update ">
                    <input type="checkbox" id="dis_{!f}" onclick="checkedfield('{!$Component.ipField}', '{!$Component.txtField}','{!f.fieldpath}')" />
                </apex:column>
                <apex:column headerValue="Fields">
                    <apex:outputLabel value="{!f.Label}" />
                </apex:column>
                <apex:column headerValue="Value">
                    <apex:inputField value="{!SMTPnew[f]}" id="ipField" styleclass="ipField{!f}"  rendered="{!IF(f.Type != 'string', true, false)}" required="false"/>
                    <script>
                     document.getElementById('{!$Component.ipField}').disabled = true;
                    </script>
                    <apex:inputText value="{!SMTPnew[f]}" id="txtField" styleclass="txtField{!f}" rendered="{!IF(f.Type == 'string', true, false)}"/> <!--- disabled="true"  --->
                    <script>
                     document.getElementById('{!$Component.txtField}').disabled = true;
                    </script>
                </apex:column>
            </apex:pageblocktable>

        </apex:pageBlockSection>

    </apex:pageBlock> 
    </apex:outputpanel>
</apex:form>
    ..--->
         <apex:form >  
         <apex:pageMessages ></apex:pageMessages> 
        <apex:outputPanel id="SearchOverridePanelId">
          <apex:pageBlock title="Unclaimed Ticket">
           <style>
        .activeTab {background-color: #B0E2FF; color:black;font-size:17px;
        background-image:none}
        .inactiveTab { background-color: lightgrey; color:black;font-size:17px;
        background-image:none}
        .background { background-color: lightgrey; font-size:12px; color:black}
        </style>  

             <apex:tabPanel id="theTabPanel" selectedTab="ONE1" tabclass="activeTab" inactivetabclass="inactiveTab" contentStyle="font-size: .01px;">    
                      <apex:tab label="Unclaimed Ticket" switchType="client" ontabenter="window.parent.location.replace('/apex/UnclaimedTicketPage');" name="One1"  id="One1"   >
                      </apex:tab>
                      <apex:tab label="Claimed Ticket" switchType="client" ontabenter="window.parent.location.replace('/apex/R_ClaimedTicketPage');" name="OpenActivities2"  id="tabOpenAct2"   >
                      </apex:tab>
                      </apex:tabPanel> 
        <BR/>
                  </apex:pageBlock>  
                  </apex:outputPanel>
                    <apex:pageBlock >  

              /*
              .
              .
              .    i will display data in a table here.
              .
              ..  /*




                    </apex:pageBlock>  

        </apex:form>
        <script>
               function testclick() {

                         $('input[id$=search_val]').val('');




                }
        $(document).ready(function() {


        });
                </script>
            <script type="text/javascript" language="javascript">


            if(jQuery) {
                jQuery.noConflict();
            }
            var $jq = jQuery.noConflict();
            function testrun() {
            cler();
            }
            $jq(document).ready(function() {
            $jq('[id$=claim_id]').click(function() {

            //$jq('window').location.reload(true);
            //
            });
            });
        </script>      

          </apex:page> 

can some one help me with reason for this.... when i remove above library and that block of code every thing is working fine but i cannot achieve further functionalities...

  • 1
    You should execute jQuery.noConflict(); immediately after you include the jQuery script file so the $ reference is restored to the value that existed before the script was included. But I didn't look at your page in detail so there may also be other problems. – Keith C May 23 '15 at 11:15
  • it works perfectly ... you saved my day....thank you – rajasekhar May 25 '15 at 14:13
3

You need to use the jQuery.noConflict() function. There are several ways of doing this, but one easy way is to use it to rename the variable that you use to refer to jQuery. Do it like this:

var j$ = jQuery.noConflict();

// Do something with jQuery (you'd normally use '$' here)
j$( "div p" ).hide();

With reference to your specific code, you'd write something like this:

var j$ = jQuery.noConflict();

function checkedfield(nm, txt,field){
   if(document.getElementById(nm) != null){
    if(document.getElementById(nm).disabled == true){
        document.getElementById(nm).disabled = false;
        var check = j$("input[id$=Checked_Item]").val();
        j$("input[id$=Checked_Item]").val(field + check);
        check =  j$("input[id$=Checked_Item]").val();
//ect...

You'll need this wherever you use jQuery. Good luck.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.