We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Uncaught ejDialog: methods/properties can be accessed only after plugin creation

Hi 

I have below scenario and issues observed. I trying to achieve a single page application like scenario.

In the home index page i have a syncfusion tab control which has three tabs 1 and 2 are static html tabs from the syncfusion tab sample and third one is to load the partial view for url like below
data.Add().ID("mvc").Text("Ajax Tab").Url("Home/Index2");

For the tab i have set the option for ajax like below
.AjaxSettings(ajax => ajax.ContentType("html").DataType("html").Async(true))

The index page is a normal view page with one syncfusion grid and one div below. On row click it will load the details of the item (edit/add partial views) in the div.


Now I created one partial view page called index2 which has the same functionality like index page except this one is a partial view. Grid is loading fine but the issue is when I click syncfusion grid row click I am getting the below error. (it is like partial view inside a partial view)

ej.web.all.min.js:10 Uncaught ejDialog: methods/properties can be accessed only after plugin creation

Tab issue: When I click on Ajax tab the the first tab and thrid tab both are highlighted. Please see attached files for your understanding


Attachment: Tab_issue_9450f521.zip

5 Replies

VA Venkatesh Ayothi Raman Syncfusion Team October 6, 2017 11:45 AM UTC

Hi Prashanth, 

Thanks for contacting Syncfusion support. 

Query #1:”Script error thrown while clicking the Grid record”  
This issue “Uncaught ejDialog: methods/properties can be accessed only after plugin creation” was reproduced when we access the Dialog API’s before that Dialog control rendered/created. We have prepared a sample by loading Grid from another partial view page(Index2) through Url which is mentioned like your update and we were unable to reproduce the reported issue.  
Please download the sample from  following link, 
 
If you still face the same issue, then could you please provide more details about your requirement with replication procedure. 
 
Query #2:” Tab issue 
We have prepared a sample by loading Grid from another partial view page(Index2) through Url as mentioned in your update. Unfortunately we were unable to reproduce the reported issue and items are loaded correctly based on selection. We have attached a sample for your reference. Please download the sample from following link, 
  
  
If we have misunderstood, please modify the above sample based on your scenario along with product version used in your sample to reproduce the issue in our end so that we can validate and provide a better solution at the earliest.  

Regards, 
Venkatesh Ayothiraman. 



PR Prashanth October 6, 2017 09:31 PM UTC

Hi Venkatesh,


Thank you. I just removed extra/duplicate script references in my partial view that are in _layout also it worked with out any issues.

Now the only problem i have is tab focus for newly added tab

var  tabObj = $("#defaultTabs").data("ejTab");

tabObj.addItem(url, tabname);

Tab is getting added but not able to set the focus to newly added tab.

Also the tab is loading partial view like a lazy loading. Means tab is fetching data when the focus on it.




VA Venkatesh Ayothi Raman Syncfusion Team October 9, 2017 11:51 AM UTC

Hi Prashanth, 

Thanks for the update. 

Query  #1: Now the only problem I have is tab focus for newly added tab. Tab is getting added but not able to set the focus to newly added tab.  
You can set focus for the newly added tab using showItem method of tab. Please refer the below given code  
<script>  
        var flag;  
          
        function additem() {  
            if (ej.isNullOrUndefined(flag)) {  
                var tabObj = $("#defaultTabs").data("ejTab");  
                tabObj.addItem("../Home/Index2", "AJAXTab");  
               tabObj.showItem(tabObj.items.last().index());  
            }  
            flag = true;  
        }  
    </script>  
We have modified our previous sample based on this. Please refer to the below given link  
Note: We have passed the index value of last tab item  in showItem because by default,  items will be added to the last index in tab. You can modify this index value based on your scenario.  
Query: Also the tab is loading partial view like a lazy loading. Means tab is fetching data when the focus on it.  
By default, content of AJAX tabs will be loaded when the tab item is active using Load on demand concept. This is the default behaviour of AJAX tabs. Please refer the below given link  
 
Regards, 
Venkatesh Ayothiraman 



PR Prashanth October 9, 2017 02:11 PM UTC

Thank you very much Venkatesh, Appreciate for your quick response. 

That solved my tab focus issue and lazy loading is ok as long as new tab got focused and page loads in to it.



VA Venkatesh Ayothi Raman Syncfusion Team October 10, 2017 04:55 AM UTC

Hi Prashanth, 

Thanks for the update. 

We are very happy to hear that your requirement is achieved. 

Regards, 
Venkatesh Ayothiraman. 


Loader.
Live Chat Icon For mobile
Up arrow icon