+ Start a Discussion
aditya prasadaditya prasad 

Dialog is not a function error in jquery

Hi,

I want to open a dialogbox oncick of a textbox.But I get the error dialog is not a function in jquery.

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
$(function() {
$('.quantityColumn input[type=text]').click(function() { alert('Hello'); $( "#dialog-form" ).dialog({ autoOpen: false }); $( "#dialog-form" ).dialog({ autoOpen: true }); }); });


But I get an error as typeerror $(...).dialog is not a function. I used jquery files from same version and also initializes dialog(), but still get the error. Where I am doing the mistake. Any help will be appreciated.
Regards, Aditya
Best Answer chosen by aditya prasad
aditya prasadaditya prasad
I got the solution. It was due to version mismatch. 

Thank you all for your help

All Answers

Temoc MunozTemoc Munoz
Hi aditya.

Are you getting any JavaScript errors in the console? (i.e. type F12 on your browser and check under Console)

Possible solutions:
1. Create a static resource for each of your external libraries and use them as follows: 
<script src="{!URLFOR($Resource.YOURSTATIC_RESOURCE_NAME,'PATH OF YOUR FILE ')}" />

2. Import using:  
    <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> insetad of <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>

3. Replace '$' for 'jQuery in your jQuery code

Hope this helps.

Thanks
 
aditya prasadaditya prasad
Hi Temoc,

Yes i was geeting JavaScript/jQuery error.
I got it using following code.
 var jj=jQuery.noConflict();
                jj(document).ready(function() {


Regarding static resource I will make it later , I have put the url  for testing purpose. But now i am getting some othere error if  am using above code. For other function I get  a typeerror  cannot read property 'oApi' undefined. Below is code for where I have used oApi.

<script type="text/javascript" charset="utf-8" src="{!URLFOR($Resource.DataTables, '/DataTables-1.9.4/media/js/jquery.dataTables.js')}"/>
<script type="text/javascript" charset="utf-8" src="{!URLFOR($Resource.DataTables, '/DataTables-1.9.4/extras/FixedHeader/js/FixedHeader.js')}"/>

$.fn.dataTableExt.oApi.fnProcessingIndicator = function ( oSettings, onoff )
                {
                    if( typeof(onoff) == 'undefined' )
                    {
                        onoff=true;
                    }
                    this.oApi._fnProcessingDisplay( oSettings, onoff );
                };

For this reason my page doesn't render properly though everything works fine.If I remove above code for conflict(), then page renders perfectly.
I have no clue what to do on this.  Is this something related to Static resource, because I am not using Static resource for my last post?. Any guess on this.

Thanks,
Aditya
sandeep reddy 37sandeep reddy 37
 var b=jQuery.noConflict();
                b(document).ready(function() {
first write this then after you will abel to decleare j queary
 
Temoc MunozTemoc Munoz
<script type="text/javascript" charset="utf-8" src="{!URLFOR($Resource.DataTables, '/DataTables-1.9.4/media/js/jquery.dataTables.js')}"/>
<script type="text/javascript" charset="utf-8" src="{!URLFOR($Resource.DataTables, '/DataTables-1.9.4/extras/FixedHeader/js/FixedHeader.js')}"/>

<script>
    var jj=jQuery.noConflict(); jj(document).ready(function() {
      jj.fn.dataTableExt.oApi.fnProcessingIndicator = function ( oSettings, onoff )
      {
         if( typeof(onoff) == 'undefined' )
         {
             onoff=true;
         }
         this.oApi._fnProcessingDisplay( oSettings, onoff );
      };
  }
</script>

 
aditya prasadaditya prasad
I got the solution. It was due to version mismatch. 

Thank you all for your help
This was selected as the best answer