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
close icon

More advanced examples

Hi can you provide me, a more advanced example of using dropdown control with angular js ?
And another thing, can you give to me a list of all parameters that this component accept and the explanation? I saw the list provided on the documentation, but there aren't the angular properties or the syncfusion one!

Thanx alot!

6 Replies

KS Kaliswaran Shanmuga Sundaram Syncfusion Team February 3, 2015 01:28 PM UTC

Hi Danilo,

Thanks for using Syncfusion products.

Query: “Hi can you provide me, a more advanced example of using dropdown control with angular js ? And another thing, can you give to me a list of all parameters that this component accept and the explanation? I saw the list provided on the documentation, but there aren't the angular properties or the syncfusion one!”.

We would like to inform you that, we can use all syncfusion ejDropDownList API’s with angularJS. In this we need to add “e-” text before each and every properties and events.

Please refer the following code snippet to know how to use API’s and events with AngularJS.

[html]

<!--Dropdownlist control-->

<input id="bookSelect" e-fields-text="colorname" e-fields-value="colorcode" ej-dropdownlist e-datasource="dataList" e-value="value" e-itemsCount="10" e-watermarkText="select color" e-width="150" e-height="50" e-showRoundedCorner="true" e-change="selectedColor" />

 

For your convenience we have prepared a sample based on your requirement. You can also download the attached sample from the following location.

Sample Link: DropDownList-sample

In the above sample, we have showcased most of the properties and change event with angularJS for demo. It will be more helpful to you.

 Also if you want to know more about our components to getting started, please find the below link.

http://help.syncfusion.com/web

In order to know more detailed information please refer the below link which includes all the details to get started with our components.

http://help.syncfusion.com/cr/js

Also you can find all the samples of our components in the following link location.

http://js.syncfusion.com/demos/web/

If still you face any difficulties, please get back to us we will be happy to assist you.

Regards,

Kaliswaran S


DA Danilo February 3, 2015 03:09 PM UTC

Thanks alot,

But i need more in depth information for my 2 scenery:

I have an array that is populated by $resource, and a component thath seems not be refreshed when the page come up. I checked the array and it is populated but the component is empty.
how can i refresh the dropdown component datasource to view populated array data after the asynchrounous response?
$scope.data = $resource("/service.json").search({method:'GET'});
$scope.gridData = new ej.DataManager(data);
How can i configure the DataManager\Adaptor with method GET? and Where is the documentation on Custom Adaptor? I haven't find it , i only found DataManager one?
$scope.gridData = ej.DataManager({'
                            url:'/data/service.json'
                            ,adaptor: new ej.UrlAdaptor()
                           });

I need some example of this different approaches and some more informations about the adapter that the documentation don't give.

Many Tanks Danilo Caruso


KS Kaliswaran Shanmuga Sundaram Syncfusion Team February 4, 2015 02:05 PM UTC

Hi Danilo,

Thanks for using Syncfusion products.

Query : “How can i refresh the dropdown component datasource to view populated array data after the asynchrounous response? How can i configure the DataManager\Adaptor with method GET? and Where is the documentation on Custom Adaptor? I haven't find it , i only found DataManager one?

We have analyzed your requirement. We can achieve it in the sample level. Currently we are creating a sample to achieve your requirement. We need 5 business days to complete the sample and we will update you with the sample on 11th February.

Please let us know if you have further queries.

Regards,

Kaliswaran S



DA Danilo February 4, 2015 04:18 PM UTC

Please, can you answer at least to one of my 3 questions? I need an answer so can i follow for now a way of design.
After that i wait for documentation but i need at least an example of one of my questions.
Tanx alot Danilo Caruso


KS Kaliswaran Shanmuga Sundaram Syncfusion Team February 5, 2015 02:18 PM UTC

Hi Danilo,

We have logged a task to achieve your requirement in sample level. A support incident to track the status of this requirement has been created under your account. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents  

Please let us know if you have any queries.

Regards,

Kaliswaran S


BM Balaji Marimuthu Syncfusion Team February 6, 2015 01:18 PM UTC

Hi Danilo,

We have analyzed and achieved your requirement by using urladaptor in the DataManager. Please find the below code snippet.

<script type="text/javascript">

       

        angular.module('DropCtrl', ['ejangular'])

           .controller('DropDownCtrl', function ($scope) {

               $scope.value = "";

               $scope.gridData = ej.DataManager({

                   url: "/Grid/Data",

                   adaptor: "UrlAdaptor"

               });

           });

    </script>

For your convenience we have attached the sample. Please refer the following link to download the sample.

http://www.syncfusion.com/downloads/support/directtrac/118110/MvcApplication9842875902.zip

Query: Where is the documentation on Custom Adaptor? I haven't find it , i only found DataManager one?

Please find the documentation for the DataManager/Adaptor in the following link and also refer the custom adaptor in the same link.

http://help.syncfusion.com/ug/js/default.htm#!documents/dataadaptors.htm

 

Please let us know if you have any queries.

Regards,

Balaji Marimuthu



Loader.
Live Chat Icon For mobile
Up arrow icon